← back to Textilewallpaper
graphic-loop pass 10: center-mark to top + readable text-shadow + tighter letter-spacing (no mix-blend-mode)
81365c0aecf03cfc80a4df0ee86167582b645a20 · 2026-05-07 09:26:43 -0700 · Steve
Files touched
Diff
commit 81365c0aecf03cfc80a4df0ee86167582b645a20
Author: Steve <steve@designerwallcoverings.com>
Date: Thu May 7 09:26:43 2026 -0700
graphic-loop pass 10: center-mark to top + readable text-shadow + tighter letter-spacing (no mix-blend-mode)
---
public/index.html | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/public/index.html b/public/index.html
index 1184f2b..bc72b4d 100644
--- a/public/index.html
+++ b/public/index.html
@@ -64,7 +64,7 @@ header { position:fixed; top:0; left:0; right:0; display:flex; justify-content:s
.cinema-bg::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 60%, rgba(0,0,0,0.75) 100%) }
.corner-mark { position:absolute; top:24px; left:32px; font-size:11px; font-weight:700; letter-spacing:0.32em; text-transform:uppercase; color:#fff; text-shadow:0 1px 3px rgba(0,0,0,0.55), 0 0 1px rgba(0,0,0,0.4); z-index:5 }
.corner-mark::before { content:"◆ "; margin-right:6px }
-.center-mark { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); font-size:clamp(34px,5vw,72px); font-weight:300; letter-spacing:0.42em; text-transform:uppercase; text-align:center; color:#fff; z-index:5; mix-blend-mode:difference }
+.center-mark { position:absolute; top:clamp(80px,12vh,140px); left:50%; transform:translateX(-50%); font-size:clamp(28px,4vw,56px); font-weight:500; letter-spacing:0.18em; text-transform:uppercase; text-align:center; color:#fff; text-shadow:0 2px 8px rgba(0,0,0,0.65), 0 0 1px rgba(0,0,0,0.5); z-index:5 }
.center-mark .tm { font-size:14px; vertical-align:super; opacity:0.7; margin-left:0.2em }
.center-mark .sub { display:block; font-family:'Playfair Display', Georgia, serif; font-style:italic; font-weight:400; font-size:0.4em; letter-spacing:0.04em; text-transform:none; margin-top:14px; opacity:0.85 }
.meta-line { position:absolute; bottom:32px; left:32px; font-size:10px; letter-spacing:0.28em; text-transform:uppercase; font-weight:700; color:#fff; z-index:5; opacity:0.85 }
@@ -133,7 +133,7 @@ footer { padding:64px 32px 32px; border-top:1px solid var(--line); margin-top:32
@media (max-width:720px) {
.corner-mark, .meta-line, .enter { font-size:10px }
- .center-mark { font-size:30px; letter-spacing:0.32em }
+ .center-mark { font-size:24px; letter-spacing:0.12em; top:clamp(60px,9vh,90px) }
.section, footer { padding-left:20px; padding-right:20px }
.footer-grid { grid-template-columns:1fr; gap:32px }
.search { margin-left:0; flex:1 1 100% }
← 6f71dbc graphic-loop pass 9: real site name + 20-image hero rotation
·
back to Textilewallpaper
·
graphic-loop pass 11: add Ideas rails (New this week + Curat e4fde46 →