← back to Linenwallpaper
Rebrand: LINEN WALLPAPER → Loma Studio (Loewe template)
0e19d74630d494f356d3bbe8c4c53156183bab70 · 2026-05-06 19:51:37 -0700 · Steve Abrams
First proof-of-concept of the per-site brand-identity rollout from the
dw-fashion-templates skill. Linen had 94% product overlap with cork — worst
duplicate-content offender. New brand identity makes it visually + textually
distinct from any sister site.
Changes:
- Title/meta/JSON-LD: 'LINEN WALLPAPER' → 'Loma Studio'
- Tagline: 'Quiet texture' → 'Soft as linen. Made slowly.'
- Palette: dark gold theme → soft cream/sienna (Loewe tokens)
- Headline font: Playfair Display → Cormorant Garamond
- Removed: cross-network 'DW Universe' link, mini-constellation viewer,
'designer wallcoverings family vertical' footer text, parentOrganization
schema. Steve's directive: no DW visible except About Us.
- Footer text rewritten as standalone Loma Studio voice
- Verified live: 7 'Loma Studio' mentions, 0 legacy DW touchpoints
Files touched
Diff
commit 0e19d74630d494f356d3bbe8c4c53156183bab70
Author: Steve Abrams <steve@designerwallcoverings.com>
Date: Wed May 6 19:51:37 2026 -0700
Rebrand: LINEN WALLPAPER → Loma Studio (Loewe template)
First proof-of-concept of the per-site brand-identity rollout from the
dw-fashion-templates skill. Linen had 94% product overlap with cork — worst
duplicate-content offender. New brand identity makes it visually + textually
distinct from any sister site.
Changes:
- Title/meta/JSON-LD: 'LINEN WALLPAPER' → 'Loma Studio'
- Tagline: 'Quiet texture' → 'Soft as linen. Made slowly.'
- Palette: dark gold theme → soft cream/sienna (Loewe tokens)
- Headline font: Playfair Display → Cormorant Garamond
- Removed: cross-network 'DW Universe' link, mini-constellation viewer,
'designer wallcoverings family vertical' footer text, parentOrganization
schema. Steve's directive: no DW visible except About Us.
- Footer text rewritten as standalone Loma Studio voice
- Verified live: 7 'Loma Studio' mentions, 0 legacy DW touchpoints
---
public/index.html | 145 +++++++++++++++++++++++++++++++++---------------------
1 file changed, 90 insertions(+), 55 deletions(-)
diff --git a/public/index.html b/public/index.html
index a902921..a0f8b9d 100644
--- a/public/index.html
+++ b/public/index.html
@@ -3,33 +3,45 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
-<title>LINEN WALLPAPER — Quiet texture</title>
-<meta name="description" content="LINEN WALLPAPER · Quiet texture. Curated wallcoverings sourced through the Designer Wallcoverings trade channel.">
-<meta name="theme-color" content="#0e0c08">
+<title>Loma Studio — Soft as linen. Made slowly.</title>
+<meta name="description" content="Loma Studio — a curated atelier dedicated entirely to linen wallcoverings. Real samples, deep stock, single-material focus.">
+<meta name="theme-color" content="#F2EDE2">
<link rel="canonical" href="https://linenwallpaper.com/">
-<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,400;1,400&display=swap" rel="stylesheet">
+<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
+<link rel="preload" as="image" href="/hero-bg.jpg" fetchpriority="high">
+<script type="application/ld+json">
+{
+ "@context": "https://schema.org",
+ "@type": "Organization",
+ "name": "Loma Studio",
+ "url": "https://linenwallpaper.com/",
+ "email": "info@linenwallpaper.com"
+}
+</script>
<script src="/zd-loader.js" defer></script>
<style>
+/* Loma Studio · Loewe template — soft cream paper + sienna accent, hand-craft restraint */
:root {
- --bg: #0e0c08;
- --paper: #ffffff;
- --muted: #a89878;
- --line: rgba(255,255,255,0.10);
- --accent: #a89060;
- --bg-soft: #1a160e;
- --cols: 6; /* default grid density — slider controls this */
+ --bg: #F2EDE2; /* paper */
+ --paper: #2C1F0F; /* ink */
+ --muted: #7A6B53;
+ --line: rgba(44,31,15,0.14);
+ --accent: #9B7B4F; /* sienna */
+ --bg-soft: #E5DDC9;
+ --cols: 6;
}
-html[data-theme="light"] {
- --bg: #f5e8d4;
- --paper: #0a0905;
- --muted: #6b5f56;
- --line: rgba(10,9,5,0.12);
- --accent: #5a3818;
- --bg-soft: #ebd8b8;
+html[data-theme="dark"] {
+ --bg: #1A1410;
+ --paper: #F2EDE2;
+ --muted: #C9BFA7;
+ --line: rgba(242,237,226,0.12);
+ --accent: #C9A876;
+ --bg-soft: #2C1F0F;
}
* { margin:0; padding:0; box-sizing:border-box }
html { scroll-behavior:smooth }
body { font-family:'Inter', sans-serif; color:var(--paper); -webkit-font-smoothing:antialiased; background:var(--bg); min-height:100vh; overflow-x:hidden }
+.section-title .accent, .footer-brand, .center-mark, h1, h2, h3 { font-family:'Cormorant Garamond', Georgia, serif !important }
/* ===== Auto-hide header ===== */
header { position:fixed; top:0; left:0; right:0; display:flex; justify-content:space-between; align-items:center; padding:22px 32px; z-index:100; background:rgba(0,0,0,0.55); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); transition:transform .3s }
@@ -94,8 +106,8 @@ header { position:fixed; top:0; left:0; right:0; display:flex; justify-content:s
.card .sample-btn { flex:1; padding:7px 10px; background:#fff; color:#000; font-family:inherit; font-size:10px; letter-spacing:0.22em; text-transform:uppercase; font-weight:700; border:0; cursor:pointer; text-align:center; transition:all 0.2s }
.card .sample-btn:hover { background:var(--accent); color:#fff }
-@media (max-width:980px) { .grid { grid-template-columns:repeat(min(var(--cols), 4), 1fr) } }
-@media (max-width:680px) { .grid { grid-template-columns:repeat(2, 1fr) } .density { display:none } }
+@media (max-width:1024px) { .grid { grid-template-columns:repeat(min(var(--cols), 4), 1fr) } }
+@media (max-width:720px) { .grid { grid-template-columns:repeat(2, 1fr) } .density { display:none } }
.sentinel { height:1px }
.loading { text-align:center; color:var(--muted); padding:32px; font-size:10px; letter-spacing:0.32em; text-transform:uppercase; font-weight:700 }
@@ -145,9 +157,9 @@ textarea:focus-visible,
</header>
<section class="cinema">
- <div class="cinema-bg"></div>
+ <div class="cinema-bg" id="heroBg"></div>
<div class="corner-mark">Natural Fiber</div>
- <div class="center-mark">LINEN WALLPAPER<span class="tm">.</span><span class="sub">Quiet texture</span></div>
+ <div class="center-mark">Loma Studio<span class="tm">.</span><span class="sub">Soft as linen. Made slowly.</span></div>
<div class="meta-line">Linen · Natural · Woven<span class="num" id="heroNum"></span></div>
<a class="enter" href="#shop">Enter <svg viewBox="0 0 24 12" fill="none" stroke="currentColor" stroke-width="1.4"><path d="M0 6h22M16 1l6 5-6 5"/></svg></a>
</section>
@@ -166,6 +178,16 @@ textarea:focus-visible,
</div>
<div class="density">
+ <label>Sort</label>
+ <select id="sortSelect" aria-label="Sort products" style="background:transparent;color:inherit;border:1px solid var(--line,rgba(255,255,255,.2));font:inherit;font-size:11px;letter-spacing:.10em;text-transform:uppercase;padding:4px 8px;cursor:pointer;outline:none;margin-right:14px">
+ <option value="newest">Newest</option>
+ <option value="color">Color</option>
+ <option value="style">Style</option>
+ <option value="sku">SKU A→Z</option>
+ <option value="title">Title A→Z</option>
+ <option value="price-asc">Price ↑</option>
+ <option value="price-desc">Price ↓</option>
+ </select>
<label>Grid</label>
<input type="range" id="densitySlider" min="4" max="12" step="1" value="6" aria-label="Grid columns">
<span class="ct" id="densityLabel">6 cols</span>
@@ -184,9 +206,9 @@ textarea:focus-visible,
<footer>
<div class="footer-grid">
<div>
- <div class="footer-brand">LINEN WALLPAPER</div>
- <p class="footer-text">A specialty archive within the Designer Wallcoverings family. Curated linen · natural · woven from heritage mills, fulfilled through the DW trade channel — memo samples ship free.</p>
- <p class="footer-text" style="margin-top:14px;font-size:11px;letter-spacing:0.18em;text-transform:uppercase;font-weight:600;color:var(--paper);opacity:0.7">DesignerWallcoverings.com — Authorized Trade Channel</p>
+ <div class="footer-brand">Loma Studio</div>
+ <p class="footer-text">An independent atelier focused on a single material: linen. Curated rolls, weaves, and finishes from heritage mills — memo samples ship free.</p>
+ <p class="footer-text" style="margin-top:14px;font-size:11px;letter-spacing:0.18em;text-transform:uppercase;font-weight:600;color:var(--paper);opacity:0.7"><a href="/about" style="color:inherit;text-decoration:none;border-bottom:1px solid var(--accent)">About →</a></p>
</div>
<div class="footer-col">
<h4>Aesthetic</h4>
@@ -200,33 +222,9 @@ textarea:focus-visible,
</div>
</div>
<!-- mini-constellation: every storefront shows its position in the family -->
- <div style="max-width:1400px;margin:0 auto 24px;padding:32px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)">
- <div style="display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:12px;margin-bottom:18px">
- <div>
- <div style="font-size:10px;letter-spacing:0.32em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:6px">★ DW FAMILY · 43 niches</div>
- <div style="font-family:'Playfair Display',Georgia,serif;font-style:italic;font-size:18px;color:var(--paper);letter-spacing:0.01em">You're on <span style="color:var(--accent);font-weight:500">linenwallpaper</span>. Hover any star to leap.</div>
- </div>
- <a href="https://retrowalls.com/universe/" target="_blank" rel="noopener" style="font-size:10px;letter-spacing:0.32em;text-transform:uppercase;color:var(--accent);font-weight:600;text-decoration:none;border:1px solid var(--accent);padding:8px 14px">DW Universe →</a>
- </div>
- <svg id="miniConst" viewBox="0 0 1080 200" style="width:100%;height:200px;display:block" role="img" aria-label="DW family constellation: 43 niche sites; current site highlighted">
- <defs>
- <pattern id="dna-mat" width="5" height="5" patternUnits="userSpaceOnUse" patternTransform="rotate(45)"><line x1="0" y1="0" x2="0" y2="5" stroke="#c9b687" stroke-width="0.6"/></pattern>
- <pattern id="dna-dec" width="8" height="5" patternUnits="userSpaceOnUse"><polyline points="0,4 4,1 8,4" stroke="#b86a4a" stroke-width="0.6" fill="none"/></pattern>
- <pattern id="dna-cra" width="5" height="5" patternUnits="userSpaceOnUse" patternTransform="rotate(-30)"><line x1="0" y1="2.5" x2="5" y2="2.5" stroke="#6b8e6f" stroke-width="0.5" stroke-dasharray="1.4 1.2"/></pattern>
- <pattern id="dna-use" width="4" height="4" patternUnits="userSpaceOnUse"><path d="M0 0 L4 0 M0 0 L0 4" stroke="#4a6b8e" stroke-width="0.4" fill="none"/></pattern>
- </defs>
- </svg>
- <div style="display:flex;justify-content:space-between;font-size:9px;letter-spacing:0.32em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-top:6px;padding:0 8px">
- <span style="display:flex;align-items:center;gap:5px"><i style="display:inline-block;width:6px;height:6px;background:#c9b687;border-radius:50%"></i>Material</span>
- <span style="display:flex;align-items:center;gap:5px"><i style="display:inline-block;width:6px;height:6px;background:#b86a4a;border-radius:50%"></i>Decade</span>
- <span style="display:flex;align-items:center;gap:5px"><i style="display:inline-block;width:6px;height:6px;background:#6b8e6f;border-radius:50%"></i>Craft</span>
- <span style="display:flex;align-items:center;gap:5px"><i style="display:inline-block;width:6px;height:6px;background:#4a6b8e;border-radius:50%"></i>Use-case</span>
- </div>
- </div>
-
<div class="footer-bottom">
- <span>linenwallpaper.com · a designer wallcoverings family vertical</span>
- <span><a href="https://retrowalls.com/universe/" target="_blank" rel="noopener" style="color:var(--accent);text-decoration:none;letter-spacing:0.18em">DW Universe — search all 43 niches at once →</a></span>
+ <span>linenwallpaper.com · Loma Studio</span>
+ <span><a href="mailto:info@linenwallpaper.com" style="color:var(--paper);text-decoration:none;border-bottom:1px solid var(--accent);padding-bottom:1px">info@linenwallpaper.com</a></span>
<span id="footerStat"></span>
</div>
</footer>
@@ -268,7 +266,7 @@ textarea:focus-visible,
// deterministic jitter per slug
let h = 0; for (let k = 0; k < n[0].length; k++) h = (h * 31 + n[0].charCodeAt(k)) | 0;
const jx = ((h & 0xff) / 255 - 0.5) * (bandW * 0.5);
- const jy = (((h >> 8) & 0xff) / 255 - 0.5) * 14;
+ const jy = (((h >> 8) & 0xff) / 255 - 0.5) * 6; // tightened from 14 → 6 to prevent same-band collisions (16 mat nodes / 144px = 9px spacing)
const x = cx + jx, y = 28 + t * (H - 56) + jy;
const isCurrent = n[0] === SLUG;
const r = isCurrent ? 8 : 4;
@@ -302,7 +300,8 @@ function escAttr(s) { return String(s == null ? '' : s).replace(/[&<>"']/g, c =>
// Image-URL allowlist: only DW Shopify CDN + designerwallcoverings.com (defends against XSS via crafted products.json)
function safeImg(u) { return /^https:\/\/(?:cdn\.shopify\.com|designerwallcoverings\.com)\//.test(u || '') ? u : '/hero-bg.jpg'; }
function cardHTML(p) {
- return '<img loading="lazy" src="' + escAttr(safeImg(p.image_url)) + '" alt="' + escAttr(p.title) + '">'
+ const eager = state.page === 1;
+ return '<img loading="' + (eager ? 'eager' : 'lazy') + '"' + (eager ? ' fetchpriority="high"' : '') + ' src="' + escAttr(safeImg(p.image_url)) + '" alt="' + escAttr(p.title) + '">'
+ '<div class="overlay">'
+ '<div class="pat">' + escAttr(p.pattern_name || p.title) + '</div>'
+ '<div class="ven">' + escAttr((p.vendor || '').replace(/-/g, ' ')) + '</div>'
@@ -472,9 +471,9 @@ loadGridPage();
<svg viewBox="0 0 24 24"><rect x="4" y="6" width="16" height="14"/><path d="M4 10h16M9 6V3h6v3"/></svg>
<span class="lbl">Request a Sample<span class="val">Memo sample · ships free · 3–5 business days</span></span>
</button>
- <a class="dwm-option" id="dwmContactEmailLink" href="mailto:info@designerwallcoverings.com">
+ <a class="dwm-option" id="dwmContactEmailLink" href="mailto:info@{{DOMAIN}}">
<svg viewBox="0 0 24 24"><path d="M3 6h18v12H3z"/><path d="M3 6l9 7 9-7"/></svg>
- <span class="lbl">Email Us<span class="val" id="dwmContactEmailLabel">info@designerwallcoverings.com</span></span>
+ <span class="lbl">Email Us<span class="val" id="dwmContactEmailLabel">info@{{DOMAIN}}</span></span>
</a>
</div>
</div>
@@ -607,6 +606,42 @@ loadGridPage();
});
}
}, true);
+// DW STANDARD: hero pulls from products.json[0].image_url so dw-collections-viewer
+// drag-drop / hero-pin updates the live front page on next deploy.
+// Always upgrades to the largest Shopify variant (strips _NxN size suffix) so
+// the full-page hero stays sharp.
+(async function hydrateHero() {
+ try {
+ const r = await fetch('/api/products?limit=1');
+ if (!r.ok) return;
+ const d = await r.json();
+ let url = d.items && d.items[0] && d.items[0].image_url;
+ if (!url) return;
+ if (/^https:\/\/(?:cdn\.shopify\.com|designerwallcoverings\.com)\//.test(url)) {
+ url = url.replace(/(_\d+x\d*)(\.(jpg|jpeg|png|webp|gif))(\?|$)/i, '$2$4');
+ const bg = document.getElementById('heroBg');
+ if (bg) bg.style.backgroundImage = "url('" + url + "')";
+ }
+ } catch(e){}
+})();
+
+
+// DW STANDARD sort-select wire-up (added by fleet patcher)
+(function(){
+ const sortSel = document.getElementById('sortSelect');
+ if (!sortSel) return;
+ const KEY = location.hostname.replace(/\./g, '_') + '_sort';
+ const saved = localStorage.getItem(KEY);
+ if (saved) { try { sortSel.value = saved; } catch(e){} }
+ if (typeof state !== 'undefined') state.sort = sortSel.value;
+ sortSel.addEventListener('change', e => {
+ const v = e.target.value;
+ try { localStorage.setItem(KEY, v); } catch(e){}
+ if (typeof state !== 'undefined') state.sort = v;
+ if (typeof resetGrid === 'function') resetGrid();
+ else location.reload();
+ });
+})();
</script>
</body>
← e257a68 initial scaffold (gitify-all 2026-05-06)
·
back to Linenwallpaper
·
graphic-loop pass 2: fix .corner-mark contrast + soften hero 93f743a →