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

10
src/app/features/backoffice/media/components/asset-details-drawer/asset-details-drawer.component.scss
View File

@@ -26,18 +26,18 @@
.asset-details__facts dt {
color: var(--text-tertiary, #9aa6a2);
font-size: 0.8rem;
font-size: var(--font-size-sm, 0.8125rem);
}
.asset-details__facts dd {
margin: 0;
font-size: 0.85rem;
font-size: var(--font-size-sm, 0.8125rem);
color: var(--text-primary, #1e3c38);
}
.asset-details__usage h4 {
margin: 0 0 6px;
font-size: 0.9rem;
font-size: var(--font-size-base, 0.875rem);
}
.asset-details__usage ul {
@@ -52,7 +52,7 @@
.asset-details__hint {
margin: 0;
color: var(--text-secondary, #5f6e6a);
font-size: 0.85rem;
font-size: var(--font-size-sm, 0.8125rem);
}
.asset-details__edit {
@@ -65,7 +65,7 @@
.asset-details__warning {
margin: 0;
color: var(--danger, #c0392b);
font-size: 0.8rem;
font-size: var(--font-size-sm, 0.8125rem);
}
.asset-details__actions {

6
src/app/features/backoffice/media/components/asset-tile/asset-tile.component.scss
View File

@@ -42,7 +42,7 @@
display: flex;
align-items: center;
justify-content: center;
font-size: 0.75rem;
font-size: var(--font-size-xs, 0.75rem);
color: var(--text-secondary, #5f6e6a);
text-align: center;
padding: 8px;
@@ -54,7 +54,7 @@
}
.asset-tile__filename {
font-size: 0.8rem;
font-size: var(--font-size-sm, 0.8125rem);
font-weight: 700;
color: var(--text-primary, #1e3c38);
overflow: hidden;
@@ -63,7 +63,7 @@
}
.asset-tile__sub {
font-size: 0.72rem;
font-size: var(--font-size-xs, 0.75rem);
color: var(--text-tertiary, #9aa6a2);
}

6
src/app/features/backoffice/media/media-library-page.component.scss
View File

@@ -48,7 +48,7 @@
padding: 14px;
text-align: center;
color: var(--text-tertiary, #9aa6a2);
font-size: 0.85rem;
font-size: var(--font-size-sm, 0.8125rem);
}
.media-page__dropzone--active {
@@ -75,7 +75,7 @@
.media-page__guide {
margin: 0;
font-size: 0.85rem;
font-size: var(--font-size-sm, 0.8125rem);
color: var(--text-secondary, #5f6e6a);
text-align: center;
}
@@ -92,6 +92,6 @@
align-items: center;
gap: 10px;
color: var(--danger, #c0392b);
font-size: 0.85rem;
font-size: var(--font-size-sm, 0.8125rem);
margin: 0;
}

2
src/app/features/backoffice/shared/backoffice-coming-soon-page.component.scss
View File

@@ -11,7 +11,7 @@
.coming-soon__title {
margin: 0;
font-size: 24px;
font-size: var(--font-size-3xl, 1.5rem);
font-weight: 800;
color: var(--text-primary, #1e3c38);
}