mirror of
https://codeberg.org/Kankys/musicCalendar.git
synced 2026-06-03 00:15:32 +00:00
refactor code
This commit is contained in:
+35
-1
@@ -5,4 +5,38 @@ Odkaz na [výzvu](https://music.lukan.cz)
|
||||
|
||||
|
||||
|
||||
Do konce roku jedeme v testovacím režimu, od 1.1.2026 začínáme na ostro.
|
||||
🎸 **Glitch animace** na nadpisu
|
||||
- 📺 **Scanlines overlay** (jako starý TV)
|
||||
- 🔴 **Červená záře** kolem alba card + pulzující border
|
||||
- ⬇️ **Dynamický vstup** alba card při načtení
|
||||
- 🌫️ **Staggered fade-up** archivních kartiček
|
||||
- 🤘 **Metal styl tlačítek** s gradient červenou
|
||||
- 🖼️ **Hover efekty** na obálkách alb
|
||||
|
||||
🎸 Shrnutí přidaných efektů
|
||||
|
||||
### 🖥️ Globální
|
||||
- **Tmavý overlay** na pozadí — přes stávající fotku je přidán `rgba(0,0,0,0.6)` gradient, aby byl celý web temný a metal
|
||||
- **Scanlines** — jemné horizontální čáry přes celou stránku pomocí `body::after`, působí jako starý TV/monitor (diskrétní, nepřekáží čtení)
|
||||
|
||||
### ✏️ Nadpis
|
||||
- **Glitch animace** — každých 6 vteřin `h1` krátce "glitchne": červeno-azurový `text-shadow` + `skewX` transform, jako by byl špatný signál
|
||||
|
||||
### 💿 Karta alba
|
||||
- **Temné pozadí** s červeným borderem místo šedé
|
||||
- **Vstupní animace** — karta "dopadne" z vrchu s mírnou rotací a blur efektem
|
||||
- **Pulzující červená záře** — border a `box-shadow` plynule dýchají (tmavší → jasnější červená)
|
||||
- **Hover efekt** — karta se zvedne + záře zesílí
|
||||
- **Obálka alba** — na hover se mírně přiblíží a zvýší kontrast
|
||||
|
||||
### 📂 Archiv alb
|
||||
- **Tmavé kartičky** s červeným hover borderem a glow
|
||||
- **Staggered fade-up animace** — každá karta se vynoří o 60ms později než předchozí (vlnový efekt)
|
||||
|
||||
### 🔘 Tlačítka
|
||||
- **Archiv** — tmavočervený gradient s červenou září
|
||||
- **Footer** — temně fialový gradient
|
||||
- **Tidal/Spotify/About** — tmavší, stylizovanější verze
|
||||
|
||||
### 🎸 Logo
|
||||
- **Červený `drop-shadow`** + na hover se zvětší a otočí
|
||||
Reference in New Issue
Block a user