diff options
| author | Tyler Hoang <tyler@tylerhoang.xyz> | 2026-05-26 19:28:43 -0700 |
|---|---|---|
| committer | Tyler Hoang <tyler@tylerhoang.xyz> | 2026-05-26 19:28:43 -0700 |
| commit | 66802e23d77a23b72ac786d049a6ce653c5150eb (patch) | |
| tree | e6c1db8a398730a4be8141dba3aaa2f2cadad01e /enter.html | |
| parent | f41c502a0aaa1c835cebc5b723bf37facc00acca (diff) | |
redesign: add Y2K chrome theme + theme switcher
- Add Y2K Chrome / Frutiger Aero two-theme switcher (floating pill, top-right)
- Theme persists via localStorage under 'tyler.theme', no flash on load
- Chrome theme: brushed-metal panels, iridescent titlebar seam, holographic
cursor, blueprint wallpaper, Audiowide/Michroma/Space Grotesk fonts
- Aero theme: upgraded to Plus Jakarta Sans + IBM Plex Mono
- Z-index hygiene: .icons → 10, .win → 50, .bubble-field → 0
- Sparkle cursor is theme-aware (cyan→pink for chrome, warm rainbow for aero)
- Music toggle is theme-aware: bazaar theme (aero) / coolman (chrome),
swaps live if you change theme while music is playing
- Add img/wallpaper-chrome.png (blueprint wallpaper for chrome theme)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Diffstat (limited to 'enter.html')
| -rwxr-xr-x | enter.html | 8 |
1 files changed, 7 insertions, 1 deletions
@@ -3,6 +3,9 @@ <head> <meta charset="UTF-8" /> <title>welcome — tyler.xyz</title> +<link rel="preconnect" href="https://fonts.googleapis.com" /> +<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> +<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Audiowide&family=Michroma&family=Plus+Jakarta+Sans:wght@200;300;400;500;600;700;800&family=Space+Grotesk:wght@400;500;700&family=IBM+Plex+Mono:wght@400;500&display=swap" /> <link rel="stylesheet" href="aero.css" /> <style> body { @@ -157,7 +160,8 @@ .badge.silver { background: linear-gradient(to bottom, oklch(88% 0.02 230), oklch(60% 0.04 235)); border-color: oklch(45% 0.05 240); color: oklch(20% 0.04 240); text-shadow: 0 1px 0 rgba(255,255,255,0.6); } </style> </head> -<body> +<body class="welcome-body"> + <script>(function(){var t=localStorage.getItem('tyler.theme')||'aero';document.body.setAttribute('data-theme',t);})();</script> <div id="bub-stage" style="position:fixed;inset:0;pointer-events:none;z-index:0"></div> <div class="stage"> @@ -184,8 +188,10 @@ <script src="aero.js"></script> <script> + Aero.initTheme(); Aero.spawnBubbles(document.getElementById('bub-stage'), 26); Aero.sparkleCursor(); + Aero.mountThemeSwitcher(); </script> </body> </html> |