diff --git a/README.md b/README.md index 0151395..1a36a17 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,8 @@ -# musicCalendar +# 💿 Každý den jedno album. 🎸 Zažíj numetal a grunge každý den. +## 💪 Zvládneš tuto výzvu v roce 2026? +## 🤟 Ukaž že na to máš . +Odkaz na [výzvu](https://lukaskanka.cz/musicCalendar/index.html) -Na každý den jedno album. Numetal či grunge s odkazy na Tidal a Spotify. \ No newline at end of file +Projekt hostuje [OSCloud](https://oscloud.cz/) 👉 vstupenka do světa Open-source a hostingu. Díky! + +Do konce roku jedeme v testovacím režimu, od 1.1.2026 začínáme na ostro. \ No newline at end of file diff --git a/img/electric-guitar_12494348.png b/img/electric-guitar_12494348.png new file mode 100644 index 0000000..85e3f77 Binary files /dev/null and b/img/electric-guitar_12494348.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..05c9640 --- /dev/null +++ b/index.html @@ -0,0 +1,29 @@ + + + + + Hudební Kalendář + + + + + + +

Album pro dnešní den

+

💿 Každý den jedno album. 🎸 Zažíj numetal a grunge každý den.

+ +
+ + + + + diff --git a/script.js b/script.js new file mode 100644 index 0000000..574872c --- /dev/null +++ b/script.js @@ -0,0 +1,64 @@ +// --- 1. MOJE "DATABÁZE" (Seznam alb) --- + // Tady si ručně dopíšeš alba a dny. + // Formát data musí být: "RRRR-MM-DD" (Rok-Měsíc-Den) + const kalendarAlb = [ + { + datum: "2025-12-22", // Dnešní datum (příklad) + umelec: "🎤 Alice in Chains ", + nazev: "💿 Live ", + img: "https://resources.tidal.com/images/1cabaac7/b976/48ba/8fb3/0ce6808d48eb/1280x1280.jpg", + vydano: "5. 12. 2000", + recenze: "Proč dnes: Syrový živák, poslední oficiální nahrávka s Layne Staleym před jeho smrtí. Vydáno v prosinci, nese v sobě tu správnou grunge melancholii.", + tidal: "https://tidal.com/album/77610756", + spotify: "https://open.spotify.com/album/6okv1avxEgYSdc2JYy6ZEi" + }, + { + datum: "2016-12-23", // Štědrý den + umelec: "Nine Inch Nails", + nazev: "💿 Not the Actual Events (EP)", + img: "https://resources.tidal.com/images/ee154499/d2ad/4d30/91a3/c87e83e71b12/1280x1280.jpg", + vydano: "", + recenze: "Trefa: Jedna z mála nahrávek, která vyšla přesně v tento den. Trent Reznor (který inspiroval celý nu-metal) vydal toto EP den před Štědrým dnem. Těžké, industriální, nekompromisní.", + tidal: "https://tidal.com/album/68529661", + spotify: "https://open.spotify.com/album/2fThnKRzs6iudIAzHP9VOa", + } + ]; + + // --- 2. ZJIŠTĚNÍ DNEŠNÍHO DATA --- + // Získáme dnešní datum ve formátu RRRR-MM-DD + const dnes = new Date().toISOString().split('T')[0]; + + // Pro testování si můžeš odkomentovat řádek níže a změnit datum ručně: + // const dnes = "2025-12-24"; + + console.log("Dnes je:", dnes); // Vypíše do konzole prohlížeče (F12) + + // --- 3. HLEDÁNÍ V SEZNAMU --- + // Funkce .find() projde pole 'kalendarAlb' a hledá shodu data + const dnesniAlbum = kalendarAlb.find(album => album.datum === dnes); + + // --- 4. ZOBRAZENÍ NA STRÁNCE --- + const vystup = document.getElementById('zobrazeni-alba'); + + if (dnesniAlbum) { + // Pokud jsme našli album pro dnešek: + vystup.innerHTML = ` +
+
${dnesniAlbum.datum}
+ Obal alba +

${dnesniAlbum.umelec} - ${dnesniAlbum.nazev}

+

Vyšlo ${dnesniAlbum.vydano}

+

${dnesniAlbum.recenze}

+ Tidal - Spotify + +
+ `; + } else { + // Pokud pro dnešek nic naplánováno není: + vystup.innerHTML = ` +
+

Dnes není v plánu žádné album 🎵

+

Zkus se podívat zítra!

+
+ `; + } \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..61ef134 --- /dev/null +++ b/style.css @@ -0,0 +1,62 @@ +body { font-family: sans-serif; text-align: center; padding: 50px; background-color: #333; } + .album-card { + background: grey; + padding: 20px; + border-radius: 10px; + box-shadow: 0 4px 8px rgba(0,0,0,0.1); + display: inline-block; + max-width: 400px; + } + img { width: 100%; border-radius: 5px; margin-bottom: 15px; } + h1 { color: black } + h3 { color: black} + .datum { color: red; font-size: 0.9em; margin-bottom: 10px; } + /* Styl pro tlačítka streamovacích služeb */ +.btn { + display: inline-block; /* Aby měly rozměry */ + text-decoration: none; /* Zruší podtržení */ + padding: 10px 20px; /* Vnitřní odsazení (prostor kolem textu) */ + border-radius: 25px; /* Kulaté rohy */ + color: white; /* Bílé písmo */ + font-weight: bold; + margin: 5px; /* Mezera mezi tlačítky */ + transition: transform 0.2s; /* Animace při najetí */ +} + +/* Barvy pro konkrétní služby */ +.tidal { background-color: #000000; } /* Černá pro Tidal */ +.spotify { background-color: #1DB954; } /* Zelená pro Spotify */ + +.btn:hover { + transform: scale(1.05); /* Při najetí myší se tlačítko trochu zvětší */ + opacity: 0.9; +} +footer { + margin-top: 50px; + border-top: 1px solid #ddd; + padding-top: 20px; + font-size: 0.8em; + color: #666; +} +footer a { + color: black; + margin: 0 10px; + text-decoration: none; + font-weight: bold; +} +footer a:hover { + color: #000; + text-decoration: underline; +} + +@media (max-width: 768px) { + body { + padding: 10px; + } + /* .album-card { + width: 90%; + margin: 0 auto; + padding: 20px; + background-color: #f0f0f0; + } */ +} \ No newline at end of file