Dla ludzi
DraftJako deweloper frontendu
Dział zatytułowany „Jako deweloper frontendu”- Dodaj zależności workspace:
@polisoteka-design/tokensi@polisoteka-design/ui(oba pakiety żyją dziś tylko w/design— jeszcze nie są publikowane dowww//zenon). - Zaimportuj arkusz stylów raz, na poziomie aplikacji:
import "@polisoteka-design/ui/styles/globals.css". - Używaj komponentów z
@polisoteka-design/ui(Button,Input,Label,Field,Card+podkomponenty,Badge) — nie kopiuj ich kodu do swojego repo. Kopiowanie tworzy drugie źródło prawdy, które rozjeżdża się przy pierwszej poprawce a11y czy zmianie tokenu. - Jeśli potrzebujesz koloru, odstępu czy promienia, którego nie ma w
ui//klasach narzędziowych — sprawdźtokens/dist/tokens.json(płaska mapa, patrz Fundamenty → Kolor i Fundamenty → Spacing). Nowej wartości NIE wpisuj na sztywno — zgłoś brakujący token (patrz Governance → Zasady). - Sprawdzaj sekcję „Dostępność” na stronie komponentu, którego używasz —
mówi wprost, co jest zapewnione przez sam komponent, a co musisz
dopilnować w miejscu użycia (np. treść
aria-label, kolejność nagłówków).
Jako grafik
Dział zatytułowany „Jako grafik”- Kolory (rampy
navy/blue/turquoise/red/teal/violet/sky) i typografia (Geist, 12 poziomów) są finalne. Otwarty pozostaje tylko akcent sub-marek home/health/moto/travel (dziś wyprowadzony z primary, patrz Kolor) i pole ochronne/rozmiary minimalne logotypów (patrz Logotypy). - Tokeny synchronizują się docelowo z Figmą przez Tokens Studio — Figma jest
szkicownikiem,
tokens/src/*.tokens.json(kod) jest źródłem prawdy. To podpięcie jeszcze nie istnieje. - Nowe style ilustracji, logotypy i fotografia wymagają jawnej decyzji Human
— patrz Marka i zakazy w
AGENTS.md.
Gdzie szukać czego
Dział zatytułowany „Gdzie szukać czego”| Pytanie | Odpowiedź |
|---|---|
| Jaka jest wartość tokenu X w marce Y, trybie Z? | tokens/dist/tokens.json albo tabela na stronie danej sekcji (Kolor/Spacing/Typografia) |
| Czy komponent X istnieje i jaki ma status? | Strona komponentu w Komponenty |
| Jak wygląda pełna strona (artykuł, karta produktu…)? | Layouty |
| Jak brzmi marka w danym miejscu? | Treść |
@todo(sesja): rozszerzyć o realny przykład integracji z konkretnym portalem
Astro, gdy portal zacznie konsumować pakiety /design.