shkim4/HMDesign
Private
Public Access
1
0 Fork 0
Code Activity

style(admin): unify text color hierarchy with foundation gray

Browse Source
This commit is contained in:
shkim4 committed 2026-11-11 14:33:58 +09:00
1 parent 5ffe56a9aa
commit 0486cecd5c
26 files changed
+186 -52
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/org-chart/src/styles/employee-card.css
+5 -4
View File
@@ -203,7 +203,8 @@
.hm-orgchart-employee:is([data-card-asset], [data-card-layout="compact"])[data-card-asset-size="leader"] .hm-orgchart-avatar { flex-basis: 32px; width: 32px; height: 32px; }
.hm-orgchart-employee:is([data-card-asset], [data-card-layout="compact"])[data-card-asset-size="representative"] .hm-orgchart-avatar { flex-basis: 36px; width: 36px; height: 36px; }
.hm-orgchart-employee:is([data-card-asset], [data-card-layout="compact"]) {
--hm-orgchart-person-position-color: #797979;
/* Secondary text on the light card artwork; #797979 was 3.48:1 on #E0E6F4. */
--hm-orgchart-person-position-color: var(--hm-orgchart-resolved-fg-secondary);
--hm-orgchart-person-position-size: 15px;
--hm-orgchart-person-position-line-height: 18px;
--hm-orgchart-person-position-letter-spacing: -0.6px;
@@ -246,7 +247,7 @@
letter-spacing: var(--hm-orgchart-person-position-letter-spacing);
}
.hm-orgchart-employee:is([data-card-asset], [data-card-layout="compact"]) .hm-orgchart-person-name {
color: var(--hm-orgchart-card-color, #071D3A);
color: var(--hm-orgchart-card-color, var(--hm-orgchart-resolved-fg-primary));
font-size: var(--hm-orgchart-person-name-size);
font-weight: 700;
line-height: var(--hm-orgchart-person-name-line-height);
@@ -255,7 +256,7 @@
text-overflow: clip;
}
.hm-orgchart-employee:is([data-card-asset], [data-card-layout="compact"]) .hm-orgchart-person-name[data-name-overflow="true"] { text-overflow: ellipsis; }
.hm-orgchart-employee:is([data-card-asset], [data-card-layout="compact"]):is([data-card-asset-size="employee"], [data-card-layout="compact"]) .hm-orgchart-person-name { color: var(--hm-orgchart-card-color, #323232); }
.hm-orgchart-employee:is([data-card-asset], [data-card-layout="compact"]):is([data-card-asset-size="employee"], [data-card-layout="compact"]) .hm-orgchart-person-name { color: var(--hm-orgchart-card-color, var(--hm-orgchart-resolved-fg-primary)); }
.hm-orgchart-employee:is([data-card-asset], [data-card-layout="compact"]) .hm-orgchart-person-name:focus-visible { outline: 2px solid var(--hm-orgchart-resolved-stroke-input-focus); outline-offset: 1px; }
.hm-orgchart-employee[data-card-asset-size="employee"] .hm-orgchart-affiliation-mark { top: 2px; right: 1px; width: 20px; height: 20px; min-height: 20px; }
.hm-orgchart-employee:is([data-card-asset], [data-card-layout="compact"]):is([data-card-asset-size="employee"], [data-card-layout="compact"]) .hm-orgchart-affiliation-fallback { font-size: 6px; white-space: nowrap; }
@@ -331,5 +332,5 @@
/* Status is retained for assistive reading; the specified two-line card
composition has no third status row. Supplementary status cards are intact. */
.hm-orgchart-employee:is([data-card-asset], [data-card-layout="compact"]) .hm-orgchart-status-label { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.hm-orgchart-person-name-tooltip { position: fixed; z-index: 10; box-sizing: border-box; max-width: min(320px, calc(100vw - 16px)); padding: 6px 8px; border: 1px solid #224387; border-radius: 4px; background: #ffffff; color: #071D3A; font-family: var(--hm-orgchart-resolved-font-family); font-size: 14px; line-height: 20px; overflow-wrap: anywhere; pointer-events: auto; }
.hm-orgchart-person-name-tooltip { position: fixed; z-index: 10; box-sizing: border-box; max-width: min(320px, calc(100vw - 16px)); padding: 6px 8px; border: 1px solid #224387; border-radius: 4px; background: #ffffff; color: var(--hm-orgchart-resolved-fg-primary); font-family: var(--hm-orgchart-resolved-font-family); font-size: 14px; line-height: 20px; overflow-wrap: anywhere; pointer-events: auto; }
.hm-orgchart-person-name-tooltip[hidden] { display: none; }