sdarbinyan/marketplaces
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(design-system): roll out font-size scale across storefront/builder/backoffice

Browse Source 
Mechanical, value-preserving substitution: every literal font-size
declaration across src/app (89 files) that matched one of the 9
typography scale steps introduced earlier (--font-size-xs..4xl) was
replaced with var(--font-size-STEP, <same-or-nearest-step-value>).

Values within ~0.03rem/1px of a scale step were snapped to that step
(e.g. 0.85rem and 0.8rem both -> --font-size-sm/0.8125rem; 0.9rem and
0.875rem -> --font-size-base/0.875rem) to consolidate roughly 15
near-duplicate sizes down to the 9-step scale, per the RC design-system
finalization brief. This eliminates most of the font-size fragmentation
found across the app (previously: 0.7/0.72/0.75/0.78/0.8/0.8125/0.85/
0.875/0.9/0.9375/0.95/1/1.05/1.1/1.125/1.15/1.2/1.25/1.3/1.35/1.4/1.5/
1.75/2rem all in live use simultaneously).

Not touched (deliberately, see docs/UI-DESIGN-REVIEW.md): 3rem+ display
sizes (too large a jump to any existing step, would need a --font-size-5xl
addition), font-size values expressed via clamp()/calc(), and any
component listed as intentionally distinct (code-editor syntax tokens,
theme brand colors).
This commit is contained in:
sdarbinyan
2026-07-20 03:26:17 +04:00
parent aaa3604cd4
commit 7cb1c8c3c6
88 changed files with 538 additions and 538 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/features/content-management/components/content-dashboard/content-dashboard.component.scss
View File

@@ -35,14 +35,14 @@
h4 {
margin: 0;
font-size: 0.95rem;
font-size: var(--font-size-md, 0.9375rem);
font-weight: 700;
}
p {
margin: 0;
color: var(--text-secondary, #5f6e6a);
font-size: 0.9rem;
font-size: var(--font-size-base, 0.875rem);
}
}

6
src/app/features/content-management/components/content-health-widget/content-health-widget.component.scss
View File

@@ -10,14 +10,14 @@
h4 {
margin: 0;
font-size: 0.95rem;
font-size: var(--font-size-md, 0.9375rem);
font-weight: 700;
color: var(--text-primary, #1e3c38);
}
}
.health-widget__percent {
font-size: 1.05rem;
font-size: var(--font-size-lg, 1rem);
font-weight: 800;
color: var(--brand-primary, #1e8a6e);
}
@@ -41,7 +41,7 @@
padding: 0;
display: grid;
gap: 6px;
font-size: 0.85rem;
font-size: var(--font-size-sm, 0.8125rem);
color: var(--text-secondary, #5f6e6a);
li {

10
src/app/features/content-management/components/page-card/page-card.component.scss
View File

@@ -20,7 +20,7 @@
}
.page-card-tile__icon {
font-size: 1.5rem;
font-size: var(--font-size-3xl, 1.5rem);
line-height: 1;
flex-shrink: 0;
}
@@ -40,7 +40,7 @@
.page-card-tile__title {
margin: 0;
font-size: 1rem;
font-size: var(--font-size-lg, 1rem);
font-weight: 700;
color: var(--text-primary, #1e3c38);
overflow: hidden;
@@ -50,7 +50,7 @@
.page-card-tile__slug {
margin: 0;
font-size: 0.8rem;
font-size: var(--font-size-sm, 0.8125rem);
color: var(--text-secondary, #5f6e6a);
font-family: monospace;
}
@@ -64,13 +64,13 @@
}
.page-card-tile__visibility {
font-size: 0.75rem;
font-size: var(--font-size-xs, 0.75rem);
color: var(--text-tertiary, #9aa6a2);
}
.page-card-tile__updated {
margin: 4px 0 0;
font-size: 0.75rem;
font-size: var(--font-size-xs, 0.75rem);
color: var(--text-tertiary, #9aa6a2);
}

10
src/app/features/content-management/components/page-editor/page-editor.component.scss
View File

@@ -13,7 +13,7 @@
.page-editor__title {
margin: 0;
font-size: 1.15rem;
font-size: var(--font-size-xl, 1.125rem);
font-weight: 700;
color: var(--text-primary, #1e3c38);
flex: 1;
@@ -38,7 +38,7 @@
cursor: pointer;
padding: 10px 14px;
border-radius: 8px 8px 0 0;
font-size: 0.9rem;
font-size: var(--font-size-base, 0.875rem);
font-weight: 600;
color: var(--text-secondary, #5f6e6a);
display: inline-flex;
@@ -67,7 +67,7 @@
.page-editor__explain {
margin: 0;
font-size: 0.85rem;
font-size: var(--font-size-sm, 0.8125rem);
color: var(--text-secondary, #5f6e6a);
}
@@ -92,7 +92,7 @@
}
.media-block__label {
font-size: 0.85rem;
font-size: var(--font-size-sm, 0.8125rem);
font-weight: 700;
color: var(--text-primary, #1e3c38);
}
@@ -129,6 +129,6 @@
.page-editor__error {
color: var(--danger, #c0392b);
font-size: 0.8rem;
font-size: var(--font-size-sm, 0.8125rem);
margin: 0;
}

2
src/app/features/content-management/components/static-page-preview/static-page-preview.component.scss
View File

@@ -29,7 +29,7 @@
.static-page-preview__title {
margin: 0 0 1rem;
font-size: 1.5rem;
font-size: var(--font-size-3xl, 1.5rem);
font-weight: 700;
color: var(--text-primary, #1e3c38);
}