mr.zeroandClaude Opus 5
e431e2b85b
Nyolc akcentszín volt, oldalanként másik hero-gradienssel, tizenegy blur-blobbal és 146 ikonhasználattal — ettől nézett ki réginek. Most egy vizuális nyelv van: semleges zinc-skála, egyetlen akcens (a saját foszforzöldünk), 1px keretek árnyék helyett, és ikon csak ott, ahol nincs mellette szöveg. A választható világos/sötét téma miatt minden szín tokenen keresztül megy. A szerepeket a tokens.css írja le mindkét témára, a Tailwind szemantikus színei (bg-surface, text-fg-muted, border-line, bg-accent) ezekre mutatnak, és a <html data-theme> választ. A sütit az index.html inline scriptje olvassa ki a bundle előtt, különben minden sötét témás betöltés villanna egy világosat. A világos téma zöldje green-700: a green-600 fehéren csak 3,3:1, linkszínnek kevés. A retro mód ebből lett a legtöbbet nyerő: mostantól ő is csak a tokeneket írja felül, és azt szabályozza külön, ami formában más — betűtípus, kettős keret, tui-sáv. 1153 sor és 535 !important helyett 300 sor. Menet közben kiderült, hogy a fejléc- és menüstílusai régóta nem is fogtak: a @apply óta nincsenek a DOM-ban azok a Tailwind-osztályok, amikre épültek. A FontAwesome kikerült (258 KB webfont ~50 glifért), helyette Lucide, meg tíz saját inline márkajel. A csapatképek WebP-ben: 1,6 MB helyett 30 KB darabja. A TuiCSS és a retro.css már csak akkor töltődik be, ha valaki bekapcsolja. A dist 8,2 MB-ról 784 KB-ra, a fő CSS 237 KB-ról 41 KB-ra. Nem a faceliftből: a sanitize.test.ts jsdom alatt fut, és a jsdom függőségfája ESM-only lett — Node 20-on a fájl el sem indult, a tesztjei csendben kimaradtak, az npm run test meg hibakóddal lépett ki. jsdom 26 az utolsó, ami ezen a Node-on megy; a négy teszt így újra fut. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
31 lines
1.4 KiB
HTML
31 lines
1.4 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
|
<link rel="icon" href="/favicon.ico" />
|
|
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
|
|
<title>Teletype Games</title>
|
|
<script>
|
|
/* A témát a bundle betöltése ELŐTT tesszük a gyökérre, különben minden
|
|
sötét témás oldalbetöltés villan egy világosat. A sütit ezután az
|
|
ui.store tartja karban; süti nélkül az alapértelmezés a világos. */
|
|
(function () {
|
|
var m = document.cookie.match(/(?:^|; )theme=([^;]*)/)
|
|
var theme = m && decodeURIComponent(m[1]) === 'dark' ? 'dark' : 'light'
|
|
document.documentElement.setAttribute('data-theme', theme)
|
|
var r = document.cookie.match(/(?:^|; )retro-mode=([^;]*)/)
|
|
document.documentElement.setAttribute('data-retro', r && r[1] === '1' ? '1' : '0')
|
|
})()
|
|
</script>
|
|
<link rel="alternate" type="application/rss+xml" title="Teletype Games Blog" href="/api/rss/blog" />
|
|
<link rel="alternate" type="application/rss+xml" title="Teletype Games Releases" href="/api/rss/releases" />
|
|
<link rel="alternate" type="application/rss+xml" title="Teletype Games HowTos" href="/api/rss/howtos" />
|
|
</head>
|
|
<body>
|
|
<div id="app"></div>
|
|
<script type="module" src="/src/main.ts"></script>
|
|
</body>
|
|
</html>
|