Javi/saborflow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add Playlists

Browse Source
This commit is contained in:
Javier Blanco
2026-05-02 21:43:58 +07:00
parent 9b13ac93de
commit 85ee79cf3d
10 changed files with 349 additions and 376 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/spotify.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 34 KiB

BIN
assets/youtubemusic.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 80 KiB

4
classes/index.html
View File

@@ -13,7 +13,7 @@
<link
href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..60,700;12..60,800&family=Caveat+Brush&family=JetBrains+Mono:wght@400;500&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="../css/style.css?v=b859151d">
<link rel="stylesheet" href="../css/style.css?v=6aeda9d1">
</head>
<body>
@@ -378,7 +378,7 @@
</div>
</footer>
<script src="../js/main.js?v=b859151d"></script>
<script src="../js/main.js?v=6aeda9d1"></script>
</body>
</html>

4
connect/index.html
View File

@@ -13,7 +13,7 @@
<link
href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..60,700;12..60,800&family=Caveat+Brush&family=JetBrains+Mono:wght@400;500&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="../css/style.css?v=b859151d">
<link rel="stylesheet" href="../css/style.css?v=6aeda9d1">
</head>
<body>
@@ -196,7 +196,7 @@
</div>
</footer>
<script src="../js/main.js?v=b859151d"></script>
<script src="../js/main.js?v=6aeda9d1"></script>
</body>
</html>

100
css/style.css
View File

@@ -1528,27 +1528,6 @@ body > *:not(.sfB-bg) { position: relative; z-index: 1; }
.sfB-pl-platform-group {
margin-bottom: 14px;
}
.sfB-pl-platform-label {
display: flex;
align-items: center;
gap: 8px;
font-family: 'JetBrains Mono', monospace;
font-size: 9px;
letter-spacing: 2px;
text-transform: uppercase;
font-weight: 500;
margin-bottom: 10px;
}
.sfB-pl-platform-label .pdot {
width: 7px;
height: 7px;
border-radius: 50%;
flex-shrink: 0;
}
.sfB-pl-platform-label .pdot.spotify { background: #1DB954; box-shadow: 0 0 6px #1DB954; }
.sfB-pl-platform-label .pdot.ytmusic { background: #FF4444; box-shadow: 0 0 6px #FF4444; }
.sfB-pl-platform-label.spotify { color: rgba(29,185,84,0.85); }
.sfB-pl-platform-label.ytmusic { color: rgba(255,80,80,0.85); }
.sfB-pl-grid5 {
display: grid;
grid-template-columns: repeat(5, 1fr);
@@ -1557,48 +1536,71 @@ body > *:not(.sfB-bg) { position: relative; z-index: 1; }
}
.sfB-pl-card {
padding: 16px;
border-radius: 14px;
border-radius: 16px;
background: rgba(255,246,232,0.04);
border: 1px solid rgba(255,246,232,0.08);
display: flex;
flex-direction: column;
gap: 12px;
gap: 0;
transition: all .2s;
text-decoration: none;
min-height: 140px;
}
.sfB-pl-card:hover { background: rgba(255,246,232,0.07); transform: translateY(-2px); }
.sfB-pl-card.spotify:hover { border-color: rgba(29,185,84,0.45); }
.sfB-pl-card.ytmusic:hover { border-color: rgba(255,68,68,0.4); }
.sfB-pl-card:hover { background: rgba(255,246,232,0.07); transform: translateY(-3px); box-shadow: 0 10px 30px rgba(0,0,0,0.3); }
.sfB-pl-card.spotify:hover { border-color: rgba(29,185,84,0.5); }
.sfB-pl-card.ytmusic:hover { border-color: rgba(255,68,68,0.45); }
.sfB-pl-header {
display: flex;
align-items: center;
gap: 10px;
}
.sfB-pl-logo {
width: 34px;
height: 34px;
border-radius: 50%;
overflow: hidden;
flex-shrink: 0;
border: 1px solid rgba(255,255,255,0.1);
}
.sfB-pl-logo img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.sfB-pl-name {
font-family: 'Bricolage Grotesque', sans-serif;
font-weight: 700;
font-size: 13px;
letter-spacing: -0.2px;
line-height: 1.2;
color: var(--sf-paper);
}
.sfB-pl-spacer { flex: 1; }
.sfB-pl-tags {
display: flex;
flex-wrap: wrap;
gap: 5px;
flex: 1;
margin-top: 14px;
padding-top: 12px;
border-top: 1px solid rgba(255,246,232,0.07);
}
.sfB-pl-tag {
font-size: 9px;
font-weight: 600;
letter-spacing: 0.3px;
padding: 3px 7px;
border-radius: 4px;
background: rgba(255,246,232,0.08);
color: rgba(255,246,232,0.6);
font-family: 'JetBrains Mono', monospace;
font-size: 8px;
font-weight: 500;
letter-spacing: 0.8px;
text-transform: uppercase;
padding: 4px 8px;
border-radius: 999px;
background: rgba(255,246,232,0.07);
color: rgba(255,246,232,0.55);
}
.sfB-pl-open {
display: inline-flex;
align-items: center;
font-size: 11px;
font-weight: 700;
letter-spacing: 0.3px;
padding: 7px 11px;
border-radius: 8px;
transition: all .15s;
align-self: flex-start;
}
.sfB-pl-card.spotify .sfB-pl-open { background: rgba(29,185,84,0.12); color: #1DB954; }
.sfB-pl-card.spotify .sfB-pl-open:hover { background: rgba(29,185,84,0.22); }
.sfB-pl-card.ytmusic .sfB-pl-open { background: rgba(255,68,68,0.12); color: #FF7070; }
.sfB-pl-card.ytmusic .sfB-pl-open:hover { background: rgba(255,68,68,0.22); }
.sfB-pl-card.spotify .sfB-pl-tag { background: rgba(29,185,84,0.1); color: rgba(29,185,84,0.8); }
.sfB-pl-card.ytmusic .sfB-pl-tag { background: rgba(255,68,68,0.1); color: rgba(255,110,110,0.85); }
@media (max-width: 960px) {
.sfB-pl-grid5 { grid-template-columns: repeat(3, 1fr); }

2
festivals/index.html
View File

@@ -247,7 +247,7 @@
</div>
</footer>
<script src="../js/main.js?v=b859151d"></script>
<script src="../js/main.js?v=6aeda9d1"></script>
</body>
</html>

4
index.html
View File

@@ -13,7 +13,7 @@
<link
href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..60,700;12..60,800&family=Caveat+Brush&family=JetBrains+Mono:wght@400;500&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="css/style.css?v=b859151d">
<link rel="stylesheet" href="css/style.css?v=6aeda9d1">
</head>
<body>
@@ -276,7 +276,7 @@
</div>
</footer>
<script src="js/main.js?v=b859151d"></script>
<script src="js/main.js?v=6aeda9d1"></script>
</body>
</html>

603
playlists/index.html
View File

@@ -89,104 +89,139 @@
<!-- BACHATA -->
<section class="sfB-pl-section">
<div class="sfB-pl-section-head">
<span class="sfB-chip bachata">Bachata</span>
<h2 class="sfB-pl-title">Bachata</h2>
</div>
<div class="sfB-pl-platform-group">
<div class="sfB-pl-platform-label spotify">
<span class="pdot spotify"></span>
Spotify
</div>
<div class="sfB-pl-grid5">
<a href="https://open.spotify.com/playlist/4Q2CbhspYFBsTaD36HAS4d" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Sensual</span>
<span class="sfB-pl-tag">Romantic</span>
<span class="sfB-pl-tag">Most Popular</span>
<a href="https://open.spotify.com/playlist/37i9dQZF1DX7MTlMMRl0MD" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">Bachata Lovers</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/playlist/5S8iBOJ0odEbDualqddqYh" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Social Dance</span>
<span class="sfB-pl-tag">Advanced</span>
<span class="sfB-pl-tag">Romantic</span>
<span class="sfB-pl-tag">Popular</span>
<span class="sfB-pl-tag">Social</span>
<span class="sfB-pl-tag">Modern</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/playlist/7pGyWX0OvBGpEkIe8K0cyw" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Current</span>
<span class="sfB-pl-tag">Party</span>
<span class="sfB-pl-tag">New Trends</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/playlist/37i9dQZF1DX65py6HnnlE1" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">Bachata Classics</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Classics</span>
<span class="sfB-pl-tag">Beginner</span>
<span class="sfB-pl-tag">Social</span>
<span class="sfB-pl-tag">Most Popular</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/playlist/4mnzoOQ7FUV4YVMaZJT4TO" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Sensual</span>
<span class="sfB-pl-tag">Couples</span>
<span class="sfB-pl-tag">Night Out</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
</div>
</div>
<div class="sfB-pl-platform-group">
<div class="sfB-pl-platform-label ytmusic">
<span class="pdot ytmusic"></span>
YouTube Music
</div>
<div class="sfB-pl-grid5">
<a href="https://music.youtube.com/search?q=bachata+sensual+playlist" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Sensual</span>
<span class="sfB-pl-tag">Romantic</span>
<span class="sfB-pl-tag">Couples</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://music.youtube.com/search?q=bachata+social+dance+playlist" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Social Dance</span>
<span class="sfB-pl-tag">Danceable</span>
<span class="sfB-pl-tag">Intermediate</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://music.youtube.com/search?q=best+bachata+love+songs+playlist" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<a href="https://open.spotify.com/playlist/37i9dQZF1EIcxvNLzr8YIy" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">Bachata Mix</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Varied</span>
<span class="sfB-pl-tag">Popular</span>
<span class="sfB-pl-tag">Party</span>
<span class="sfB-pl-tag">Social</span>
</div>
</a>
<a href="https://open.spotify.com/playlist/6ZOErPbFr6wWQ687g0TQGB" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">The Sound of Bachata Dominicana</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Dominican</span>
<span class="sfB-pl-tag">Traditional</span>
<span class="sfB-pl-tag">Intermediate</span>
<span class="sfB-pl-tag">Authentic</span>
</div>
</a>
<a href="https://open.spotify.com/playlist/3LlsDvsZrhFoFjCED6YHqJ" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">Top Hits Bachata 2026</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Modern</span>
<span class="sfB-pl-tag">Party</span>
<span class="sfB-pl-tag">Fast</span>
<span class="sfB-pl-tag">New Releases</span>
</div>
</a>
<a href="https://music.youtube.com/playlist?list=RDCLAK5uy_kLYyE7wnPy-CdtP7hzzpru0iPr-eY2ea4" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/youtubemusic.png" alt="YouTube Music"></div>
<span class="sfB-pl-name">Bachata Mix</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Popular</span>
<span class="sfB-pl-tag">Varied</span>
<span class="sfB-pl-tag">Social</span>
<span class="sfB-pl-tag">Party</span>
</div>
</a>
<a href="https://music.youtube.com/playlist?list=RDCLAK5uy_kzvzuznRCzSSlQaTVubrk7RkOcHuNGkn0" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/youtubemusic.png" alt="YouTube Music"></div>
<span class="sfB-pl-name">Bachata Romántica</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Romantic</span>
<span class="sfB-pl-tag">Slow</span>
<span class="sfB-pl-tag">Chill</span>
<span class="sfB-pl-tag">Smooth</span>
<span class="sfB-pl-tag">Couples</span>
<span class="sfB-pl-tag">Date Night</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://music.youtube.com/search?q=bachata+remix+playlist" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<a href="https://music.youtube.com/playlist?list=PL1pEq9XJAIquSaz-Y_Vky-BsQIWRmHEqQ" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/youtubemusic.png" alt="YouTube Music"></div>
<span class="sfB-pl-name">Mix bachata Romeo Santos, Aventura, Prince Royce</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Remixes</span>
<span class="sfB-pl-tag">Most Popular</span>
<span class="sfB-pl-tag">Singalong</span>
<span class="sfB-pl-tag">Social</span>
<span class="sfB-pl-tag">Mainstream</span>
</div>
</a>
<a href="https://music.youtube.com/playlist?list=PLSmJ3-FUDAdYcdd1dWck9OYltTx5IqEJg" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/youtubemusic.png" alt="YouTube Music"></div>
<span class="sfB-pl-name">BACHATA 2025 · 2026 🌍</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Modern</span>
<span class="sfB-pl-tag">New Releases</span>
<span class="sfB-pl-tag">Party</span>
<span class="sfB-pl-tag">Current</span>
<span class="sfB-pl-tag">Popular</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://music.youtube.com/search?q=bachata+beginner+practice+playlist" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Beginner</span>
<span class="sfB-pl-tag">Easy Tempo</span>
<span class="sfB-pl-tag">Practice</span>
<a href="https://music.youtube.com/playlist?list=PLPb4IcL2X0GlbYGmoAM0K-Gn3qj577fk8" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/youtubemusic.png" alt="YouTube Music"></div>
<span class="sfB-pl-name">bachata dominicana</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Dominican</span>
<span class="sfB-pl-tag">Authentic</span>
<span class="sfB-pl-tag">Traditional</span>
<span class="sfB-pl-tag">Danceable</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
</div>
</div>
@@ -195,104 +230,126 @@
<!-- SALSA -->
<section class="sfB-pl-section">
<div class="sfB-pl-section-head">
<span class="sfB-chip salsa">Salsa</span>
<h2 class="sfB-pl-title">Salsa</h2>
</div>
<div class="sfB-pl-platform-group">
<div class="sfB-pl-platform-label spotify">
<span class="pdot spotify"></span>
Spotify
</div>
<div class="sfB-pl-grid5">
<a href="https://open.spotify.com/search/salsa%20essentials/playlists" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Classics</span>
<span class="sfB-pl-tag">Beginner</span>
<span class="sfB-pl-tag">Most Popular</span>
<a href="https://open.spotify.com/playlist/37i9dQZF1EQlZ5S0kXf8kf" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">Salsa Mix</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/search/salsa%20romantica/playlists" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Romantic</span>
<span class="sfB-pl-tag">Couples</span>
<span class="sfB-pl-tag">Melodic</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/search/salsa%20dura/playlists" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Fast</span>
<span class="sfB-pl-tag">High Energy</span>
<span class="sfB-pl-tag">Advanced</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/search/modern%20salsa%20hits/playlists" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Current</span>
<span class="sfB-pl-tag">Popular</span>
<span class="sfB-pl-tag">Social</span>
<span class="sfB-pl-tag">Varied</span>
<span class="sfB-pl-tag">Party</span>
</div>
</a>
<a href="https://open.spotify.com/playlist/3UfntaJRD0JsFgZKK1lpzG" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">Salsa Top 50</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Most Popular</span>
<span class="sfB-pl-tag">Modern</span>
<span class="sfB-pl-tag">Party</span>
<span class="sfB-pl-tag">Current</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/search/salsa%20social%20dance/playlists" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Social Dance</span>
<span class="sfB-pl-tag">Danceable</span>
<span class="sfB-pl-tag">DJs</span>
<a href="https://open.spotify.com/playlist/04Yx3q5s7MLF2yXKDulyVS" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">Salsa Top 100</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Essentials</span>
<span class="sfB-pl-tag">Social</span>
<span class="sfB-pl-tag">Classics</span>
<span class="sfB-pl-tag">Reference</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/playlist/4P81PgkKWOIKsSBL358koq" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">Puerto Rican Salsa Top 100</span>
</div>
</div>
<div class="sfB-pl-platform-group">
<div class="sfB-pl-platform-label ytmusic">
<span class="pdot ytmusic"></span>
YouTube Music
</div>
<div class="sfB-pl-grid5">
<a href="https://music.youtube.com/search?q=salsa+para+bailar+playlist" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Puerto Rican</span>
<span class="sfB-pl-tag">Classics</span>
<span class="sfB-pl-tag">Social</span>
<span class="sfB-pl-tag">Collector's</span>
</div>
</a>
<a href="https://music.youtube.com/playlist?list=RDCLAK5uy_lc4yBYpywmmgjplkuzYxzUgLJ8UvDKUUk" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/youtubemusic.png" alt="YouTube Music"></div>
<span class="sfB-pl-name">Salsa Mix</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Popular</span>
<span class="sfB-pl-tag">Varied</span>
<span class="sfB-pl-tag">Party</span>
<span class="sfB-pl-tag">Social</span>
</div>
</a>
<a href="https://music.youtube.com/playlist?list=PLgO3YxRWGM_oMz-QRaXJrJxaHa1bAgPbo" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/youtubemusic.png" alt="YouTube Music"></div>
<span class="sfB-pl-name">Salsa Cubana Para Bailar</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Cuban</span>
<span class="sfB-pl-tag">Danceable</span>
<span class="sfB-pl-tag">Social</span>
<span class="sfB-pl-tag">Intermediate</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://music.youtube.com/search?q=salsa+romantica+mix" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Romantic</span>
<span class="sfB-pl-tag">Couples</span>
<span class="sfB-pl-tag">Chill</span>
<a href="https://music.youtube.com/playlist?list=PLBnkKhSWQL-ezbIu-tqib-i4WzLFumapu" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/youtubemusic.png" alt="YouTube Music"></div>
<span class="sfB-pl-name">Salsa On2 Social Dancing</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">On2</span>
<span class="sfB-pl-tag">Social</span>
<span class="sfB-pl-tag">Intermediate</span>
<span class="sfB-pl-tag">Dancers</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://music.youtube.com/search?q=salsa+clasica+playlist" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Classics</span>
<span class="sfB-pl-tag">Most Popular</span>
<span class="sfB-pl-tag">Traditional</span>
<a href="https://music.youtube.com/playlist?list=PL4-E0r_Z8JUvu786sHBIrxgCsEhxQJS6J" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/youtubemusic.png" alt="YouTube Music"></div>
<span class="sfB-pl-name">Salsa Music Miami Beach</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Party</span>
<span class="sfB-pl-tag">Tropical</span>
<span class="sfB-pl-tag">Varied</span>
<span class="sfB-pl-tag">Atmosphere</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://music.youtube.com/search?q=fast+salsa+dance+playlist" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Fast</span>
<span class="sfB-pl-tag">Workout</span>
<span class="sfB-pl-tag">Energy</span>
<a href="https://music.youtube.com/playlist?list=RDATfdc2Fsc2Ez" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/youtubemusic.png" alt="YouTube Music"></div>
<span class="sfB-pl-name">Radio - Salsa</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://music.youtube.com/search?q=beginner+salsa+practice+songs" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Beginner</span>
<span class="sfB-pl-tag">Practice</span>
<span class="sfB-pl-tag">Clear Tempo</span>
<span class="sfB-pl-tag">Discovery</span>
<span class="sfB-pl-tag">Popular</span>
<span class="sfB-pl-tag">Social</span>
<span class="sfB-pl-tag">Endless</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
</div>
</div>
@@ -301,104 +358,48 @@
<!-- KIZOMBA -->
<section class="sfB-pl-section">
<div class="sfB-pl-section-head">
<span class="sfB-chip kizomba">Kizomba</span>
<h2 class="sfB-pl-title">Kizomba</h2>
</div>
<div class="sfB-pl-platform-group">
<div class="sfB-pl-platform-label spotify">
<span class="pdot spotify"></span>
Spotify
</div>
<div class="sfB-pl-grid5">
<a href="https://open.spotify.com/search/kizomba%20essentials/playlists" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Most Popular</span>
<span class="sfB-pl-tag">Social</span>
<span class="sfB-pl-tag">Essentials</span>
<a href="https://open.spotify.com/playlist/0Pk8kSKJ5vO5yIA36kzGMu" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">Kizomba Top Hits</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/search/urban%20kiz/playlists" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Modern</span>
<span class="sfB-pl-tag">Sensual</span>
<span class="sfB-pl-tag">Current</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/search/romantic%20kizomba/playlists" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Romantic</span>
<span class="sfB-pl-tag">Slow</span>
<span class="sfB-pl-tag">Night Out</span>
<span class="sfB-pl-tag">Popular</span>
<span class="sfB-pl-tag">Social</span>
<span class="sfB-pl-tag">Smooth</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/search/tarraxo%20playlist" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Deep</span>
<span class="sfB-pl-tag">Sensual</span>
<span class="sfB-pl-tag">Underground</span>
<a href="https://open.spotify.com/playlist/2OGQUlFwbnC3AsEEWjMNN1" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">New Kizomba 2024</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Modern</span>
<span class="sfB-pl-tag">New Releases</span>
<span class="sfB-pl-tag">Social</span>
<span class="sfB-pl-tag">Party</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/search/kizomba%20social%20dance/playlists" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<a href="https://open.spotify.com/playlist/4ggFP6oGoumfOobdzvvY2V" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">Kizomba</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Danceable</span>
<span class="sfB-pl-tag">DJs</span>
<span class="sfB-pl-tag">Social Dance</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
</div>
</div>
<div class="sfB-pl-platform-group">
<div class="sfB-pl-platform-label ytmusic">
<span class="pdot ytmusic"></span>
YouTube Music
</div>
<div class="sfB-pl-grid5">
<a href="https://music.youtube.com/search?q=top+kizomba+hits+playlist" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Most Popular</span>
<span class="sfB-pl-tag">Clear Tempo</span>
<span class="sfB-pl-tag">Classes</span>
<span class="sfB-pl-tag">Beginner</span>
<span class="sfB-pl-tag">Social</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://music.youtube.com/search?q=kizomba+love+songs" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Romantic</span>
<span class="sfB-pl-tag">Sensual</span>
<span class="sfB-pl-tag">Chill</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://music.youtube.com/search?q=urban+kiz+practice+mix" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Modern</span>
<span class="sfB-pl-tag">Technique</span>
<span class="sfB-pl-tag">Practice</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://music.youtube.com/search?q=tarraxinha+session" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Slow</span>
<span class="sfB-pl-tag">Deep</span>
<span class="sfB-pl-tag">Sensual</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://music.youtube.com/search?q=kizomba+party+night" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Party</span>
<span class="sfB-pl-tag">DJs</span>
<span class="sfB-pl-tag">Medium Energy</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
</div>
</div>
@@ -407,104 +408,74 @@
<!-- ZOUK -->
<section class="sfB-pl-section">
<div class="sfB-pl-section-head">
<span class="sfB-chip zouk">Zouk</span>
<h2 class="sfB-pl-title">Zouk</h2>
</div>
<div class="sfB-pl-platform-group">
<div class="sfB-pl-platform-label spotify">
<span class="pdot spotify"></span>
Spotify
</div>
<div class="sfB-pl-grid5">
<a href="https://open.spotify.com/search/brazilian%20zouk%20essentials/playlists" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Beginner</span>
<span class="sfB-pl-tag">Social Dance</span>
<span class="sfB-pl-tag">Danceable</span>
<a href="https://open.spotify.com/playlist/37i9dQZF1DWZjVBCh3y4ph" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">Zouk Station</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/search/zouk%20love/playlists" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Romantic</span>
<span class="sfB-pl-tag">Slow</span>
<span class="sfB-pl-tag">Sensual</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/search/modern%20brazilian%20zouk/playlists" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Current</span>
<span class="sfB-pl-tag">Technique</span>
<span class="sfB-pl-tag">Flow</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/search/deep%20zouk/playlists" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Sensual</span>
<span class="sfB-pl-tag">Couples</span>
<span class="sfB-pl-tag">Night Out</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://open.spotify.com/search/zouk%20party/playlists" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Popular</span>
<span class="sfB-pl-tag">Party</span>
<span class="sfB-pl-tag">Most Popular</span>
<span class="sfB-pl-tag">DJs</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
</div>
</div>
<div class="sfB-pl-platform-group">
<div class="sfB-pl-platform-label ytmusic">
<span class="pdot ytmusic"></span>
YouTube Music
</div>
<div class="sfB-pl-grid5">
<a href="https://music.youtube.com/search?q=brazilian+zouk+dance+practice" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Beginner</span>
<span class="sfB-pl-tag">Technique</span>
<span class="sfB-pl-tag">Practice</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://music.youtube.com/search?q=romantic+zouk+love+playlist" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Romantic</span>
<span class="sfB-pl-tag">Slow</span>
<span class="sfB-pl-tag">Connection</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://music.youtube.com/search?q=zouk+flow+session" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Sensual</span>
<span class="sfB-pl-tag">Couples</span>
<span class="sfB-pl-tag">Flow</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://music.youtube.com/search?q=modern+brazilian+zouk+hits" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Current</span>
<span class="sfB-pl-tag">Social</span>
<span class="sfB-pl-tag">Kompa-Zouk</span>
<span class="sfB-pl-tag">Modern</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
<a href="https://music.youtube.com/search?q=zouk+night+party" target="_blank" rel="noopener" class="sfB-pl-card ytmusic">
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Party</span>
<span class="sfB-pl-tag">DJs</span>
<span class="sfB-pl-tag">Night Mood</span>
<a href="https://open.spotify.com/playlist/7mNGeqFpLOFebS0QrGXU2N" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">The Sound of Zouk</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Essentials</span>
<span class="sfB-pl-tag">Discovery</span>
<span class="sfB-pl-tag">Varied</span>
<span class="sfB-pl-tag">Reference</span>
</div>
</a>
<a href="https://open.spotify.com/playlist/7M7sDdZMHhpN0huB5moMjY" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">Zouk</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Classes</span>
<span class="sfB-pl-tag">Clear Tempo</span>
<span class="sfB-pl-tag">Beginner</span>
<span class="sfB-pl-tag">Practice</span>
</div>
</a>
<a href="https://open.spotify.com/playlist/2V5jTlSJxy8pISP8b4k3L8" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">ZOUK BRAZIL 2026</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Brazilian Zouk</span>
<span class="sfB-pl-tag">Social</span>
<span class="sfB-pl-tag">Modern</span>
<span class="sfB-pl-tag">Dancers</span>
</div>
</a>
<a href="https://open.spotify.com/playlist/6bPKhzRuXrc4yePSBCcals" target="_blank" rel="noopener" class="sfB-pl-card spotify">
<div class="sfB-pl-header">
<div class="sfB-pl-logo"><img src="../assets/spotify.png" alt="Spotify"></div>
<span class="sfB-pl-name">The Best of Kompa Zouk 2025 BY OSOCITY</span>
</div>
<div class="sfB-pl-spacer"></div>
<div class="sfB-pl-tags">
<span class="sfB-pl-tag">Kompa-Zouk</span>
<span class="sfB-pl-tag">Party</span>
<span class="sfB-pl-tag">Popular</span>
<span class="sfB-pl-tag">Atmosphere</span>
</div>
<span class="sfB-pl-open">Listen →</span>
</a>
</div>
</div>
@@ -532,7 +503,7 @@
</div>
</footer>
<script src="../js/main.js?v=b859151d"></script>
<script src="../js/main.js?v=6aeda9d1"></script>
</body>
</html>

4
schedule/index.html
View File

@@ -13,7 +13,7 @@
<link
href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..60,700;12..60,800&family=Caveat+Brush&family=JetBrains+Mono:wght@400;500&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="../css/style.css?v=b859151d">
<link rel="stylesheet" href="../css/style.css?v=6aeda9d1">
</head>
<body>
@@ -122,7 +122,7 @@
</div>
</footer>
<script src="../js/main.js?v=b859151d"></script>
<script src="../js/main.js?v=6aeda9d1"></script>
<script>
// Dynamic last-update label
(function () {

4
studios/index.html
View File

@@ -13,7 +13,7 @@
<link
href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..60,700;12..60,800&family=Caveat+Brush&family=JetBrains+Mono:wght@400;500&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="../css/style.css?v=b859151d">
<link rel="stylesheet" href="../css/style.css?v=6aeda9d1">
</head>
<body>
@@ -240,7 +240,7 @@
</div>
</footer>
<script src="../js/main.js?v=b859151d"></script>
<script src="../js/main.js?v=6aeda9d1"></script>
</body>
</html>