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

style(design-system): normalize font-weight literals (400/500/600/700) to tokens

Browse Source 
Mechanical, value-preserving: font-weight: 400/500/600/700 -> var(--font-weight-normal/medium/semibold/bold, <same value>) across src/app.
Note: cart.component.scss now sits ~771 bytes over its per-file budget
in angular.json due to longer var() strings; non-fatal build warning,
noted in docs/UI-DESIGN-REVIEW.md as a follow-up (either bump the
component style budget slightly or accept the warning).
This commit is contained in:
sdarbinyan
2026-07-20 03:28:56 +04:00
parent be59db2e2d
commit 5c54541b4c
74 changed files with 286 additions and 286 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/features/project-editor/components/html-editor/marketplace-html-editor.component.scss
View File

@@ -50,7 +50,7 @@
&:focus-visible { outline: 2px solid var(--color-primary, #2f8f5b); outline-offset: 1px; }
}
.html-editor-toolbar__btn--bold { font-weight: 700; }
.html-editor-toolbar__btn--bold { font-weight: var(--font-weight-bold, 700); }
.html-editor-toolbar__btn--italic { font-style: italic; font-family: serif; }
.html-editor-toolbar__btn--underline { text-decoration: underline; }
.html-editor-toolbar__btn--wide { padding: 0 10px; font-size: var(--font-size-sm, 0.8125rem); color: var(--text-secondary, #6b7280); }

8
src/app/features/project-editor/components/project-editor-nav.component.scss
View File

@@ -20,7 +20,7 @@
.editor-nav-group__label {
flex: 1 1 auto;
font-size: var(--font-size-xs, 0.75rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
letter-spacing: 0.4px;
text-transform: uppercase;
color: var(--text-light);
@@ -66,7 +66,7 @@
background: none;
color: var(--text-primary);
padding: 0 var(--space-sm);
font-weight: 500;
font-weight: var(--font-weight-medium, 500);
font-size: var(--font-size-lg, 1rem);
cursor: pointer;
text-decoration: none;
@@ -84,7 +84,7 @@
&.active {
background: color-mix(in srgb, var(--primary-color) 8%, transparent);
color: var(--primary-color);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
}
}
@@ -129,7 +129,7 @@
background: var(--error-color);
color: #fff;
font-size: var(--font-size-xs, 0.75rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
line-height: 1;
flex-shrink: 0;
}

22
src/app/features/project-editor/pages/builder-overview-page.component.scss
View File

@@ -13,7 +13,7 @@
gap: var(--space-xs);
align-self: flex-start;
font-size: var(--font-size-xs, 0.75rem);
font-weight: 500;
font-weight: var(--font-weight-medium, 500);
color: var(--text-secondary);
text-decoration: none;
@@ -40,7 +40,7 @@
.builder-overview__eyebrow {
margin: 0;
font-size: var(--font-size-xs, 0.75rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
letter-spacing: 0.4px;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.75);
@@ -49,7 +49,7 @@
.builder-overview__title {
margin: 0;
font-size: clamp(1.5rem, 3vw, 2rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
}
.builder-overview__subtitle {
@@ -78,7 +78,7 @@
.builder-overview__readiness-label {
margin: var(--space-xs) 0 0;
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
}
.builder-overview__readiness-hint {
@@ -104,7 +104,7 @@
.builder-overview__next-step-label {
margin: 0;
font-size: var(--font-size-xs, 0.75rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
letter-spacing: 0.4px;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.75);
@@ -112,14 +112,14 @@
.builder-overview__next-step-link {
color: #fff;
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
font-size: var(--font-size-lg, 1rem);
text-decoration: underline;
}
.builder-overview__next-step-done {
margin: 0;
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
}
.builder-overview__section {
@@ -130,7 +130,7 @@
h2 {
margin: 0;
font-size: var(--font-size-xl, 1.125rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
color: var(--text-primary);
}
}
@@ -201,7 +201,7 @@
.builder-overview__card-title {
margin: 0;
font-size: var(--font-size-xl, 1.125rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
color: var(--text-primary);
}
@@ -214,7 +214,7 @@
.builder-overview__card-cta {
font-size: var(--font-size-xs, 0.75rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
color: var(--primary-color);
}
@@ -268,7 +268,7 @@
background: var(--bg-primary);
color: var(--text-primary);
text-decoration: none;
font-weight: 500;
font-weight: var(--font-weight-medium, 500);
&:hover {
border-color: var(--primary-color);

10
src/app/features/project-editor/pages/project-editor-page.component.scss
View File

@@ -38,7 +38,7 @@
margin-bottom: var(--space-md);
border-radius: var(--radius-sm);
color: var(--text-primary);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
text-decoration: none;
&:hover {
@@ -160,14 +160,14 @@
h1 {
margin: 0;
font-size: clamp(1.5rem, 3vw, 2rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
color: var(--text-primary);
}
}
.project-editor-layout__badge {
font-size: var(--font-size-xs, 0.75rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
letter-spacing: 0.4px;
text-transform: uppercase;
padding: 2px 8px;
@@ -205,7 +205,7 @@
border-radius: var(--radius-sm);
background: var(--bg-primary);
color: var(--text-primary);
font-weight: 500;
font-weight: var(--font-weight-medium, 500);
cursor: pointer;
flex-shrink: 0;
white-space: nowrap;
@@ -233,7 +233,7 @@
h2 {
margin: 0 0 4px;
font-size: var(--font-size-xs, 0.75rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
letter-spacing: 0.4px;
text-transform: uppercase;
color: var(--text-light);

14
src/app/features/project-editor/sections/brand/brand-overview.component.scss
View File

@@ -24,7 +24,7 @@
border-radius: 50%;
display: grid;
place-items: center;
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
font-size: var(--font-size-xl, 1.125rem);
color: var(--text-primary);
@@ -45,7 +45,7 @@
h2 {
margin: 0;
font-size: var(--font-size-xl, 1.125rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
color: var(--text-primary);
}
@@ -60,7 +60,7 @@
display: flex;
align-items: center;
gap: var(--space-xs);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
color: var(--primary-color);
&--done {
@@ -117,7 +117,7 @@
h3 {
margin: 0 0 var(--space-sm);
font-size: var(--font-size-xs, 0.75rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
letter-spacing: 0.4px;
text-transform: uppercase;
color: var(--text-light);
@@ -161,7 +161,7 @@
background: color-mix(in srgb, var(--warning-color) 12%, transparent);
color: var(--warning-color);
font-size: var(--font-size-xs, 0.75rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
}
.brand-overview__type-sample {
@@ -174,7 +174,7 @@
.brand-overview__type-heading {
margin: 0 0 4px;
font-size: var(--font-size-xl, 1.125rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
color: var(--text-primary);
}
@@ -205,7 +205,7 @@
.brand-overview__social-title {
margin: 0;
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
font-size: var(--font-size-lg, 1rem);
color: var(--text-primary);
}

6
src/app/features/project-editor/sections/homepage/homepage-overview.component.scss
View File

@@ -24,7 +24,7 @@
border-radius: 50%;
display: grid;
place-items: center;
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
font-size: var(--font-size-xl, 1.125rem);
color: var(--text-primary);
@@ -45,7 +45,7 @@
h2 {
margin: 0;
font-size: var(--font-size-xl, 1.125rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
color: var(--text-primary);
}
@@ -64,7 +64,7 @@
display: flex;
align-items: center;
gap: var(--space-xs);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
color: var(--primary-color);
&--done {

14
src/app/features/project-editor/sections/section.shared.scss
View File

@@ -34,7 +34,7 @@ label {
display: grid;
gap: 6px;
color: var(--text-primary, #1e3c38);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
}
label.full,
@@ -44,7 +44,7 @@ app-form-field.full {
.field-desc {
display: block;
font-weight: 400;
font-weight: var(--font-weight-normal, 400);
font-size: var(--font-size-xs, 0.75rem);
line-height: 1.4;
color: var(--text-secondary, #5f6e6a);
@@ -109,7 +109,7 @@ button {
background: #497671;
color: #fff;
padding: 0 14px;
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
cursor: pointer;
transition: background-color var(--transition-fast, 120ms ease),
border-color var(--transition-fast, 120ms ease),
@@ -207,7 +207,7 @@ button.secondary {
th {
color: var(--text-secondary, #5f6e6a);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
}
.preview-before {
@@ -217,7 +217,7 @@ button.secondary {
.preview-after {
color: var(--text-primary, #1e3c38);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
}
}
@@ -235,8 +235,8 @@ button.secondary {
display: inline-flex; align-items: center; gap: 6px;
padding: 4px 10px; border-radius: var(--radius-full, 999px);
border: 1px solid var(--border-color, #d3dad9);
font-size: var(--font-size-sm, 0.8125rem); font-weight: 600;
em { font-style: normal; font-weight: 400; font-size: var(--font-size-xs, 0.75rem); color: var(--text-secondary, #6b7280); }
font-size: var(--font-size-sm, 0.8125rem); font-weight: var(--font-weight-semibold, 600);
em { font-style: normal; font-weight: var(--font-weight-normal, 400); font-size: var(--font-size-xs, 0.75rem); color: var(--text-secondary, #6b7280); }
}
.languages-summary__chip--default { border-color: var(--color-primary, #2f8f5b); }
.languages-summary__manage { font-size: var(--font-size-sm, 0.8125rem); text-decoration: underline; color: var(--text-primary, #1e3c38); }

6
src/app/features/project-editor/sections/widgets-section.component.scss
View File

@@ -19,7 +19,7 @@
.widget-card__title {
margin: 0;
font-size: var(--font-size-xl, 1.125rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
color: var(--text-primary);
flex: 1 1 auto;
min-width: 120px;
@@ -27,7 +27,7 @@
.widget-card__hidden-badge {
font-size: var(--font-size-xs, 0.75rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
letter-spacing: 0.4px;
text-transform: uppercase;
padding: 2px 8px;
@@ -90,7 +90,7 @@
summary {
cursor: pointer;
font-size: var(--font-size-xs, 0.75rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
color: var(--text-light);
}
}