174 lines
5.0 KiB
Markdown
174 lines
5.0 KiB
Markdown
# NordaBiz UI Redesign Changelog
|
|
|
|
## Cel projektu
|
|
Zmiana wyglądu nordabiznes.pl na zgodny z norda-biznes.info, zachowując wszystkie funkcjonalności.
|
|
|
|
---
|
|
|
|
## PRZED ZMIANAMI (Produkcja - 30.01.2026)
|
|
|
|
**Screenshot ID:** ss_7892h2ggn
|
|
|
|
### Obecny stan:
|
|
- **Czcionka:** Inter
|
|
- **Primary color:** #2563eb (jasny niebieski)
|
|
- **Tło:** #f8fafc
|
|
- **Event banner:** pomarańczowy (#f59e0b)
|
|
- **NordaGPT banner:** fioletowy (#7c3aed)
|
|
- **Karty firm:** cień (box-shadow), hover z translateY
|
|
- **Przyciski:** border-radius 8px (symetryczny)
|
|
|
|
---
|
|
|
|
## SPRINT 1: Fundamenty (Commit: de46e12)
|
|
|
|
**Screenshot ID:** ss_3438lwagj
|
|
|
|
### Zmiany:
|
|
1. **Czcionka:** Inter → **Poppins**
|
|
2. **Primary color:** #2563eb → **#2E4872**
|
|
3. **Primary dark:** #1e40af → **#1e3050**
|
|
4. **Primary light:** #3b82f6 → **#4a6999**
|
|
5. **Tło (background):** #f8fafc → **#EDF0F5**
|
|
6. **Border color:** #e2e8f0 → **#e0e4eb**
|
|
7. **Border-radius przycisków:** 0.5rem → **12px 4px 12px 4px** (asymetryczny)
|
|
8. **Header:** usunięcie border-bottom, cień `0 2px 10px rgba(46, 72, 114, 0.08)`
|
|
9. **Footer:** background #1e293b → **#2E4872**, padding 60px/30px
|
|
|
|
### Pliki zmienione:
|
|
- `templates/base.html`
|
|
|
|
---
|
|
|
|
## SPRINT 2: Bannery i karty firm (Commit: 1da42f2)
|
|
|
|
**Screenshot ID:** ss_29596hr83
|
|
|
|
### Zmiany:
|
|
1. **Event banner:** #f59e0b (pomarańczowy) → **#2E4872** (niebieski)
|
|
2. **NordaGPT banner:** #7c3aed (fioletowy) → **#2E4872** (niebieski)
|
|
3. **Karty firm:** usunięcie box-shadow, dodanie `border: 1px solid #e0e4eb`
|
|
4. **Karty firm hover:** `border-color: var(--primary)` zamiast translateY
|
|
5. **Tagi kategorii:**
|
|
- background: primary (#2E4872)
|
|
- color: white
|
|
- font-size: 11px
|
|
- text-transform: uppercase
|
|
- letter-spacing: 0.5px
|
|
6. **Przyciski w bannerach:** asymetryczny border-radius
|
|
|
|
### Pliki zmienione:
|
|
- `templates/index.html`
|
|
|
|
---
|
|
|
|
## SPRINT 3: Strona chatu NordaGPT (Commit: b680e3f)
|
|
|
|
**Screenshot ID:** ss_6281tcv2v
|
|
|
|
### Zmiany:
|
|
1. **Chat header:** #7c3aed/#5b21b6 → **#2E4872/#1e3050**
|
|
2. **Sidebar "Nowa rozmowa" button:** fioletowy → niebieski
|
|
3. **Message avatars (AI):** fioletowy gradient → niebieski gradient
|
|
4. **Input focus:** border-color i box-shadow na niebieski
|
|
5. **Send button:** fioletowy gradient → niebieski gradient
|
|
6. **Typing indicator dots:** #7c3aed → #2E4872
|
|
7. **Suggestion chips hover:** fioletowy → niebieski
|
|
8. **Thinking toggle:** fioletowe akcenty → niebieskie
|
|
9. **Fluent CSS:** wszystkie zmienne primary na NordaBiz blue
|
|
|
|
### Pliki zmienione:
|
|
- `templates/chat.html`
|
|
- `static/css/fluent-nordabiz.css`
|
|
|
|
---
|
|
|
|
## SPRINT 6: Karty firm i tagi (Commit: 64583b6)
|
|
|
|
**Screenshot ID:** ss_sprint6
|
|
|
|
### Zmiany:
|
|
1. **Karty firm border-radius:** `8px` → `0` (ostre rogi jak na źródle)
|
|
2. **Karty firm border:** `#e0e4eb` → `#E4E4E4`
|
|
3. **Tagi kategorii background:** niebieski primary → `#EDF0F5` (szary)
|
|
4. **Tagi kategorii color:** biały → `#464646` (ciemny)
|
|
5. **Text primary:** `#1e293b` → `#303030`
|
|
6. **Text secondary:** `#64748b` → `#464646`
|
|
|
|
### Pliki zmienione:
|
|
- `templates/base.html`
|
|
- `templates/index.html`
|
|
|
|
---
|
|
|
|
## SPRINT 5: Landing page (Commit: ede9d09)
|
|
|
|
**Screenshot ID:** ss_sprint5
|
|
|
|
### Zmiany:
|
|
1. **Hero gradient:** `#1e40af/#2563eb/#3b82f6` → `#1e3050/#2E4872/#4a6999`
|
|
2. **Accent color:** `#2563eb` → `#2E4872`
|
|
3. **Hero section:** `data-animate="fadeIn"`
|
|
4. **Stats section:** `data-animate="fadeInUp"`
|
|
5. **CTA section:** `data-animate="fadeInUp"`
|
|
|
|
### Pliki zmienione:
|
|
- `templates/landing.html`
|
|
|
|
---
|
|
|
|
## SPRINT 4: Animacje scroll (Commit: 6e1c46e)
|
|
|
|
**Screenshot ID:** ss_sprint4
|
|
|
|
### Zmiany:
|
|
1. **Nowy plik:** `static/js/scroll-animations.js` z IntersectionObserver
|
|
2. **CSS keyframes:** fadeIn, fadeInUp, fadeInLeft, fadeInRight, scaleIn
|
|
3. **Event banner:** `data-animate="fadeIn"`
|
|
4. **Chat banner:** `data-animate="fadeIn"`
|
|
5. **Search section:** `data-animate="fadeIn"`
|
|
6. **Karty firm:** `data-animate="fadeInUp"` z delay stagger (1-6)
|
|
7. **Accessibility:** `prefers-reduced-motion` wsparcie
|
|
|
|
### Pliki zmienione:
|
|
- `templates/base.html`
|
|
- `templates/index.html`
|
|
- `static/js/scroll-animations.js` (NOWY)
|
|
|
|
---
|
|
|
|
## PODSUMOWANIE ZMIAN
|
|
|
|
| Element | PRZED | PO |
|
|
|---------|-------|-----|
|
|
| Czcionka | Inter | **Poppins** |
|
|
| Primary | #2563eb | **#2E4872** |
|
|
| Tło | #f8fafc | **#EDF0F5** |
|
|
| Border-radius btn | 8px | **12px 4px** |
|
|
| Event banner | #f59e0b | **#2E4872** |
|
|
| NordaGPT | #7c3aed | **#2E4872** |
|
|
| Karty firm | box-shadow | **border** |
|
|
| Tagi | szare, małe | **uppercase, primary** |
|
|
| Footer | #1e293b | **#2E4872** |
|
|
| Animacje scroll | brak | **fadeIn + IntersectionObserver** |
|
|
| Landing hero | #1e40af/#2563eb | **#1e3050/#2E4872** |
|
|
| Karty firm radius | 8px | **0 (ostre rogi)** |
|
|
| Tagi kategorii | niebieski bg | **szary (#EDF0F5)** |
|
|
| Tekst body | #1e293b | **#303030** |
|
|
|
|
---
|
|
|
|
## Screenshot IDs (do osadzenia w HTML)
|
|
|
|
1. `ss_7892h2ggn` - PRZED zmianami
|
|
2. `ss_3438lwagj` - Po Sprint 1
|
|
3. `ss_29596hr83` - Po Sprint 2
|
|
4. `ss_6281tcv2v` - Po Sprint 3 (chat)
|
|
5. `ss_sprint4` - Po Sprint 4 (animacje)
|
|
6. `ss_sprint5` - Po Sprint 5 (landing page)
|
|
7. `ss_sprint6` - Po Sprint 6 (karty firm, tagi)
|
|
|
|
---
|
|
|
|
Data dokumentacji: 2026-01-30
|