Redesign blogu 2026

To jsem chtěl udělat už roky – zavést vzdušnější design, podporovat větší šířku displejů, u panelů se pokusit o efekt skla plovoucího nad povrchem. Asi třikrát jsem začal, jenže tohle už je příliš specifické téma vyžadující znalosti, dobré oko a spoustu praxe. A tak jsem žádný pokus nedokončil.

Povedlo se to až s AI, konkrétně s Codexem a modelem GPT 5.6 Terra (medium). Jako obvykle to bylo krásně jednoduché a plynulé. Nejdřív jsem do prázdného projektu dal dva vzorové soubory (index a poslední článek) spolu s jejich screenshoty a optal se:

V projektu mám dva ukázkové html soubory s připojenýmí css a dva screenshoty. Chci dělat úpravy designu. Co k tomu potřebuješ pro efektivní fungování?

Codex mi napsal, co potřebuje upřesnit (například jestli screenshoty jsou současný nebo cílový stav, jestli smí sahat i na html apod.), z nástrojů nechtěl nic, takže jsem pokračoval:

Screenshot je současný stav. Upravovat můžeš jen CSS. Chci zachovat použití fontu Tinos a jejich preload. Nové assety přidávat můžeš. Můj cíl je 1) optimalizace a modernizace CSS (ale nesmí se žádné třídy ztratit, i když je vzorové html třeba nepoužívají) 2) úprava designu pro vzdušnější pocit (při zachování barev, které jsou pro blog typické a v podstatě značka). Líbilo by se mi dosáhout efektu skla u panelů se světle modrou barvou (navigace vlevo, nadpis článku, … )

a tou novou, co tu vidíte kolem:

byl asi hodina a půl. I kdybych to uměl, dělal bych to po večerech týden…

Každopádně mohou tu být problémy; pokud narazíte na nějakou nefunkčnost, prosím dejte mi vědět mailem nebo v komentářích.