sdarbinyan/marketplaces
0
0
Fork 0
Code Issues Pull Requests Actions 2 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

74
src/app/pages/item-detail/item-detail.component.scss
View File

@@ -48,7 +48,7 @@ $dx-card-bg: #f5f3f9;
color: white;
text-decoration: none;
border-radius: var(--radius-lg, 13px);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
transition: all 0.2s;
&:hover {
@@ -187,7 +187,7 @@ $dx-card-bg: #f5f3f9;
.dx-title {
font-family: $dx-font;
font-size: var(--font-size-4xl, 2rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
color: $dx-dark;
margin: 0;
line-height: 1.3;
@@ -209,7 +209,7 @@ $dx-card-bg: #f5f3f9;
}
.dx-rating-value {
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
font-size: var(--font-size-lg, 1rem);
color: $dx-dark;
}
@@ -242,7 +242,7 @@ $dx-card-bg: #f5f3f9;
color: white;
padding: 3px 10px;
border-radius: 20px;
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
font-size: var(--font-size-sm, 0.8125rem);
}
@@ -270,7 +270,7 @@ $dx-card-bg: #f5f3f9;
align-items: center;
gap: 6px;
font-size: var(--font-size-md, 0.9375rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
&.high { color: #2ed573; }
&.medium { color: #ffa502; }
@@ -294,7 +294,7 @@ $dx-card-bg: #f5f3f9;
border-radius: var(--radius-lg, 13px);
font-family: $dx-font;
font-size: var(--font-size-xl, 1.125rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
cursor: pointer;
transition: all 0.2s;
display: flex;
@@ -331,7 +331,7 @@ $dx-card-bg: #f5f3f9;
.variant-label {
font-size: var(--font-size-base, 0.875rem);
color: #6b7280;
font-weight: 500;
font-weight: var(--font-weight-medium, 500);
}
.variant-chip {
@@ -340,7 +340,7 @@ $dx-card-bg: #f5f3f9;
padding: 6px 14px;
border-radius: var(--radius-sm, 8px);
font-size: var(--font-size-base, 0.875rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
border: 1.5px solid $dx-border;
background: rgba(73, 118, 113, 0.06);
color: $dx-primary;
@@ -399,7 +399,7 @@ $dx-card-bg: #f5f3f9;
}
.attribute-value {
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
color: #1a1a1a;
}
}
@@ -417,7 +417,7 @@ $dx-card-bg: #f5f3f9;
.dx-delivery-title, .alt-delivery-title {
margin: 0;
font-size: var(--font-size-lg, 1rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
color: $dx-dark;
}
@@ -447,7 +447,7 @@ $dx-card-bg: #f5f3f9;
.dx-delivery-price, .alt-delivery-price {
flex-shrink: 0;
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
color: $dx-primary;
font-size: var(--font-size-md, 0.9375rem);
}
@@ -460,7 +460,7 @@ $dx-card-bg: #f5f3f9;
background: rgba(73, 118, 113, 0.12);
color: $dx-primary;
font-size: var(--font-size-base, 0.875rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
}
.dx-description {
@@ -470,7 +470,7 @@ $dx-card-bg: #f5f3f9;
h2 {
font-family: $dx-font;
font-size: var(--font-size-3xl, 1.5rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
color: $dx-dark;
margin: 0 0 12px 0;
}
@@ -489,7 +489,7 @@ $dx-card-bg: #f5f3f9;
h2 {
font-family: $dx-font;
font-size: var(--font-size-3xl, 1.5rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
color: $dx-dark;
margin: 0 0 24px 0;
}
@@ -507,7 +507,7 @@ $dx-card-bg: #f5f3f9;
margin: 0 0 20px 0;
color: $dx-dark;
font-size: var(--font-size-xl, 1.125rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
}
}
@@ -518,7 +518,7 @@ $dx-card-bg: #f5f3f9;
display: block;
margin-bottom: 8px;
color: $dx-dark;
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
font-size: var(--font-size-md, 0.9375rem);
}
}
@@ -595,7 +595,7 @@ $dx-card-bg: #f5f3f9;
padding: 12px 28px;
border-radius: var(--radius-lg, 13px);
font-family: $dx-font;
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
font-size: var(--font-size-md, 0.9375rem);
cursor: pointer;
transition: all 0.2s;
@@ -637,7 +637,7 @@ $dx-card-bg: #f5f3f9;
display: flex;
align-items: center;
gap: 10px;
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
font-size: var(--font-size-md, 0.9375rem);
animation: dxSlideIn 0.3s ease-out;
@@ -692,7 +692,7 @@ $dx-card-bg: #f5f3f9;
}
.dx-reviewer-name {
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
color: $dx-dark;
font-size: var(--font-size-md, 0.9375rem);
}
@@ -728,7 +728,7 @@ $dx-card-bg: #f5f3f9;
h2 {
font-family: $dx-font;
font-size: var(--font-size-3xl, 1.5rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
color: $dx-dark;
margin: 0 0 24px 0;
}
@@ -765,7 +765,7 @@ $dx-card-bg: #f5f3f9;
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
font-size: var(--font-size-sm, 0.8125rem);
&.q {
@@ -1134,7 +1134,7 @@ $dx-card-bg: #f5f3f9;
color: white;
text-decoration: none;
border-radius: var(--radius-lg);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
transition: all 0.3s;
&:hover {
@@ -1242,7 +1242,7 @@ $dx-card-bg: #f5f3f9;
.alt-info {
.alt-title {
font-size: var(--font-size-4xl, 2rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
color: var(--text-primary);
margin: 0 0 1rem 0;
line-height: 1.3;
@@ -1260,7 +1260,7 @@ $dx-card-bg: #f5f3f9;
}
.value {
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
color: var(--text-primary);
}
@@ -1294,7 +1294,7 @@ $dx-card-bg: #f5f3f9;
color: white;
padding: 0.25rem 0.75rem;
border-radius: var(--radius-md);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
font-size: var(--font-size-sm, 0.8125rem);
}
@@ -1317,7 +1317,7 @@ $dx-card-bg: #f5f3f9;
border-radius: var(--radius-md);
.stock-label {
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
color: var(--text-secondary);
}
@@ -1325,7 +1325,7 @@ $dx-card-bg: #f5f3f9;
display: flex;
align-items: center;
gap: 0.5rem;
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
.dot {
width: 10px;
@@ -1359,7 +1359,7 @@ $dx-card-bg: #f5f3f9;
border: none;
border-radius: var(--radius-lg);
font-size: var(--font-size-xl, 1.125rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
cursor: pointer;
display: flex;
align-items: center;
@@ -1382,7 +1382,7 @@ $dx-card-bg: #f5f3f9;
.alt-description {
h3 {
font-size: var(--font-size-2xl, 1.25rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
color: var(--text-primary);
margin: 0 0 1rem 0;
}
@@ -1403,7 +1403,7 @@ $dx-card-bg: #f5f3f9;
h2 {
font-size: var(--font-size-4xl, 2rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
color: var(--text-primary);
margin: 0 0 2rem 0;
}
@@ -1439,7 +1439,7 @@ $dx-card-bg: #f5f3f9;
gap: 0.25rem;
.reviewer-name {
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
font-size: var(--font-size-lg, 1rem);
color: var(--text-primary);
}
@@ -1485,7 +1485,7 @@ $dx-card-bg: #f5f3f9;
h3 {
font-size: var(--font-size-2xl, 1.25rem);
font-weight: 700;
font-weight: var(--font-weight-bold, 700);
color: var(--text-primary);
margin: 0 0 1.5rem 0;
}
@@ -1496,7 +1496,7 @@ $dx-card-bg: #f5f3f9;
label {
display: block;
font-size: var(--font-size-md, 0.9375rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
color: var(--text-primary);
margin-bottom: 0.75rem;
}
@@ -1592,7 +1592,7 @@ $dx-card-bg: #f5f3f9;
border: none;
border-radius: var(--radius-md);
font-size: var(--font-size-md, 0.9375rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
cursor: pointer;
transition: all 0.3s ease;
@@ -1635,7 +1635,7 @@ $dx-card-bg: #f5f3f9;
margin-top: 1rem;
border-radius: var(--radius-md);
font-size: var(--font-size-md, 0.9375rem);
font-weight: 500;
font-weight: var(--font-weight-medium, 500);
animation: slideDown 0.3s ease;
svg {
@@ -1940,7 +1940,7 @@ $dx-card-bg: #f5f3f9;
padding: 3px 10px;
border-radius: var(--radius-xs, 4px);
font-size: var(--font-size-xs, 0.75rem);
font-weight: 600;
font-weight: var(--font-weight-semibold, 600);
text-transform: uppercase;
letter-spacing: 0.5px;
color: #fff;
@@ -1992,7 +1992,7 @@ $dx-card-bg: #f5f3f9;
.spec-key {
color: #697777;
font-weight: 500;
font-weight: var(--font-weight-medium, 500);
width: 40%;
white-space: nowrap;
}