jamey/berrypod
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases Wiki Activity

replace --color-* with --t-* tokens, delete bridge and .preview-frame

Browse Source 
Phase 4: admin components and utilities now reference --t-* theme
tokens directly. Status colour tokens added to theme-semantic.css.
Bridge file (admin/themes.css) deleted.

Phase 5: removed duplicated .preview-frame CSS block (~160 lines).
Admin components and icons wrapped in @layer admin. Layer order
updated in admin_root to include admin layer.

Phase 6: added prefers-reduced-motion support (zeroes all durations
and disables animations). Migrated physical properties to logical
equivalents (text-align start/end, margin-inline, padding-inline,
inset-inline-end) across shop and admin CSS.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
jamey
2026-02-21 00:13:33 +00:00
parent d68768ad84
commit 65ea11c3a2
10 changed files with 225 additions and 394 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
assets/css/shop/components.css
View File

@@ -156,7 +156,7 @@
.product-card[data-variant="default"] .product-price--compare {
font-size: var(--t-text-small);
margin-left: 0.5rem;
margin-inline-start: 0.5rem;
}
.product-card[data-variant="featured"] .product-price--secondary {
@@ -164,7 +164,7 @@
}
.product-card[data-variant="featured"] .product-price--compare {
margin-right: 0.25rem;
margin-inline-end: 0.25rem;
}
.product-card[data-variant="compact"] .product-price--regular {
@@ -734,7 +734,7 @@
.details-th {
color: var(--t-text-primary);
text-align: left;
text-align: start;
padding-block: 0.5rem;
font-weight: 600;
}
@@ -866,7 +866,7 @@
.cart-badge {
position: absolute;
top: -4px;
right: -4px;
inset-inline-end: -4px;
background: var(--t-accent);
color: var(--t-text-inverse);
font-size: var(--t-text-caption);
@@ -898,8 +898,7 @@
.mobile-bottom-nav {
position: fixed;
bottom: 0;
left: 0;
right: 0;
inset-inline: 0;
z-index: 100;
background-color: var(--t-surface-raised);
border-top: 1px solid var(--t-border-default);
@@ -1090,7 +1089,7 @@
color: var(--t-text-tertiary);
& span {
margin-left: 0.5rem;
margin-inline-start: 0.5rem;
}
}
@@ -1190,7 +1189,7 @@
.cart-drawer {
position: fixed;
top: 0;
right: -400px;
inset-inline-end: -400px;
width: 400px;
max-width: 90vw;
height: 100vh;
@@ -1199,11 +1198,11 @@
z-index: 1001;
display: flex;
flex-direction: column;
transition: right 0.3s ease;
transition: inset-inline-end 0.3s ease;
box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
&.open {
right: 0;
inset-inline-end: 0;
}
}
@@ -1389,7 +1388,7 @@
.cart-item-price-col {
flex-shrink: 0;
text-align: right;
text-align: end;
}
.cart-item-price {
@@ -1500,7 +1499,7 @@
}
.cart-page-item-price-col {
text-align: right;
text-align: end;
}
.cart-page-item-price {
@@ -2066,7 +2065,7 @@
.rich-text-list {
margin-bottom: 1rem;
margin-left: 1.5rem;
margin-inline-start: 1.5rem;
list-style: disc;
color: var(--t-text-secondary);
@@ -2080,7 +2079,7 @@
.shop-flash-group {
position: fixed;
top: 1rem;
right: 1rem;
inset-inline-end: 1rem;
z-index: 200;
display: flex;
flex-direction: column;