A site megtanul témát váltani, és leszokik az ikonokról

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>

This commit is contained in:

mr.zero

2026-08-20 12:24:42 +02:00

co-authored by

Claude Opus 5

parent e040763454

commit e431e2b85b

47 changed files with 2157 additions and 3322 deletions

									
										apps/frontend/package.json
									
		+2
		-2
	
												View File
												
				@@ -12,8 +12,8 @@

				    "test:watch": "vitest"

				  },

				  "dependencies": {

				    "@fortawesome/fontawesome-free": "^7.3.1",

				    "dompurify": "^3.4.12",

				    "lucide-vue-next": "^1.0.0",

				    "pinia": "^2.2.0",

				    "tuicss": "^2.1.2",

				    "vue": "^3.5.0",

				@@ -29,7 +29,7 @@

				    "eslint": "^9.0.0",

				    "eslint-plugin-vue": "^9.28.0",

				    "happy-dom": "^20.11.1",

				    "jsdom": "^29.1.1",

				    "jsdom": "^26.1.0",

				    "postcss": "^8.4.0",

				    "tailwindcss": "^3.4.0",

				    "typescript": "^5.6.0",