Zastosowanie wszystkich poprawek UI i logiki kalkulatora

2026-08-10 23:26:52 +02:00
commit 7324a6f800
218 changed files with 33628 additions and 0 deletions
@@ -0,0 +1,78 @@
+# Strony 08–11 — Realizacje, Blog, O nas, Kontakt
+
+---
+
+## 08 — Realizacje (`/realizacje`)
+
+### Sekcje
+1. **Hero** — H1 „Nasze realizacje" + jedno zdanie.
+2. **Filtry kategorii** (`ProjectFilters`) — przyciski: Wszystkie · Klimatyzacja · Pompy ciepła ·
+   Remonty · Hydraulika. Client Component (filtrowanie po stanie).
+3. **Siatka realizacji** (`ProjectsGrid`) — karty z `content/projects.ts`: zdjęcie, tytuł,
+   lokalizacja, tag kategorii. Hover: powiększenie + nakładka z tytułem.
+4. **Pasek liczb** (`StatsBar`) — liczba realizacji, lat, miast.
+5. **CTA końcowe** (`CtaBanner`) — „Chcesz podobny efekt? Umów konsultację".
+
+### SEO
+Metadata: wiersz „Realizacje". JSON-LD: opcjonalnie ItemList.
+
+---
+
+## 09 — Blog (`/blog` + `/blog/[slug]`)
+
+### Lista (`/blog`)
+1. **Hero** — H1 „Blog i poradniki" + zdanie.
+2. **Filtry kategorii** — Klimatyzacja, Pompy ciepła, Remonty, Hydraulika, Porady.
+3. **Wyróżniony artykuł** (`FeaturedPost`) — duży kafel (post z `featured: true`).
+4. **Siatka artykułów** (`PostsGrid`) — karty: miniatura, kategoria, tytuł, zajawka, data, „Czytaj więcej".
+5. **Paginacja** — prosta (lub „pokaż więcej").
+
+### Wpis (`/blog/[slug]`)
+- `generateStaticParams` + `generateMetadata` z danych posta.
+- Układ: tytuł (H1), meta (data, autor, kategoria), obraz główny, treść (`prose`),
+  sekcja „Powiązane artykuły" (3 karty), CTA do usługi powiązanej z tematem.
+- JSON-LD: BlogPosting + BreadcrumbList.
+
+### SEO
+Metadata: wiersz „Blog" (lista) / dynamiczne (wpis).
+
+---
+
+## 10 — O nas (`/o-nas`)
+
+### Sekcje
+1. **Hero** — H1 „O nas" + zdanie misji.
+2. **Historia firmy** (`AboutStory`) — tekst + zdjęcie (placeholder).
+3. **Pasek statystyk** (`StatsBar`) — lata, realizacje, klienci, miasta (z `content/company.ts`).
+4. **Wartości / jak pracujemy** (`ValuesGrid`) — 3–4 kafelki.
+5. **Certyfikaty i uprawnienia** (`CertificatesSection`) — logotypy, F-gaz, autoryzacje (placeholdery).
+6. **Opinie** (`Testimonials`).
+7. **CTA końcowe** (`CtaBanner`).
+
+### SEO
+Metadata: wiersz „O nas". JSON-LD: LocalBusiness (rozszerzony).
+
+---
+
+## 11 — Kontakt (`/kontakt`)
+
+### Sekcje
+1. **Nagłówek** — H1 „Kontakt" + zachęta.
+2. **Dwie kolumny** (`ContactSection`):
+   - Lewa: dane kontaktowe (telefon, e-mail, adres, godziny, NIP) — duże, klikalne.
+   - Prawa: **formularz** (`ContactForm`, Client Component) — RHF + Zod:
+     imię, telefon, e-mail, temat (select: Klimatyzacja / Pompy ciepła / Remonty / Hydraulika /
+     Serwis AGD / Inne), wiadomość, zgoda RODO (checkbox), przycisk „Wyślij".
+     Walidacja inline, stany: błąd / wysyłanie / sukces. Obsługa przez Server Action
+     w `app/kontakt/actions.ts` (na razie bez realnej wysyłki — miejsce na integrację, np. Resend).
+3. **Mapa** (`MapEmbed`) — Google Maps na całą szerokość (placeholder/iframe).
+4. **Szybki kontakt** — przyciski „Zadzwoń" / „Napisz".
+
+### SEO
+Metadata: wiersz „Kontakt". JSON-LD: LocalBusiness.
+
+---
+
+## Uwaga
+Formularz: poprawna dostępność (labelki powiązane z polami, komunikaty błędów czytane przez czytniki),
+focus na pierwszym błędnym polu, blokada podwójnego wysłania.