Etap 10 — Kiosk: szablon Temrex (wszystkie ekrany)

Dokument porównawczy ekranów kiosku w skórce Temrex: po lewej jak ma wyglądać wg Temrexu (wizualizacja z new_temrex/ekrany ergo.pdf), po prawej nasz kiosk (render z aplikacji).

Temrex dostarczył wizualizacje tylko dla logowania i menu. Pozostałe ekrany oznaczamy DO DOSTARCZENIA #N (numer wizualizacji do przygotowania przez Temrex) — a po prawej pokazujemy nasz ekran w stylu Temrex (już zrobiony).

Architektura: moduł szablonów lib/templates/ (SkinScope + rejestr widoków per‑ekran + wzorzec „State implementuje presenter"). Login / Menu / Brak‑paczek mają w pełni autorski layout (topbar z logo, zegar, hero, kafle). Pozostałe ekrany dostają ramę Temrex: HeaderBar i FooterBrand są świadome szablonu — gdy aktywny TEMREX renderują topbar Temrex (flagi / wycentrowane logo / nr maszyny) + czystą stopkę zegar+data (bez ErgoFlow); treść jest już w palecie Temrex (biały / czerwień #F50000 / Montserrat). Render referencyjny: test/temrex_preview_test.dart.

Legenda: ✅ bespoke (autorski layout) · 🟦 rama Temrex (topbar + zegar + paleta, treść współdzielona) · 🎨 paleta Temrex (ekran‑modal/własny, bez osobnego topbara).

---

✅ Autorski layout (login + menu — 1:1 z deckiem)

1. Logowanie — karta (login_screen)

Topbar (flagi / wycentrowane logo / czerwona pomoc + nr maszyny), segment „KARTA pracownika | Kod PIN" (aktywny = czerwień), info‑banner, duży zegar, dolny hero.

Temrex (deck)	Nasz kiosk ✅

2. Logowanie — PIN (login_screen, zakładka PIN)

Deck ma „User ID + PIN + QWERTY"; nasza autoryzacja to 6‑cyfrowy PIN, więc adaptacja: segment + numeryczny pad + ✓ + zegar + hero.

Temrex (deck)	Nasz kiosk ✅

3. Menu funkcji (user_menu_screen)

„Witaj, {imię}", 2×2 kafle (ikony Temrex + nasze etykiety WIELKIMI literami, wyśrodkowane, podkreślenie akcentem, aktywny = czerwień), zegar + data. Temrex obsługuje automat operacyjny/magazynowy, więc menu odwzorowuje czasowniki z decku: WYDAWANIE (Collect — wózek), UZUPEŁNIANIE ZAMÓWIEŃ (Restock — lista + ✓), INWENTARYZACJA (Inventory — schowek; ekran‑placeholder, flow zliczania wkrótce) oraz ADMIN (tarcza → diagnostyka skrytek; tylko rola ADMIN). „Wygląd kiosku" (zmiana motywu) przeniesiony do widoku Admin/diagnostyka (pigułka u góry, widoczna na wszystkich zakładkach).

Temrex (deck)	Nasz kiosk ✅

4. Brak paczek (no_parcels_screen)

Czysta biała karta na canvasie Temrex, czerwone akcenty, logo + zegar, przyciski „WYLOGUJ / ZOSTAŃ W MENU".

Temrex	Nasz kiosk ✅
DO DOSTARCZENIA #1

---

🟦 Rama Temrex (topbar + zegar + paleta) — pozostałe przepływy

Wszystkie poniższe ekrany mają wspólną ramę Temrex (z HeaderBar/FooterBrand): topbar z logo + nr maszyny, stopka zegar+data, treść w palecie Temrex. Przykładowe rendery — nadanie OK / błąd:

5–6. Nadanie — potwierdzenie / błąd (deposit_success / deposit_failure)

Nadanie OK 🟦	Nadanie błąd 🟦

7. Otwarcie skrytki / „odbierz paczkę" (locker_open_screen) + modale

Ekran‑modal otwarcia skrytki też nosi ramę Temrex: biały topbar (logo + nr maszyny) na górze, stopka zegar+data na dole, treść (badge skrytki + instrukcje) w palecie Temrex. Modale, w których trzeba coś kliknąć (potwierdzenie „idź do skrytki", „czy zabrałeś paczkę", „otwórz skrytkę" w diagnostyce) pojawiają się za delikatną mgłą (KioskTheme.modalScrim — jasny welon zamiast czarnego cienia), więc header+stopka pozostają widoczne pod spodem, a karty mają ciemny tekst na bieli.

Otwarcie skrytki 🎨 (rama Temrex)

Pozostałe ekrany w ramie Temrex (DO DOSTARCZENIA po stronie Temrex)

#	Ekran	Plik	Status
#2	Odbiór paczki (lista)	pickup_screen	🟦 rama Temrex
#3	Otwarcie skrytki (otwórz/zamknij/sukces/błąd)	locker_open_screen	🎨 paleta Temrex (ekran‑modal)
#4	Wybór nadania (nowa / istniejąca)	deposit_choice_screen	🟦 rama Temrex
#5	Wybór odbiorcy	deposit_recipient_screen	🟦 rama Temrex
#6	Numer przesyłki	deposit_lookup_screen	🟦 rama Temrex
#7	Wybór rozmiaru S/M/L	deposit_size_screen	🟦 rama Temrex
#8	Nadanie OK	deposit_success_screen	🟦 rama Temrex (render wyżej)
#9	Nadanie błąd	deposit_failure_screen	🟦 rama Temrex (render wyżej)
#10	Wydawanie produktu (katalog + karta)	dispense_screen	🟦 rama Temrex
#11	Uzupełnianie skrytek	replenish_screen	🟦 rama Temrex
#12	Diagnostyka skrytek	locker_diagnostics_screen	🟦 rama Temrex
#13	Profil użytkownika	profile_screen	🟦 rama Temrex
#14	Viewer PDF / regulamin	pdf_viewer_screen	🎨 paleta Temrex (własny chrome)
#15	Tryb serwisowy	service_mode_screen	🎨 własny „Service Mode" + spinner Temrex

---

Roadmapa wdrożenia

Etap	Zakres	Status
10.1	Fundament modułu + bespoke Login + Menu (1:1) + brand pack + font PL + nr maszyny	✅ wdrożone
10.2	Odbiór: no_parcels ✅ bespoke; pickup 🟦, locker_open 🎨	✅ wdrożone
10.3	Nadanie: deposit_choice/recipient/lookup/size/success/failure 🟦	✅ wdrożone
10.4	Wydawanie/operator: dispense, replenish 🟦	✅ wdrożone
10.5	Admin/misc: diagnostics 🟦, profile 🟦, pdf_viewer 🎨, service_mode 🎨	✅ wdrożone
10.6	Menu operacyjne (Collect/Restock/Inwentaryzacja/Admin) + „Wygląd" w Admin; nr maszyny na loginie; rama+mgła na locker_open i modalach	✅

Kiosk 1.4.1 — menu operacyjne Temrex (4 kafle), „Wygląd kiosku" w widoku Admin/diagnostyka, nr maszyny na ekranie logowania, rama Temrex + „delikatna mgła" na otwarciu skrytki i modalach. (1.4.0: wszystkie ekrany w skórce Temrex.)

Do dostarczenia przez Temrex (lista wizualizacji)

Temrex ma deck tylko dla logowania i menu. Brakujące wizualizacje (do przygotowania w tym stylu — pionowo, biały canvas, czerwień #F50000, Montserrat, topbar z logo + nr maszyny, zegar):

#1 brak paczek · #2 odbiór paczki · #3 otwarcie skrytki · #4 wybór nadania · #5 wybór odbiorcy · #6 numer przesyłki · #7 wybór rozmiaru · #8 nadanie OK · #9 nadanie błąd · #10 wydawanie · #11 uzupełnianie · #12 diagnostyka · #13 profil · #14 viewer PDF · #15 tryb serwisowy.

Gdy Temrex dostarczy którąkolwiek — podmieniamy znacznik DO DOSTARCZENIA #N na obraz i, jeśli trzeba, podnosimy dany ekran z „ramy Temrex" do pełnego bespoke layoutu 1:1.