mirror of
https://codeberg.org/Kankys/musicCalendar.git
synced 2026-01-09 18:42:53 +00:00
Compare commits
11 Commits
1e6a38f6b0
...
main
| Author | SHA1 | Date | |
|---|---|---|---|
| 2b25819027 | |||
| c895b0b85d | |||
| c9ed64b047 | |||
| c55a909f0f | |||
| 501d794001 | |||
| 78f928b4b8 | |||
| 5d2cf2788c | |||
| f8762aa023 | |||
| 73735b1baa | |||
| 36bc232106 | |||
| ea40bbb8a0 |
8
.htaccess
Normal file
8
.htaccess
Normal file
@@ -0,0 +1,8 @@
|
|||||||
|
<IfModule mod_rewrite.c>
|
||||||
|
RewriteEngine On
|
||||||
|
RewriteBase /
|
||||||
|
|
||||||
|
# Přesměrování na HTTPS
|
||||||
|
RewriteCond %{HTTPS} off
|
||||||
|
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
|
||||||
|
</IfModule>
|
||||||
@@ -1,8 +1,8 @@
|
|||||||
# 💿 Každý den jedno album. 🎸 Zažíj numetal a grunge každý den.
|
# 💿 Každý den jedno album. 🎸 Zažíj numetal a grunge každý den.
|
||||||
## 💪 Zvládneš tuto výzvu v roce 2026?
|
## 💪 Zvládneš tuto výzvu v roce 2026?
|
||||||
## 🤟 Ukaž že na to máš .
|
## 🤟 Ukaž že na to máš .
|
||||||
Odkaz na [výzvu](https://lukaskanka.cz/musicCalendar/index.html)
|
Odkaz na [výzvu](https://music.lukan.cz)
|
||||||
|
|
||||||
|
|
||||||
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.
|
Do konce roku jedeme v testovacím režimu, od 1.1.2026 začínáme na ostro.
|
||||||
217
about.html
Normal file
217
about.html
Normal file
@@ -0,0 +1,217 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="cs">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<title>O projektu a další žvásty</title>
|
||||||
|
<meta property="og:type" content="website" />
|
||||||
|
<meta property="og:url" content="https://music.lukan.cz/" />
|
||||||
|
<meta property="og:title" content="Hudební Výzva 2026: Grunge & Nu-Metal" />
|
||||||
|
<meta
|
||||||
|
property="og:description"
|
||||||
|
content="Každý den jedno zásadní album. Zvládneš to se mnou? 365 dní, 365 desek."
|
||||||
|
/>
|
||||||
|
<meta
|
||||||
|
property="og:image"
|
||||||
|
content="https://music.lukan.cz/img/vyzva-EDIT.jpg"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<meta name="twitter:card" content="summary_large_image" />
|
||||||
|
<meta
|
||||||
|
name="twitter:title"
|
||||||
|
content="Hudební Výzva 2026: Grunge & Nu-Metal"
|
||||||
|
/>
|
||||||
|
<meta
|
||||||
|
name="twitter:description"
|
||||||
|
content="Každý den jedno zásadní album. Přidej se!"
|
||||||
|
/>
|
||||||
|
<meta
|
||||||
|
name="twitter:image"
|
||||||
|
content="https://music.lukan.cz/img/vyzva-EDIT.jpg"
|
||||||
|
/>
|
||||||
|
<meta
|
||||||
|
name="Hudební kalendář"
|
||||||
|
content="Každý den jedno album. Zažíj numetal a grunge každý den."
|
||||||
|
/>
|
||||||
|
<link rel="stylesheet" href="styleabout.css" />
|
||||||
|
<link rel="shortcut icon" href="img/electric-guitar_12494348.png" />
|
||||||
|
<link rel="stylesheet" href="style.css" />
|
||||||
|
<style>
|
||||||
|
/* Specifické styly pro textovou stránku */
|
||||||
|
.about-container {
|
||||||
|
max-width: 800px;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: left;
|
||||||
|
background: white;
|
||||||
|
padding: 40px;
|
||||||
|
border-radius: 10px;
|
||||||
|
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
.about-container h1 {
|
||||||
|
text-align: center;
|
||||||
|
text-transform: uppercase;
|
||||||
|
color: #d32f2f; /* Trochu agresivní červená */
|
||||||
|
font-size: 2.5em;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.subtitle {
|
||||||
|
text-align: center;
|
||||||
|
color: #666;
|
||||||
|
font-style: italic;
|
||||||
|
margin-bottom: 40px;
|
||||||
|
font-size: 1.2em;
|
||||||
|
}
|
||||||
|
.about-section {
|
||||||
|
margin-bottom: 30px;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
padding-bottom: 20px;
|
||||||
|
}
|
||||||
|
.about-section:last-child {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
h3 {
|
||||||
|
color: #222;
|
||||||
|
font-weight: 900; /* Extra tučné */
|
||||||
|
}
|
||||||
|
.back-btn {
|
||||||
|
display: block;
|
||||||
|
width: fit-content;
|
||||||
|
margin: 40px auto 0;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
footer {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="about-container">
|
||||||
|
<h1>🎸 Zažij numetal a grunge každý den, po celý rok. 💿</h1>
|
||||||
|
<p class="subtitle">
|
||||||
|
<strong
|
||||||
|
>💿 Každý den jedno album. 💪 Zvládneš tuto výzvu v roce 2026? 🤟 Ukaž
|
||||||
|
že na to máš.</strong
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div class="about-section">
|
||||||
|
<h3>O projektu</h3>
|
||||||
|
<p>
|
||||||
|
Všimli jste si, jak nás algoritmy Spotify a dalších hudebních stream
|
||||||
|
služeb neustále točí v kruhu? Nabízejí nám pořád to samé, co už známe.
|
||||||
|
Řekl jsem si to není pro mne. Chtěl jsem se vrátit k poslechu – od
|
||||||
|
první do poslední skladby. A tak vznikl můj projekt: Hudební výzva
|
||||||
|
2026.
|
||||||
|
</p>
|
||||||
|
<br />
|
||||||
|
<p>
|
||||||
|
Každý den jedno album. To nejšpinavější a nejupřímnější, co hudba za
|
||||||
|
posledních 30 let nabídla: Grunge a Nu-Metal.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Mnoho lidí tyto dva žánry odděluje. Grunge je pro ně "ta stará hudba v
|
||||||
|
kostkovaných košilích" a Nu-Metal jsou "ti týpci v kšiltovkách a
|
||||||
|
širokých kalhotách". Ale když se zaposloucháte pozorně, zjistíte, že
|
||||||
|
jsou to pokrevní bratři.
|
||||||
|
</p>
|
||||||
|
<br />
|
||||||
|
<p>
|
||||||
|
Když Seattle zhasnul světla Grunge (Nirvana, Soundgarden, Pearl Jam)
|
||||||
|
na začátku 90. let smetl nablýskaný rock. Byla to hudba deště, deprese
|
||||||
|
a reality. Žádná póza, jen syrová emoce a kytary, které zněly jako by
|
||||||
|
je někdo tahal bahnem.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Jenže v polovině 90. let grunge s smrtí Kurta Cobaina a rozpadem scény
|
||||||
|
utichl. Vzniklo ticho. A v tom tichu se začalo rodit něco nového,
|
||||||
|
agresivnějšího.
|
||||||
|
</p>
|
||||||
|
<br />
|
||||||
|
<p>
|
||||||
|
Nástup Nu-Metalu: Vzteklý mladší brácha Zatímco grunge byl o smutku a
|
||||||
|
apatii, Nu-Metal (Korn, Linkin Park, Limp Bizkit, Slipknot) byl o
|
||||||
|
čistém vzteku. Vzali ty podladěné, těžké kytary z grunge, ale místo
|
||||||
|
pomalého tempa přidali rytmiku hip-hopu a elektroniku.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Kytarista Alice in Chains Jerry Cantrell nebo soundgardenovský Kim
|
||||||
|
Thayil položili základy pro zvuk, který později kapely jako Korn
|
||||||
|
dotáhly do extrému sedmistrunnými kytarami.
|
||||||
|
</p>
|
||||||
|
<br />
|
||||||
|
<p>
|
||||||
|
Ta energie je nenahraditelná. V dnešní době vyžehleného popu chybí ta
|
||||||
|
lidská nedokonalost a dravost.
|
||||||
|
</p>
|
||||||
|
<br />
|
||||||
|
<p>
|
||||||
|
Vytvořil jsem jednoduchou webovou aplikaci, která mi (a teď i vám)
|
||||||
|
každý den servíruje jedno zásadní album z této éry. Někdy je to
|
||||||
|
depresivní grungeová balada, jindy agresivní nu-metalová smršť.
|
||||||
|
</p>
|
||||||
|
<br />
|
||||||
|
<p>
|
||||||
|
Zvu vás, abyste do toho šli se mnou. Nemusíte hledat, co si pustit.
|
||||||
|
Stačí otevřít aplikaci a nechat se vést.
|
||||||
|
</p>
|
||||||
|
<br />
|
||||||
|
<p>
|
||||||
|
(PS: Aplikaci jsem si naprogramoval sám, tak buďte shovívaví, jde
|
||||||
|
hlavně o tu hudbu! 🤘 Budu velmi rád za sdílení 🙏)
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="back-btn">
|
||||||
|
<a href="index.html" class="btn-main" style="text-decoration: none"
|
||||||
|
>🎸 Zpět na hudbu</a
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div class="footer-section>">
|
||||||
|
<footer>
|
||||||
|
<p style="padding-top: 30px;">Líbí se ti výběr? Sleduj mě:</p>
|
||||||
|
<div class="socials">
|
||||||
|
<a
|
||||||
|
href="https://bsky.app/profile/kankys.bsky.social"
|
||||||
|
target="_blank" class="links"
|
||||||
|
>Bluesky</a
|
||||||
|
>
|
||||||
|
<br />
|
||||||
|
<a href="https://codeberg.org/Kankys" target="_blank" class="links">Codeberg</a>
|
||||||
|
<br />
|
||||||
|
<a
|
||||||
|
href="https://lukaskanka.cz/index/about/index.html"
|
||||||
|
target="_blank" class="links"
|
||||||
|
>Pokud chčeš podpořit tento projekt veškeré informace najdeš
|
||||||
|
zde.</a
|
||||||
|
>
|
||||||
|
<p class="hastag">
|
||||||
|
#GrungeMetalRok #HudebniVyzva #NuMetal #AlbumDne #TipNaHudbu
|
||||||
|
#DnesPosloucham #Tidal #Spotify #KazdyDenJednoAlbum
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<p class="copyright">© 2025 Tvůj Hudební Kurátor Kankys</p>
|
||||||
|
<p style="font-size: 0.8em; margin-top: 10px">
|
||||||
|
<a href="gdpr.html" class="links"
|
||||||
|
>Ochrana soukromí a jiné žvásty (GDPR)</a
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
<section class="photo">
|
||||||
|
<img
|
||||||
|
id="vyzva"
|
||||||
|
class="zoom"
|
||||||
|
src="./img/vyzva-EDIT.jpg"
|
||||||
|
alt="Výzva"
|
||||||
|
/>
|
||||||
|
</section>
|
||||||
|
<a href="https://www.facebook.com/groups/1802260010492466" target="_blank" style="color: rgb(88, 88, 227);"><h3>FACEBOOK</h3></a>
|
||||||
|
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="scriptabout.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
96
gdpr.html
Normal file
96
gdpr.html
Normal file
@@ -0,0 +1,96 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="cs">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>GDPR | Nikoho nezajímáš</title>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
<style>
|
||||||
|
/* Specifické styly pro textovou stránku */
|
||||||
|
.gdpr-container {
|
||||||
|
max-width: 800px;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: left;
|
||||||
|
background: white;
|
||||||
|
padding: 40px;
|
||||||
|
border-radius: 10px;
|
||||||
|
box-shadow: 0 4px 15px rgba(0,0,0,0.1);
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
.gdpr-container h1 {
|
||||||
|
text-align: center;
|
||||||
|
text-transform: uppercase;
|
||||||
|
color: #d32f2f; /* Trochu agresivní červená */
|
||||||
|
font-size: 2.5em;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.subtitle {
|
||||||
|
text-align: center;
|
||||||
|
color: #666;
|
||||||
|
font-style: italic;
|
||||||
|
margin-bottom: 40px;
|
||||||
|
font-size: 1.2em;
|
||||||
|
}
|
||||||
|
.gdpr-section {
|
||||||
|
margin-bottom: 30px;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
padding-bottom: 20px;
|
||||||
|
}
|
||||||
|
.gdpr-section:last-child {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
h3 {
|
||||||
|
color: #222;
|
||||||
|
font-weight: 900; /* Extra tučné */
|
||||||
|
}
|
||||||
|
.back-btn {
|
||||||
|
display: block;
|
||||||
|
width: fit-content;
|
||||||
|
margin: 40px auto 0;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="gdpr-container">
|
||||||
|
<h1>GDPR & Soukromí</h1>
|
||||||
|
<p class="subtitle">Aneb: "We don't care about your data, we care about the music."</p>
|
||||||
|
|
||||||
|
<div class="gdpr-section">
|
||||||
|
<h3>1. Kdo jsem?</h3>
|
||||||
|
<p>Jsem Lukáš. Mám rád hudbu, kódování a klid. Nejsem korporát, nemám právní oddělení a nemám zájem tě špehovat. Mark Zuckerberg o tobě ví všechno, já nevím nic. A tak to zůstane.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="gdpr-section">
|
||||||
|
<h3>2. Sbírám Cookies?</h3>
|
||||||
|
<p><strong>Ne.</strong> Jediné cookies, které mě zajímají, jsou ty čokoládové, co jsem snědl, když jsem tuhle stránku programoval ve tři ráno. Limp Bizkit sice zpívali "Do it all for the Nookie", ale nedělám to pro Cookie.</p>
|
||||||
|
<p>Tato stránka nepoužívá Google Analytics, Facebook Pixel, ani žádné jiné šmírovací nástroje. </p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="gdpr-section">
|
||||||
|
<h3>3. Co o tobě vím?</h3>
|
||||||
|
<p>Vlastně nic. Tato aplikace běží ve tvém prohlížeči. </p>
|
||||||
|
<p><em>Technická vsuvka pro rýpaly:</em> Web běží na běžném hostingu (Lukan.cz). Hostingové servery si ze zákona a z bezpečnostních důvodů mohou ukládat do logů tvoji IP adresu, aby věděly, kam tu stránku poslat. Já ty logy nečtu. Je v nich nuda.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="gdpr-section">
|
||||||
|
<h3>4. Spotify, Tidal a ti druzí</h3>
|
||||||
|
<p>Na webu jsou tlačítka, která vedou na Spotify, Tidal. Jakmile na ně klikneš a odejdeš z mého webu, jsi v jejich teritoriu. </p>
|
||||||
|
<p>Oni už data sbírají. Vědí, že tajně posloucháš Britney Spears, i když tvrdíš, že jsi drsňák. To už je mezi tebou a jimi. Já za to nemůžu.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="gdpr-section">
|
||||||
|
<h3>5. Kontakt</h3>
|
||||||
|
<p>Pokud máš pocit, že jsem narušil tvou auru nebo máš dotaz:</p>
|
||||||
|
<p>📧 Napiš mi. <a href="https://lukaskanka.cz/index/about/index.html" target="_blank" class="links">Kontakt</a> najdeš na mém hlavním <a href="https://lukaskanka.cz/index/about/index.html" target="_blank" class="links">webu</a>. Nebo na <a href="https://bsky.app/profile/kankys.bsky.social" target="_blank" class="links">Bluesky</a>. Nebo si prostě pusť Nirvanu a neřeš to.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="back-btn">
|
||||||
|
<a href="index.html" class="btn-main" style="text-decoration: none;">🎸 Zpět na hudbu</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
BIN
img/4525586.jpg
Normal file
BIN
img/4525586.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 313 KiB |
BIN
img/nu-metal-wallpapers.png
Normal file
BIN
img/nu-metal-wallpapers.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.2 MiB |
BIN
img/so0naj17qrh91.jpg
Normal file
BIN
img/so0naj17qrh91.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 102 KiB |
92
index.html
92
index.html
@@ -1,38 +1,70 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="cs">
|
<html lang="cs">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8" />
|
||||||
<title>Hudební Kalendář</title>
|
<title>Zažij numetal a grunge každý den, po celý rok. 💿</title>
|
||||||
<meta name="Hudební kalendář" content="Každý den jedno album. Zažíj numetal a grunge každý den." />
|
<meta property="og:type" content="website" />
|
||||||
<link rel="stylesheet" href="style.css">
|
<meta property="og:url" content="https://music.lukan.cz/" />
|
||||||
<link rel="shortcut icon" href="img/electric-guitar_12494348.png" />
|
<meta property="og:title" content="Hudební Výzva 2026: Grunge & Nu-Metal" />
|
||||||
</head>
|
<meta
|
||||||
<body>
|
property="og:description"
|
||||||
|
content="Každý den jedno zásadní album. Zvládneš to se mnou? 365 dní, 365 desek."
|
||||||
<!-- <h1>Album pro dnešní den</h1> -->
|
/>
|
||||||
|
<meta
|
||||||
<!-- <h1>💿 Každý den jedno album.</h1> -->
|
property="og:image"
|
||||||
<h1>🎸 Zažij numetal a grunge každý den. 💿</h1>
|
content="https://music.lukan.cz/img/vyzva-EDIT.jpg"
|
||||||
|
/>
|
||||||
|
<meta name="twitter:card" content="summary_large_image" />
|
||||||
|
<meta
|
||||||
|
name="twitter:title"
|
||||||
|
content="Hudební Výzva 2026: Grunge & Nu-Metal"
|
||||||
|
/>
|
||||||
|
<meta
|
||||||
|
name="twitter:description"
|
||||||
|
content="Každý den jedno zásadní album. Přidej se!"
|
||||||
|
/>
|
||||||
|
<meta
|
||||||
|
name="twitter:image"
|
||||||
|
content="https://music.lukan.cz/img/vyzva-EDIT.jpg"
|
||||||
|
/>
|
||||||
|
<meta
|
||||||
|
name="Hudební kalendář"
|
||||||
|
content="Každý den jedno album. Zažíj numetal a grunge každý den."
|
||||||
|
/>
|
||||||
|
<link rel="stylesheet" href="style.css" />
|
||||||
|
<link rel="shortcut icon" href="img/electric-guitar_12494348.png" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1>🎸 Zažij numetal a grunge každý den, po celý rok. 💿</h1>
|
||||||
|
<p>
|
||||||
|
<strong
|
||||||
|
>💿 Každý den jedno album. 💪 Zvládneš tuto výzvu v roce 2026? 🤟 Ukaž
|
||||||
|
že na to máš.</strong
|
||||||
|
>
|
||||||
|
</p>
|
||||||
<div id="zobrazeni-alba"></div>
|
<div id="zobrazeni-alba"></div>
|
||||||
<div style="margin-top: 30px; margin-bottom: 20px;">
|
<div style="margin-top: 30px; margin-bottom: 20px">
|
||||||
<button id="btn-archiv" class="btn-main">📂 Zobrazit předchozí alba</button>
|
<button id="btn-archiv" class="btn-main">
|
||||||
|
📂 Zobrazit předchozí alba
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="archiv-container" class="archiv-grid"></div>
|
<div id="archiv-container" class="archiv-grid"></div>
|
||||||
<footer>
|
<div style="margin-top: 30px; margin-bottom: 20px">
|
||||||
<p>Líbí se ti výběr? Sleduj mě:</p>
|
<button id="btn-footer" class="btn-footer"><br/>
|
||||||
<div class="socials">
|
<a href="gdpr.html" class="link-footer"
|
||||||
<a href="https://bsky.app/profile/kankys.bsky.social" target="_blank">Bluesky</a>
|
>Ochrana soukromí a jiné žvásty (GDPR)
|
||||||
<a href="https://mastodon.arch-linux.cz/deck/@Kankys" target="_blank">Mastodon</a>
|
<p class="copyright">© 2025 Tvůj Hudební Kurátor Kankys</p></a
|
||||||
<br>
|
>
|
||||||
<a href="https://codeberg.org/Kankys" target="_blank">Codeberg</a>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<p class="copyright">© 2025 Tvůj Hudební Kurátor Kankys</p>
|
|
||||||
</footer>
|
<section class="photo">
|
||||||
<section class="photo"><img id="vyzva" class="zoom" src="./img/vyzva-EDIT.png" alt="Výzva" ></section>
|
<img id="vyzva" class="zoom" src="./img/vyzva-EDIT.jpg" alt="Výzva" />
|
||||||
|
</section>
|
||||||
|
<br>
|
||||||
|
<a href="https://www.facebook.com/groups/1802260010492466" target="_blank" style="color: rgb(88, 88, 227);"><h3>FACEBOOK</h3></a>
|
||||||
|
|
||||||
<script src="musicData.js"></script>
|
<script src="musicData.js"></script>
|
||||||
<script src="script.js"></script>
|
<script src="script.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
1149
musicData.js
1149
musicData.js
File diff suppressed because it is too large
Load Diff
42
script.js
42
script.js
@@ -1,14 +1,26 @@
|
|||||||
|
|
||||||
|
|
||||||
// --- 2. ZJIŠTĚNÍ DNEŠNÍHO DATA ---
|
// --- 2. ZJIŠTĚNÍ DNEŠNÍHO DATA ---
|
||||||
// Získáme dnešní datum ve formátu RRRR-MM-DD
|
// objekt s aktuálním časem
|
||||||
// Proměnná 'kalendarAlb' se načte z předchozího souboru.
|
const datum = new Date();
|
||||||
const dnes = new Date().toISOString().split('T')[0];
|
|
||||||
|
// rok, měsíc a den podle LOKÁLNÍHO času počítače
|
||||||
|
const rok = datum.getFullYear();
|
||||||
|
// Leden je v JS 0, proto přičíst 1.
|
||||||
|
// .padStart(2, '0') zajistí, že před jednociferné číslo se dá nula (např. "05")
|
||||||
|
const mesic = String(datum.getMonth() + 1).padStart(2, '0');
|
||||||
|
const den = String(datum.getDate()).padStart(2, '0');
|
||||||
|
|
||||||
|
// formát "RRRR-MM-DD"
|
||||||
|
const dnes = `${rok}-${mesic}-${den}`;
|
||||||
|
|
||||||
|
// výpis do konzole
|
||||||
|
// console.log("Opravené datum (lokální):", dnes);
|
||||||
|
|
||||||
// Pro testování si můžeš odkomentovat řádek níže a změnit datum ručně:
|
// Pro testování:
|
||||||
// const dnes = "2025-12-24";
|
// const dnes = "2025-12-24";
|
||||||
|
|
||||||
console.log("Dnes je:", dnes); // Vypíše do konzole prohlížeče (F12)
|
console.log("Dnes je:", dnes);
|
||||||
|
|
||||||
// --- 3. HLEDÁNÍ V SEZNAMU ---
|
// --- 3. HLEDÁNÍ V SEZNAMU ---
|
||||||
// Funkce .find() projde pole 'kalendarAlb' a hledá shodu data
|
// Funkce .find() projde pole 'kalendarAlb' a hledá shodu data
|
||||||
@@ -18,7 +30,7 @@
|
|||||||
const vystup = document.getElementById('zobrazeni-alba');
|
const vystup = document.getElementById('zobrazeni-alba');
|
||||||
|
|
||||||
if (dnesniAlbum) {
|
if (dnesniAlbum) {
|
||||||
// Pokud jsme našli album pro dnešek:
|
// Dnešní album
|
||||||
vystup.innerHTML = `
|
vystup.innerHTML = `
|
||||||
<div class="album-card">
|
<div class="album-card">
|
||||||
<div class="datum">🗓️ ${dnesniAlbum.datum}</div>
|
<div class="datum">🗓️ ${dnesniAlbum.datum}</div>
|
||||||
@@ -27,11 +39,11 @@
|
|||||||
<p><strong>Vyšlo</strong> ${dnesniAlbum.vydano}</p>
|
<p><strong>Vyšlo</strong> ${dnesniAlbum.vydano}</p>
|
||||||
<p>${dnesniAlbum.recenze}</p>
|
<p>${dnesniAlbum.recenze}</p>
|
||||||
<a href="${dnesniAlbum.tidal}" target="_blank" class="btn tidal">Tidal</a> - <a href="${dnesniAlbum.spotify}" target="_blank" class="btn spotify">Spotify</a>
|
<a href="${dnesniAlbum.tidal}" target="_blank" class="btn tidal">Tidal</a> - <a href="${dnesniAlbum.spotify}" target="_blank" class="btn spotify">Spotify</a>
|
||||||
|
<p><a href="./about.html" class="btn about">👉🏻 O projektu 👈🏻</a></p>
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
} else {
|
} else {
|
||||||
// Pokud pro dnešek nic naplánováno není:
|
// Alert bez alba
|
||||||
vystup.innerHTML = `
|
vystup.innerHTML = `
|
||||||
<div class="album-card">
|
<div class="album-card">
|
||||||
<h3>Dnes není v plánu žádné album 🎵</h3>
|
<h3>Dnes není v plánu žádné album 🎵</h3>
|
||||||
@@ -40,18 +52,9 @@
|
|||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Photo Gallery -> section (zoom)
|
|
||||||
const img = document.querySelector(".zoom");
|
|
||||||
|
|
||||||
img.addEventListener("mouseenter", () => {
|
// --- 6. LOGIKA PRO ARCHIV (Předchozí alba) ---
|
||||||
img.style.transform = "scale(4.2)";
|
|
||||||
});
|
|
||||||
|
|
||||||
img.addEventListener("mouseleave", () => {
|
|
||||||
img.style.transform = "scale(1)";
|
|
||||||
});
|
|
||||||
|
|
||||||
// --- 5. LOGIKA PRO ARCHIV (Předchozí alba) ---
|
|
||||||
|
|
||||||
const btnArchiv = document.getElementById('btn-archiv');
|
const btnArchiv = document.getElementById('btn-archiv');
|
||||||
const divArchiv = document.getElementById('archiv-container');
|
const divArchiv = document.getElementById('archiv-container');
|
||||||
@@ -85,7 +88,6 @@ btnArchiv.addEventListener('click', () => {
|
|||||||
htmlObsah += `
|
htmlObsah += `
|
||||||
<div class="archiv-item">
|
<div class="archiv-item">
|
||||||
<div class="datum">${album.datum}</div>
|
<div class="datum">${album.datum}</div>
|
||||||
<a href="${album.tidal}" target="_blank">
|
|
||||||
<img src="${album.img}" alt="${album.nazev}">
|
<img src="${album.img}" alt="${album.nazev}">
|
||||||
</a>
|
</a>
|
||||||
<h3>${album.umelec}</h3>
|
<h3>${album.umelec}</h3>
|
||||||
|
|||||||
10
scriptabout.js
Normal file
10
scriptabout.js
Normal file
@@ -0,0 +1,10 @@
|
|||||||
|
// --- 5. Photo Gallery -> section (zoom)
|
||||||
|
const img = document.querySelector(".zoom");
|
||||||
|
|
||||||
|
img.addEventListener("mouseenter", () => {
|
||||||
|
img.style.transform = "scale(10.2)";
|
||||||
|
});
|
||||||
|
|
||||||
|
img.addEventListener("mouseleave", () => {
|
||||||
|
img.style.transform = "scale(1)";
|
||||||
|
});
|
||||||
201
style.css
201
style.css
@@ -1,57 +1,86 @@
|
|||||||
body { font-family: sans-serif; text-align: center; padding: 50px; background-color: #333; }
|
body {
|
||||||
.album-card {
|
font-family: sans-serif;
|
||||||
background: grey;
|
text-align: center;
|
||||||
padding: 20px;
|
padding: 50px;
|
||||||
border-radius: 10px;
|
background-image: url(./img/4525586.jpg);
|
||||||
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
|
/* Tímto zajistíte, že se tapeta při scrollování nehýbe */
|
||||||
display: inline-block;
|
background-attachment: fixed;
|
||||||
max-width: 400px;
|
|
||||||
}
|
/* Tímto zakážete opakování obrázku "dokola" */
|
||||||
img { width: 100%; border-radius: 5px; margin-bottom: 15px; }
|
background-repeat: no-repeat;
|
||||||
h1 { color: black }
|
|
||||||
h2 { color: black}
|
/* DOPORUČENÉ: Roztáhne obrázek přes celou obrazovku */
|
||||||
.datum { color: red; font-size: 0.9em; margin-bottom: 10px; font-weight: bold;}
|
background-size: cover;
|
||||||
#vyzva {width: 7%; height: auto}
|
|
||||||
/* Styl pro tlačítka streamovacích služeb */
|
/* Vycentruje obrázek, aby byl vždy uprostřed */
|
||||||
|
background-position: center;
|
||||||
|
}
|
||||||
|
.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;
|
||||||
|
}
|
||||||
|
h2 {
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
.smile {
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
.datum {
|
||||||
|
color: red;
|
||||||
|
font-size: 0.9em;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.hastag {
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
#vyzva {
|
||||||
|
width: 7%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Styl pro tlačítka streamovacích služeb */
|
||||||
.btn {
|
.btn {
|
||||||
display: inline-block; /* Aby měly rozměry */
|
display: inline-block; /* Aby měly rozměry */
|
||||||
text-decoration: none; /* Zruší podtržení */
|
text-decoration: none; /* Zruší podtržení */
|
||||||
padding: 10px 20px; /* Vnitřní odsazení (prostor kolem textu) */
|
padding: 10px 20px; /* Vnitřní odsazení (prostor kolem textu) */
|
||||||
border-radius: 25px; /* Kulaté rohy */
|
border-radius: 25px; /* Kulaté rohy */
|
||||||
color: white; /* Bílé písmo */
|
color: white; /* Bílé písmo */
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
margin: 5px; /* Mezera mezi tlačítky */
|
margin: 5px; /* Mezera mezi tlačítky */
|
||||||
transition: transform 0.2s; /* Animace při najetí */
|
transition: transform 0.2s; /* Animace při najetí */
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Barvy pro konkrétní služby */
|
/* Barvy pro konkrétní služby */
|
||||||
.tidal { background-color: #000000; } /* Černá pro Tidal */
|
.tidal {
|
||||||
.spotify { background-color: #1DB954; } /* Zelená pro Spotify */
|
background-color: #000000;
|
||||||
|
} /* Černá pro Tidal */
|
||||||
|
.spotify {
|
||||||
|
background-color: #1db954;
|
||||||
|
} /* Zelená pro Spotify */
|
||||||
|
.about {
|
||||||
|
background-color: #333;
|
||||||
|
} /* Hmědá o projektu */
|
||||||
|
|
||||||
.btn:hover {
|
.btn:hover {
|
||||||
transform: scale(1.05); /* Při najetí myší se tlačítko trochu zvětší */
|
transform: scale(1.05); /* Při najetí myší se tlačítko trochu zvětší */
|
||||||
opacity: 0.9;
|
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) {
|
@media (max-width: 768px) {
|
||||||
body {
|
body {
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
}
|
}
|
||||||
/* .album-card {
|
/* .album-card {
|
||||||
@@ -65,53 +94,75 @@ footer a:hover {
|
|||||||
/*Archív alb */
|
/*Archív alb */
|
||||||
/* Styl pro hlavní tlačítko archivu */
|
/* Styl pro hlavní tlačítko archivu */
|
||||||
.btn-main {
|
.btn-main {
|
||||||
background-color: #333;
|
background-color: #333;
|
||||||
color: white;
|
color: white;
|
||||||
padding: 15px 30px;
|
padding: 15px 30px;
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: 50px;
|
border-radius: 50px;
|
||||||
font-size: 1.1em;
|
font-size: 1.1em;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: background 0.3s;
|
transition: background 0.3s;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-main:hover {
|
.btn-main:hover {
|
||||||
background-color: #555;
|
background-color: #555;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Mřížka pro archiv (aby byly kartičky vedle sebe) */
|
/* Mřížka pro archiv (aby byly kartičky vedle sebe) */
|
||||||
.archiv-grid {
|
.archiv-grid {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
gap: 20px;
|
gap: 20px;
|
||||||
max-width: 1000px;
|
max-width: 1000px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Menší kartička pro archiv */
|
/* Menší kartička pro archiv */
|
||||||
.archiv-item {
|
.archiv-item {
|
||||||
background: white;
|
background: white;
|
||||||
padding: 15px;
|
padding: 15px;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
|
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
|
||||||
width: 250px; /* Pevná šířka */
|
width: 250px; /* Pevná šířka */
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.archiv-item img {
|
.archiv-item img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.archiv-item h3 {
|
.archiv-item h3 {
|
||||||
font-size: 1em;
|
font-size: 1em;
|
||||||
margin: 5px 0;
|
margin: 5px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.archiv-item .datum {
|
.archiv-item .datum {
|
||||||
font-size: 0.8em;
|
font-size: 0.8em;
|
||||||
color: #888;
|
color: #888;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.btn-footer {
|
||||||
|
/* background-color: #333;
|
||||||
|
color: white;
|
||||||
|
padding: 15px 30px; */
|
||||||
|
border: none;
|
||||||
|
border-radius: 20px;
|
||||||
|
/* font-size: 1.1em; */
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background 0.3s;
|
||||||
|
font-weight: bold;
|
||||||
|
background-color: violet;
|
||||||
|
}
|
||||||
|
.link-footer {
|
||||||
|
text-decoration: none; /* Zruší podtržení */
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* odkazy */
|
||||||
|
.links {
|
||||||
|
color: blueviolet; text-decoration: none;
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user