High-Density Editorial
Żywa dokumentacja turbo-portalu — tokeny i komponenty czytane z produkcyjnego CSS. Przełącznik motywu w nagłówku działa też tutaj (sprawdź kolory w dark).
Zasady
Ink & PaperWysoki kontrast, biel jako płótno, czerwień tylko jako akcent (marka / breaking).
Ostre rogi0px radius wszędzie — architektoniczny, „drukowany” charakter.
Hairlines, zero cieniGłębia przez linie 1px i tonację, nigdy box-shadow.
Siatka 12-kolumnKolumnowy rytm gazety; główny feed 8 + sidebar 4.
Kolory (tokeny)
Tło i powierzchnie
--bg #ffffff główne płótno --paper #f8f9fa delikatne tło --sidebar #f4f5f6 moduły boczne Atrament (tekst / linie)
--ink #17191c nagłówki, tekst --ink-soft #4b5560 tekst drugorzędny --line #d7dce2 hairline 1px --line-strong #b9c0c9 mocniejsza linia Akcent (marka / breaking)
--red #e31e24 marka, akcent --red-deep #ba0013 hover / głębszy --slate #4d5c72 tertiary Swatche renderują realne zmienne z global.css. Hex = tryb jasny; dark mode ma własny zestaw (przełącz motyw, żeby zobaczyć).
Typografia
Retail media z sygnałów sieci
Nagłówek sekcji artykułu
Tytuł karty na liście
Treść artykułu — Inter zapewnia czytelność przy małych rozmiarach na ekranie.
KATEGORIA · TIMESTAMP
Komponenty
Etykiety i badge
Technologie opublikowany w recenzji AI-assisted
Karta artykułu (high-density)
Nagłówek sekcji + reguła
Najnowsze
Cytat (blockquote) w treści
Retail media to najszybciej rosnący kanał reklamowy dekady.
Blok źródeł (provenance)
Przyciski i input
Pull-quote
„Retail media to najszybciej rosnący kanał reklamowy dekady."Raport branżowy 2026
Empty-state
▦
Brak materiałów
W tej sekcji nie ma jeszcze treści. Wróć wkrótce.
Paginacja
Tabela danych
| Sieć | Format | Rynek |
|---|---|---|
| Żabka | In-store + app | PL |
| Allegro Ads | Sponsored products | PL/CEE |
| Eurocash | Digital signage | PL |
Related / „czytaj też"
Hero slider — okładka oddzielona od treści (układy: lewo / prawo / góra)
Statyczny podgląd jednego slajdu. Na żywo slider rotuje 5 najnowszych w układach lewo/prawo/góra — auto-przewijanie, strzałki, kropki, swipe/drag.
Kafle mozaiki — pełnokadrowy (overlay) vs klasyczny (okładka + treść pod)
Infografiki raportów (inline, zero-JS, theme-aware)
1,7 mld zł
Wartość rynku retail media w PL
+30% r/r
70 tys.
Ekranów reklamowych
48,7%
Klientów reaguje na reklamy
Czas względny (time.ago — liczony w kliencie)
fallback bez JS = data + godzina · tooltip = pełny timestamp
Czego jeszcze brakuje
Galeria pokrywa aktualny zestaw komponentów produkcyjnych. Dochodzą tu w miarę rozwoju portalu.