style(design-system): normalize exact-match border-radius literals to tokens

Mechanical sweep for border-radius: 4px/8px/12px/13px/999px replaced
with var(--radius-xs/sm/md/lg/full, <same value>) across src/app.
Only exact matches to existing token values were touched (20px, 16px,
10px, 6px, 3px, 2px etc. were left as-is since no token maps to them
without a visible size change on at least one tenant theme — see
docs/UI-DESIGN-REVIEW.md).
This commit is contained in:
sdarbinyan
2026-07-20 03:27:25 +04:00
parent 7cb1c8c3c6
commit be59db2e2d
51 changed files with 130 additions and 130 deletions

View File

@@ -42,7 +42,7 @@
.recommendation-list a:focus-visible, .health-checks a:focus-visible { outline: 2px solid var(--color-primary, #2f8f5b); outline-offset: 2px; }
.muted { color: var(--text-secondary, #6b7280); font-size: var(--font-size-sm, 0.8125rem); }
.health-widget__bar { height: 8px; border-radius: 999px; background: var(--surface-muted, #eef2f0); overflow: hidden; }
.health-widget__bar { height: 8px; border-radius: var(--radius-full, 999px); background: var(--surface-muted, #eef2f0); overflow: hidden; }
.health-widget__bar-fill { height: 100%; background: var(--brand-primary, #1e8a6e); transition: width 0.3s ease; }
.health-percent { margin: 0; font-size: var(--font-size-sm, 0.8125rem); color: var(--text-secondary, #6b7280); }

View File

@@ -6,7 +6,7 @@
.category-health__bar {
height: 6px;
border-radius: 999px;
border-radius: var(--radius-full, 999px);
background: var(--surface-muted, #eef2f0);
overflow: hidden;
}

View File

@@ -1,5 +1,5 @@
.review-health { display: grid; gap: 6px; align-items: center; }
.review-health__bar { height: 6px; border-radius: 999px; background: var(--surface-muted, #eef2f0); overflow: hidden; }
.review-health__bar { height: 6px; border-radius: var(--radius-full, 999px); background: var(--surface-muted, #eef2f0); overflow: hidden; }
.review-health__bar-fill { height: 100%; background: var(--brand-primary, #1e8a6e); }
.review-health__percent { font-size: var(--font-size-xs, 0.75rem); font-weight: 700; color: var(--text-secondary, #5f6e6a); }
.review-health__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: var(--font-size-xs, 0.75rem); color: var(--text-secondary, #5f6e6a); }

View File

@@ -26,7 +26,7 @@
.order-timeline__dot {
width: 10px;
height: 10px;
border-radius: 999px;
border-radius: var(--radius-full, 999px);
background: var(--brand-primary, #1e8a6e);
margin-top: 4px;
flex-shrink: 0;

View File

@@ -46,7 +46,7 @@ select, textarea { width: 100%; padding: 8px 10px; border: 1px solid var(--borde
.status-stepper__dot {
width: 14px;
height: 14px;
border-radius: 999px;
border-radius: var(--radius-full, 999px);
background: var(--surface-muted, #eef2f0);
border: 2px solid var(--border-subtle, #e7ece9);
flex-shrink: 0;

View File

@@ -109,7 +109,7 @@ input[type='checkbox'] { width: auto; }
.badge-manager__current, .badge-manager__known { display: flex; flex-wrap: wrap; gap: 6px; }
.badge-chip {
display: inline-flex; align-items: center; gap: 4px;
min-height: 24px; padding: 3px 10px; border-radius: 999px;
min-height: 24px; padding: 3px 10px; border-radius: var(--radius-full, 999px);
color: #fff; font-size: var(--font-size-xs, 0.75rem); font-weight: 700; text-transform: uppercase;
border: none;
}

View File

@@ -6,7 +6,7 @@
.product-health__bar {
height: 6px;
border-radius: 999px;
border-radius: var(--radius-full, 999px);
background: var(--surface-muted, #eef2f0);
overflow: hidden;
}

View File

@@ -17,7 +17,7 @@
.attribute-card__tag {
font-size: var(--font-size-xs, 0.75rem); text-transform: uppercase; letter-spacing: 0.4px;
color: var(--text-secondary, #6b7280); border: 1px solid var(--border-color, #d3dad9);
border-radius: 999px; padding: 1px 8px;
border-radius: var(--radius-full, 999px); padding: 1px 8px;
}
.attribute-card__remove {
margin-left: auto; border: none; background: transparent; cursor: pointer;
@@ -31,7 +31,7 @@
.value-chip {
display: inline-flex; align-items: center; gap: 6px;
padding: 3px 8px; border-radius: 999px;
padding: 3px 8px; border-radius: var(--radius-full, 999px);
border: 1px solid var(--border-color, #d3dad9);
font-size: var(--font-size-sm, 0.8125rem);