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

@@ -35,7 +35,7 @@
background: transparent;
color: #697777;
border: 1px solid #d3dad9;
border-radius: 13px;
border-radius: var(--radius-lg, 13px);
font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
font-size: var(--font-size-base, 0.875rem);
font-weight: 600;
@@ -86,7 +86,7 @@
background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
color: white;
border: none;
border-radius: 12px;
border-radius: var(--radius-md, 12px);
font-size: var(--font-size-base, 0.875rem);
font-weight: 600;
cursor: pointer;
@@ -122,7 +122,7 @@
padding: 80px 20px;
text-align: center;
background: #f5f3f9;
border-radius: 13px;
border-radius: var(--radius-lg, 13px);
border: 1px solid #d3dad9;
.empty-icon {
@@ -155,7 +155,7 @@
background: #497671;
color: white;
text-decoration: none;
border-radius: 13px;
border-radius: var(--radius-lg, 13px);
font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
font-weight: 600;
font-size: var(--font-size-lg, 1rem);
@@ -210,7 +210,7 @@
background: linear-gradient(135deg, #10b981 0%, #059669 100%);
color: white;
text-decoration: none;
border-radius: 12px;
border-radius: var(--radius-md, 12px);
font-weight: 600;
font-size: var(--font-size-lg, 1rem);
transition: all 0.3s;
@@ -251,7 +251,7 @@
.cart-item-wrapper {
position: relative;
overflow: hidden;
border-radius: 12px;
border-radius: var(--radius-md, 12px);
transition: transform 0.3s ease;
&.swiped {
@@ -277,7 +277,7 @@
gap: 20px;
background: white;
border: 1px solid #d3dad9;
border-radius: 13px;
border-radius: var(--radius-lg, 13px);
padding: 20px;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
position: relative;
@@ -294,7 +294,7 @@
flex-shrink: 0;
width: 100px;
height: 100px;
border-radius: 13px;
border-radius: var(--radius-lg, 13px);
overflow: hidden;
background: #f5f3f9;
border: 1px solid #d3dad9;
@@ -349,7 +349,7 @@
border: none;
color: #a1b4b5;
cursor: pointer;
border-radius: 8px;
border-radius: var(--radius-sm, 8px);
transition: all 0.2s;
&:hover {
@@ -425,7 +425,7 @@
flex-shrink: 0;
width: 100px;
height: 100px;
border-radius: 12px;
border-radius: var(--radius-md, 12px);
overflow: hidden;
background: linear-gradient(135deg, #f0fdf4 0%, #d1fae5 100%);
border: 2px solid #d1fae5;
@@ -478,7 +478,7 @@
border: none;
color: #9ca3af;
cursor: pointer;
border-radius: 8px;
border-radius: var(--radius-sm, 8px);
transition: all 0.2s;
&:hover {
@@ -569,7 +569,7 @@
align-items: center;
gap: 12px;
background: #f5f3f9;
border-radius: 13px;
border-radius: var(--radius-lg, 13px);
padding: 4px 10px;
border: 1px solid #d3dad9;
@@ -682,7 +682,7 @@
top: 90px;
background: #f5f3f9;
border: 1px solid #d3dad9;
border-radius: 13px;
border-radius: var(--radius-lg, 13px);
padding: 28px;
display: flex;
flex-direction: column;
@@ -737,7 +737,7 @@
background: #497671;
color: white;
border: none;
border-radius: 13px;
border-radius: var(--radius-lg, 13px);
font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
font-size: var(--font-size-lg, 1rem);
font-weight: 700;
@@ -967,7 +967,7 @@
gap: 8px;
padding: 12px 24px;
border: none;
border-radius: 12px;
border-radius: var(--radius-md, 12px);
background: #2AABEE;
color: #fff;
font-size: var(--font-size-md, 0.9375rem);
@@ -1012,7 +1012,7 @@
width: 18px;
background: white;
border: 2px solid #d1d5db;
border-radius: 4px;
border-radius: var(--radius-xs, 4px);
transition: all 0.2s;
&::after {
@@ -1080,7 +1080,7 @@
.checkmark {
border: 2px solid #d3dad9;
border-radius: 4px;
border-radius: var(--radius-xs, 4px);
}
.terms-text {
@@ -1150,7 +1150,7 @@
.payment-modal {
background: white;
border-radius: 13px;
border-radius: var(--radius-lg, 13px);
max-width: 500px;
width: 100%;
padding: 40px;
@@ -1278,7 +1278,7 @@
background: #497671;
color: white;
border: none;
border-radius: 13px;
border-radius: var(--radius-lg, 13px);
font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
font-size: var(--font-size-lg, 1rem);
font-weight: 700;
@@ -1344,7 +1344,7 @@
.qr-wrapper {
padding: 16px;
background: white;
border-radius: 12px;
border-radius: var(--radius-md, 12px);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
position: relative;
overflow: hidden;
@@ -1389,7 +1389,7 @@
align-items: center;
padding: 16px;
background: #f9fafb;
border-radius: 8px;
border-radius: var(--radius-sm, 8px);
margin-bottom: 16px;
.label {
@@ -1429,7 +1429,7 @@
.open-btn {
flex: 1;
padding: 12px 16px;
border-radius: 8px;
border-radius: var(--radius-sm, 8px);
font-weight: 600;
font-size: var(--font-size-md, 0.9375rem);
cursor: pointer;
@@ -1495,7 +1495,7 @@
height: min(760px, 86vh);
padding: 56px 16px 16px;
background: white;
border-radius: 13px;
border-radius: var(--radius-lg, 13px);
box-shadow: 0 18px 60px rgba(0, 0, 0, 0.28);
}
@@ -1503,7 +1503,7 @@
width: 100%;
height: 100%;
border: 0;
border-radius: 8px;
border-radius: var(--radius-sm, 8px);
background: white;
}
@@ -1552,7 +1552,7 @@
width: 100%;
padding: 14px;
border: 1px solid #e5e7eb;
border-radius: 8px;
border-radius: var(--radius-sm, 8px);
font-size: var(--font-size-lg, 1rem);
outline: none;
transition: all 0.2s;
@@ -1588,7 +1588,7 @@
background: #497671;
color: white;
border: none;
border-radius: 13px;
border-radius: var(--radius-lg, 13px);
font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
font-size: var(--font-size-lg, 1rem);
font-weight: 700;
@@ -2144,7 +2144,7 @@
width: 20px;
background-color: transparent;
border: 2px solid var(--border-color);
border-radius: 4px;
border-radius: var(--radius-xs, 4px);
transition: all 0.2s ease;
margin-top: 2px;