fix: 3-way toggle on all designs, remove font-weight:300 across A/B/C

This commit is contained in:
posimai 2026-04-01 11:53:11 +09:00
parent e3464c1215
commit 0533f6fe8c
3 changed files with 32 additions and 18 deletions

View File

@ -8,7 +8,7 @@
<title>Ponshu Room</title> <title>Ponshu Room</title>
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<script src="https://unpkg.com/lucide@0.344.0/dist/umd/lucide.min.js" integrity="sha384-tTkFttkBclaU1cloKwOi9xk3pbao3VZxTjLNBt8iFABWDBQibbAbWpVmO28zMuxq" crossorigin="anonymous"></script> <script src="https://unpkg.com/lucide@0.344.0/dist/umd/lucide.min.js" integrity="sha384-tTkFttkBclaU1cloKwOi9xk3pbao3VZxTjLNBt8iFABWDBQibbAbWpVmO28zMuxq" crossorigin="anonymous"></script>
<style> <style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
@ -151,7 +151,7 @@
margin-bottom: 18px; margin-bottom: 18px;
} }
.hero h1 .light { font-weight: 300; color: var(--text2); } .hero h1 .light { font-weight: 400; color: var(--text2); }
.hero-desc { .hero-desc {
font-size: 16px; font-size: 16px;
@ -910,11 +910,18 @@ if (window.lucide) lucide.createIcons();
<script> <script>
(function(){ (function(){
if(!location.search.includes('dev=1')) return; if(!location.search.includes('dev=1')) return;
const btn = document.createElement('a'); const wrap = document.createElement('div');
btn.href = '/?dev=1'; wrap.style.cssText = 'position:fixed;bottom:20px;right:20px;z-index:9999;display:flex;gap:6px;';
btn.textContent = '← Design A'; ['A:/', 'B:/index-b.html', 'C:/index-c.html'].forEach(function(s){
btn.style.cssText = 'position:fixed;bottom:20px;right:20px;z-index:9999;font-family:monospace;font-size:11px;padding:6px 12px;background:rgba(253,252,249,0.95);color:#C2692A;border:1px solid #C2692A;border-radius:6px;text-decoration:none;box-shadow:0 2px 8px rgba(0,0,0,0.1);'; const [label, href] = s.split(':');
document.body.appendChild(btn); const a = document.createElement('a');
a.href = href + '?dev=1';
a.textContent = label;
const isCurrent = label === 'B';
a.style.cssText = 'font-family:monospace;font-size:11px;padding:6px 12px;border-radius:6px;text-decoration:none;transition:all 0.15s;box-shadow:0 2px 8px rgba(0,0,0,0.08);' + (isCurrent ? 'background:#C2692A;color:#fff;border:1px solid #C2692A;' : 'background:rgba(253,252,249,0.95);color:#78716C;border:1px solid rgba(194,105,42,0.3);');
wrap.appendChild(a);
});
document.body.appendChild(wrap);
})(); })();
</script> </script>
</body> </body>

View File

@ -8,7 +8,7 @@
<title>Posimai Store</title> <title>Posimai Store</title>
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<script src="https://unpkg.com/lucide@0.344.0/dist/umd/lucide.min.js" integrity="sha384-tTkFttkBclaU1cloKwOi9xk3pbao3VZxTjLNBt8iFABWDBQibbAbWpVmO28zMuxq" crossorigin="anonymous"></script> <script src="https://unpkg.com/lucide@0.344.0/dist/umd/lucide.min.js" integrity="sha384-tTkFttkBclaU1cloKwOi9xk3pbao3VZxTjLNBt8iFABWDBQibbAbWpVmO28zMuxq" crossorigin="anonymous"></script>
<style> <style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
@ -154,7 +154,7 @@
max-width: 700px; max-width: 700px;
} }
.hero h1 .muted { font-weight: 300; color: var(--text2); } .hero h1 .muted { font-weight: 400; color: var(--text2); }
.hero-sub { .hero-sub {
font-size: 16px; font-size: 16px;

View File

@ -14,7 +14,7 @@
<title>Posimai Store</title> <title>Posimai Store</title>
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:ital,wght@0,300;0,400;0,500;0,600;1,300&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<script src="https://unpkg.com/lucide@0.344.0/dist/umd/lucide.min.js" integrity="sha384-tTkFttkBclaU1cloKwOi9xk3pbao3VZxTjLNBt8iFABWDBQibbAbWpVmO28zMuxq" crossorigin="anonymous"></script> <script src="https://unpkg.com/lucide@0.344.0/dist/umd/lucide.min.js" integrity="sha384-tTkFttkBclaU1cloKwOi9xk3pbao3VZxTjLNBt8iFABWDBQibbAbWpVmO28zMuxq" crossorigin="anonymous"></script>
<style> <style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
@ -116,7 +116,7 @@
.hero h1 { .hero h1 {
font-size: clamp(32px, 5vw, 52px); font-size: clamp(32px, 5vw, 52px);
font-weight: 300; font-weight: 400;
letter-spacing: -0.03em; letter-spacing: -0.03em;
line-height: 1.15; line-height: 1.15;
color: var(--text); color: var(--text);
@ -282,7 +282,7 @@
.tier-price { .tier-price {
font-size: 28px; font-size: 28px;
font-weight: 300; font-weight: 400;
letter-spacing: -0.03em; letter-spacing: -0.03em;
line-height: 1; line-height: 1;
} }
@ -374,7 +374,7 @@
.philosophy p { .philosophy p {
font-size: 18px; font-size: 18px;
font-weight: 300; font-weight: 400;
line-height: 1.9; line-height: 1.9;
color: var(--text2); color: var(--text2);
letter-spacing: -0.01em; letter-spacing: -0.01em;
@ -597,11 +597,18 @@ if (window.lucide) lucide.createIcons();
<script> <script>
(function(){ (function(){
if(!location.search.includes('dev=1')) return; if(!location.search.includes('dev=1')) return;
const btn = document.createElement('a'); const wrap = document.createElement('div');
btn.href = '/index-b.html?dev=1'; wrap.style.cssText = 'position:fixed;bottom:20px;right:20px;z-index:9999;display:flex;gap:6px;';
btn.textContent = 'Design B →'; ['A:/', 'B:/index-b.html', 'C:/index-c.html'].forEach(function(s){
btn.style.cssText = 'position:fixed;bottom:20px;right:20px;z-index:9999;font-family:monospace;font-size:11px;padding:6px 12px;background:rgba(0,0,0,0.7);color:#6EE7B7;border:1px solid #6EE7B7;border-radius:6px;text-decoration:none;backdrop-filter:blur(8px);'; const [label, href] = s.split(':');
document.body.appendChild(btn); const a = document.createElement('a');
a.href = href + '?dev=1';
a.textContent = label;
const isCurrent = label === 'A';
a.style.cssText = 'font-family:monospace;font-size:11px;padding:6px 12px;border-radius:6px;text-decoration:none;transition:all 0.15s;' + (isCurrent ? 'background:rgba(0,0,0,0.85);color:#6EE7B7;border:1px solid #6EE7B7;backdrop-filter:blur(8px);' : 'background:rgba(0,0,0,0.6);color:#9CA3AF;border:1px solid rgba(156,163,175,0.4);backdrop-filter:blur(8px);');
wrap.appendChild(a);
});
document.body.appendChild(wrap);
})(); })();
</script> </script>
</body> </body>