← back to Wallco Ai
revert: theme1/theme2 toggle on /designs admin (was super-zooming cards)
8c1ed72e6341af3b1c2483d1129409cc17b72b6e · 2026-05-29 13:17:48 -0700 · Steve Abrams
Steve 2026-05-29 'i ages should not be superzooom on load.. revert
https://wallco.ai/designs'. Removes the admin-only theme toggle added
in 49dcd87a.
Root cause: the theme2 CSS overrides used `background:var(--card-bg)`
SHORTHAND on the catch-all [class*="card"] selector. With higher
specificity than .card-img, this reset background-size from 'cover'
back to 'auto' — so every card-img rendered its 1024px source PNG at
natural size inside a 256px box. Result: each card showed ~1/16 of the
original tile = super-zoom. Per-card looked like one giant motif filling
the card instead of the seamless-repeat preview.
git revert would not auto-merge cleanly (later commits in same area).
Manual surgical removal of the conditional admin block. /design/:id
keeps its own theme toggle separately (c26ba53e fix). Grid is now
back to the default cream/warm theme for everyone.
verified: prod /designs returns 200, grep 'data-page-theme' = 0.
Files touched
Diff
commit 8c1ed72e6341af3b1c2483d1129409cc17b72b6e
Author: Steve Abrams <steve@designerwallcoverings.com>
Date: Fri May 29 13:17:48 2026 -0700
revert: theme1/theme2 toggle on /designs admin (was super-zooming cards)
Steve 2026-05-29 'i ages should not be superzooom on load.. revert
https://wallco.ai/designs'. Removes the admin-only theme toggle added
in 49dcd87a.
Root cause: the theme2 CSS overrides used `background:var(--card-bg)`
SHORTHAND on the catch-all [class*="card"] selector. With higher
specificity than .card-img, this reset background-size from 'cover'
back to 'auto' — so every card-img rendered its 1024px source PNG at
natural size inside a 256px box. Result: each card showed ~1/16 of the
original tile = super-zoom. Per-card looked like one giant motif filling
the card instead of the seamless-repeat preview.
git revert would not auto-merge cleanly (later commits in same area).
Manual surgical removal of the conditional admin block. /design/:id
keeps its own theme toggle separately (c26ba53e fix). Grid is now
back to the default cream/warm theme for everyone.
verified: prod /designs returns 200, grep 'data-page-theme' = 0.
---
server.js | 75 +++++++++------------------------------------------------------
1 file changed, 10 insertions(+), 65 deletions(-)
diff --git a/server.js b/server.js
index 64ddfdb..69243a7 100644
--- a/server.js
+++ b/server.js
@@ -6378,71 +6378,16 @@ app.get('/designs', (req, res) => {
})}
<body>
${htmlHeader('/designs')}
-<main id="grid-main"${_role === 'admin' ? ' data-page-theme="theme2"' : ''}>
-${_role === 'admin' ? `
-<!-- Theme toggle (theme1 / theme2) — ADMIN-ONLY preview surface
- (Steve 2026-05-29). Shares localStorage key 'wallco-page-theme' with
- /design/:id so an admin's choice flows across grid + PDP. -->
-<style id="page-theme-css-grid">
- #grid-main[data-page-theme="theme2"]{
- --bg: #ffffff; --ink: #0a0a0a;
- --ink-soft: #4a4a4a; --ink-faint: #8a8a8a;
- --line: #e5e5e5; --card-bg: #fafafa;
- --accent: #c14a2e; --accent-soft:#7a2a18;
- background: var(--bg); color: var(--ink);
- }
- #grid-main[data-page-theme="theme2"] h1,
- #grid-main[data-page-theme="theme2"] h2,
- #grid-main[data-page-theme="theme2"] h3{ letter-spacing:-0.01em; font-weight:500; }
- #grid-main[data-page-theme="theme2"] .card,
- #grid-main[data-page-theme="theme2"] [class*="card"]{
- background:var(--card-bg); border:1px solid var(--line); box-shadow:none;
- }
- #page-theme-toggle{
- position:fixed; top:60px; right:14px; z-index:90;
- display:inline-flex; gap:0; align-items:center;
- background:rgba(255,255,255,.92); border:1px solid #d8d2c5;
- border-radius:999px; padding:3px; backdrop-filter:blur(6px);
- box-shadow:0 2px 10px rgba(0,0,0,.08);
- font:600 11px ui-sans-serif,system-ui; letter-spacing:.06em; text-transform:uppercase;
- }
- #page-theme-toggle button{
- border:0; background:transparent; color:#5a5048; cursor:pointer;
- padding:6px 14px; border-radius:999px; font:inherit; transition:all .15s;
- }
- #page-theme-toggle button[aria-pressed="true"]{ background:#1a1714; color:#faf7f2; }
- #page-theme-toggle button:hover:not([aria-pressed="true"]){ color:#1a1714; }
- @media (prefers-color-scheme: dark){
- #page-theme-toggle{ background:rgba(20,18,16,.92); border-color:#3a3633; }
- #page-theme-toggle button{ color:#c8beb2; }
- #page-theme-toggle button:hover:not([aria-pressed="true"]){ color:#f0ebe3; }
- }
-</style>
-<div id="page-theme-toggle" role="group" aria-label="Page theme">
- <button type="button" data-theme="theme1" aria-pressed="false">Theme 1</button>
- <button type="button" data-theme="theme2" aria-pressed="true">Theme 2</button>
-</div>
-<script>
-(function(){
- var main = document.getElementById('grid-main');
- var saved = null;
- try { saved = localStorage.getItem('wallco-page-theme'); } catch(e){}
- var theme = saved === 'theme1' ? 'theme1' : 'theme2';
- main.setAttribute('data-page-theme', theme);
- var btns = document.querySelectorAll('#page-theme-toggle button');
- function sync(t){ btns.forEach(function(b){ b.setAttribute('aria-pressed', b.dataset.theme === t ? 'true' : 'false'); }); }
- sync(theme);
- btns.forEach(function(b){
- b.addEventListener('click', function(){
- var t = b.dataset.theme;
- main.setAttribute('data-page-theme', t);
- try { localStorage.setItem('wallco-page-theme', t); } catch(e){}
- sync(t);
- });
- });
-})();
-</script>
-` : ''}
+<main id="grid-main">
+<!-- Theme toggle removed 2026-05-29 (Steve directive: 'i ages should not be
+ superzooom on load.. revert https://wallco.ai/designs'). The theme2 CSS
+ used `background:var(--card-bg)` shorthand on [class*="card"], which has
+ higher specificity than the .card-img stylesheet rule and reset
+ background-size from 'cover' back to 'auto' — leaving every card-img
+ rendering its 1024px source at natural size inside a 256px box (=
+ super-zoom). PDP /design/:id keeps its own theme toggle; this revert
+ is grid-only. -->
+${''}
${cat === 'drunk-animals' ? `
<section style="padding:48px 24px 24px;text-align:center;background:linear-gradient(180deg,#1a0f1a 0%,#2a1530 100%);color:#fff;margin-bottom:0">
<div style="max-width:760px;margin:0 auto">
← 300315d C-bridge (DTD interim): patchDesignsSnapshot() persists cura
·
back to Wallco Ai
·
Add color-dots.js: vertical strip of the pattern's screen-pr 8e67419 →