.themed-button-outline:where(a) { display: inline-block } (line 2147)
was beating .social-link-card-item { display: flex } (line 1796) —
same layer, same specificity, later wins. Used the parent selector
.social-link-card-list .social-link-card-item to give display: flex
higher specificity (2 classes vs 1) so it wins.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Follows the same fix as inputs — the --t-text-small override was making
inline form buttons smaller than other buttons on the page.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
card-inline-form was overriding input font-size to --t-text-small, making
inline inputs noticeably smaller than contact form inputs. Removed the
override so all inputs inherit the same base size from the themed container.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
themed-input was inheriting font size from its container rather than
being set explicitly, so contact form inputs appeared larger than
the compact inline inputs in cards like "Track your order".
Added font-size: var(--t-text-base) to the contact form context rule
so both inputs are intentionally sized rather than relying on inheritance.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
themed-input had no padding in the base style, so inputs were rendering
with browser-default 1px/2px padding. Added 0.5rem 0.75rem as the base.
Also fixed the contact form CSS which was targeting .shop-input (a class
that doesn't exist on rendered elements) instead of .themed-input.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Capitalise lead sentence regardless of shop_name value
- Add stripe.com/privacy URL when mentioning Stripe in payment section
- Remove mention of logout from session cookie description
- Make third-party sharing text provider-agnostic (no longer names Printify etc.)
- Add :updated_at block to privacy, delivery, and terms pages showing when
content last changed — auto-tracked via content hash, so the date advances
automatically whenever relevant settings change
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Magic link flow on contact page: customer enters email, gets a
time-limited signed link, clicks through to /orders showing all their
paid orders and full detail pages with thumbnails and product links.
- OrderLookupController generates/verifies Phoenix.Token signed links
- Contact LiveView handles lookup_orders + reset_tracking events
- Orders and OrderDetail LiveViews gated by session email
- Order detail shows thumbnails, links to products still available
- .themed-button gets base padding/font-weight so all usages are consistent
- order-summary-card sticky scoped to .cart-grid (was leaking to orders list)
- 27 new tests (1095 total)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
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>
Phase 1: Replace hex_to_hsl with hex_to_oklch in CSSGenerator, output
--t-accent-l/c/h instead of --t-accent-h/s/l. All 46 HSL accent
references across theme-semantic.css, theme-layer2-attributes.css, and
shop/components.css replaced with oklch/color-mix equivalents. Dead
style*= attribute selectors for button variants replaced with proper
class-based selectors. Added color-scheme: light/dark to mood output.
Phase 2: Add LoadTheme plug to admin pipeline, extend AdminLayoutHook
with theme_settings and generated_css assigns, add font preloads and
generated CSS injection to admin_root.html.heex. No visual changes to
admin yet — .themed wrapper added in next phase.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Coming soon page was unstyled after Tailwind removal — replaced
utility classes with proper component CSS. Also removed dead h-full
classes from shop_root layout, adding height: 100% to the shop reset.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Replace all Tailwind utilities in content.ex and collection.ex with
semantic CSS classes (content body, contact form, cards, reviews, etc.)
- Delete app-shop.css (Tailwind shop entry point)
- Remove shop Tailwind config from config.exs, dev.exs, mix.exs
- Remove shop Tailwind stylesheet link from shop_root.html.heex
- Add collection filter bar, empty state, and select dropdown styles
- Fix filter pill sizing (use theme font vars instead of hardcoded rem)
- Fix active pill contrast (tinted accent background + dark accent text)
- Fix --t-text-on-accent fallback for pill legibility
- Add padding/font-size to .themed-select
Shop pages now use zero Tailwind. Admin Tailwind remains for Phase 6.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Remove ~140 Tailwind utility classes from product.ex and cart.ex, replacing
with semantic CSS classes in components.css. Delete helper functions that
generated Tailwind class strings (card_classes, image_container_classes,
content_padding_class, title_classes, hero_cta_classes, grid_classes).
Use data-* attributes for variant styling, grid columns, and sticky
positioning. Update theme-layer2 selectors for renamed classes.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Absorb ~100 Tailwind utility classes from layout.ex and all page
templates into semantic CSS rules in components.css. Uses theme font-size
vars (--t-text-small, --t-text-caption) instead of rem to respect the
theme's em-based scaling system.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Move ~104 inline style= attributes from layout.ex (55) and cart.ex (49)
into named CSS classes in components.css. Remove conflicting unlayered
nav link rule from theme-semantic.css that was previously masked by
inline styles. Only dynamic values (background-image URLs, logo height)
remain as inline styles.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Move ~80 inline style= attributes from product.ex into ~40 CSS classes
in @layer components. Only genuinely dynamic values (hex colours,
background-image URLs) remain as inline styles. Pre-declare CSS layer
order in shop_root.html.heex so reset < components in the cascade.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
