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

Redesign

Browse Source
This commit is contained in:
Javier Blanco
2026-05-01 10:06:52 +07:00
parent fc3327d1ce
commit c96e098f38
7 changed files with 253 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
classes.html
View File

@@ -1,16 +1,21 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Dance Classes — Sabor Flow Da Nang</title> <title>Dance Classes — Sabor Flow Da Nang</title>
<meta name="description" content="Latin dance classes in Da Nang. Find Salsa, Bachata, Kizomba, and Zouk classes for all levels."> <meta name="description"
content="Latin dance classes in Da Nang. Find Salsa, Bachata, Kizomba, and Zouk classes for all levels.">
<link rel="icon" type="image/jpeg" href="assets/logo.jpg"> <link rel="icon" type="image/jpeg" href="assets/logo.jpg">
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<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
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"> <link rel="stylesheet" href="css/style.css">
</head> </head>
<body> <body>
<div class="sfB-bg" aria-hidden="true"></div> <div class="sfB-bg" aria-hidden="true"></div>
@@ -40,7 +45,12 @@
</nav> </nav>
<div class="topbar-right"> <div class="topbar-right">
<a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig"> <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
<line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
</svg>
@saborflowdanang @saborflowdanang
</a> </a>
<button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu"> <button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu">
@@ -53,7 +63,8 @@
<div class="sfB-page-head"> <div class="sfB-page-head">
<h1>Dance <em>Classes</em></h1> <h1>Dance <em>Classes</em></h1>
<div class="info"> <div class="info">
Whether you're just starting out or looking to sharpen your moves &mdash; there's a class for you in Da Nang and Hoi An. Whether you're just starting out or looking to sharpen your moves &mdash; there's a class for you in Da Nang and
Hoi An.
</div> </div>
</div> </div>
@@ -87,11 +98,21 @@
</div> </div>
<div class="links"> <div class="links">
<a href="https://salsadanang.com" target="_blank" rel="noopener"> <a href="https://salsadanang.com" target="_blank" rel="noopener">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="2" y1="12" x2="22" y2="12"/><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/></svg> <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="10" />
<line x1="2" y1="12" x2="22" y2="12" />
<path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z" />
</svg>
salsadanang.com salsadanang.com
</a> </a>
<a href="https://www.instagram.com/salsadanang/" target="_blank" rel="noopener"> <a href="https://www.instagram.com/salsadanang/" target="_blank" rel="noopener">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg> <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
<line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
</svg>
@salsadanang @salsadanang
</a> </a>
</div> </div>
@@ -106,13 +127,20 @@
<span class="sfB-chip kizomba">Kizomba</span> <span class="sfB-chip kizomba">Kizomba</span>
</div> </div>
<div class="info"> <div class="info">
<div class="row"><span class="ic">👤</span><span>Daisy Nguyen &mdash; local instructor &amp; social organizer</span></div> <div class="row"><span class="ic">👤</span><span>Daisy Nguyen &mdash; local instructor &amp; social
<div class="row"><span class="ic">📍</span><span>Da Nang (venues change &mdash; follow for updates)</span></div> organizer</span></div>
<div class="row"><span class="ic">📍</span><span>Da Nang (venues change &mdash; follow for updates)</span>
</div>
<div class="row"><span class="ic">📅</span><span>Tuesday at Caliz Bar · Sunday at Corner Bar</span></div> <div class="row"><span class="ic">📅</span><span>Tuesday at Caliz Bar · Sunday at Corner Bar</span></div>
</div> </div>
<div class="links"> <div class="links">
<a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener"> <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg> <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
<line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
</svg>
Check Instagram Check Instagram
</a> </a>
</div> </div>
@@ -128,12 +156,16 @@
<div class="info"> <div class="info">
<div class="row"><span class="ic">👥</span><span>Luu Nhat Phuong, Phong &amp; Shai</span></div> <div class="row"><span class="ic">👥</span><span>Luu Nhat Phuong, Phong &amp; Shai</span></div>
<div class="row"><span class="ic">📍</span><span>292 Vo Nguyen Giap, Ngu Hanh Son, Da Nang</span></div> <div class="row"><span class="ic">📍</span><span>292 Vo Nguyen Giap, Ngu Hanh Son, Da Nang</span></div>
<div class="row"><span class="ic">📅</span><span>Every Monday &mdash; Workshop 8:30 PM · Social 9:30 PM</span></div> <div class="row"><span class="ic">📅</span><span>Every Monday &mdash; Workshop 8:30 PM · Social 9:30 PM</span>
</div>
<div class="row"><span class="ic">🎓</span><span>Beginner · Intermediate</span></div> <div class="row"><span class="ic">🎓</span><span>Beginner · Intermediate</span></div>
</div> </div>
<div class="links"> <div class="links">
<a href="https://www.facebook.com/frog.goose/" target="_blank" rel="noopener"> <a href="https://www.facebook.com/frog.goose/" target="_blank" rel="noopener">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg> <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" />
</svg>
Facebook Facebook
</a> </a>
</div> </div>
@@ -148,13 +180,18 @@
<span class="sfB-chip bachata">Bachata</span> <span class="sfB-chip bachata">Bachata</span>
</div> </div>
<div class="info"> <div class="info">
<div class="row"><span class="ic">👤</span><span>Sean Kim &mdash; organizer of the Wednesday Bachata Kiz Night</span></div> <div class="row"><span class="ic">👤</span><span>Sean Kim &mdash; organizer of the Wednesday Bachata Kiz
Night</span></div>
<div class="row"><span class="ic">📍</span><span>Ket Fai Bar, Da Nang</span></div> <div class="row"><span class="ic">📍</span><span>Ket Fai Bar, Da Nang</span></div>
<div class="row"><span class="ic">📅</span><span>Wednesday &mdash; Kizomba 7:30 PM · Bachata 9 PM</span></div> <div class="row"><span class="ic">📅</span><span>Wednesday &mdash; Kizomba 7:30 PM · Bachata 9 PM</span></div>
</div> </div>
<div class="links"> <div class="links">
<a href="connect.html"> <a href="connect.html">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/><polyline points="22,6 12,13 2,6"/></svg> <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z" />
<polyline points="22,6 12,13 2,6" />
</svg>
Contact via Sabor Flow Contact via Sabor Flow
</a> </a>
</div> </div>
@@ -173,7 +210,8 @@
<div class="info"> <div class="info">
<div class="row"><span class="ic">📍</span><span>36 Ng. Thi Si, Bac My An, Ngu Hanh Son, Da Nang</span></div> <div class="row"><span class="ic">📍</span><span>36 Ng. Thi Si, Bac My An, Ngu Hanh Son, Da Nang</span></div>
<div class="row"><span class="ic">📅</span><span>Monday 9 PM &mdash; Kizomba &amp; Zouk night</span></div> <div class="row"><span class="ic">📅</span><span>Monday 9 PM &mdash; Kizomba &amp; Zouk night</span></div>
<div class="row"><span class="ic">📅</span><span>Friday 9 PM &mdash; Latin Vibes (Salsa, Bachata, Kizomba)</span></div> <div class="row"><span class="ic">📅</span><span>Friday 9 PM &mdash; Latin Vibes (Salsa, Bachata,
Kizomba)</span></div>
<div class="row"><span class="ic">💵</span><span>~$3 USD cover · Beginner-friendly</span></div> <div class="row"><span class="ic">💵</span><span>~$3 USD cover · Beginner-friendly</span></div>
</div> </div>
</div> </div>
@@ -187,7 +225,7 @@
</main> </main>
<footer class="sfB-foot"> <footer class="sfB-foot">
<div><strong>SABOR FLOW</strong> Da Nang &mdash; Latin dance community &copy; 2025</div> <div><strong>Sabor Flow</strong> Da Nang &mdash; Latin dance community &copy; <span id="footer-year">2025</span></div>
<nav class="foot-links"> <nav class="foot-links">
<a href="/">Home</a> <a href="/">Home</a>
<a href="schedule.html">Schedule</a> <a href="schedule.html">Schedule</a>
@@ -204,4 +242,5 @@
<script src="js/main.js"></script> <script src="js/main.js"></script>
</body> </body>
</html> </html>

60
connect.html
View File

@@ -1,5 +1,6 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
@@ -8,9 +9,12 @@
<link rel="icon" type="image/jpeg" href="assets/logo.jpg"> <link rel="icon" type="image/jpeg" href="assets/logo.jpg">
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<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
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"> <link rel="stylesheet" href="css/style.css">
</head> </head>
<body> <body>
<div class="sfB-bg" aria-hidden="true"></div> <div class="sfB-bg" aria-hidden="true"></div>
@@ -40,7 +44,12 @@
</nav> </nav>
<div class="topbar-right"> <div class="topbar-right">
<a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig"> <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
<line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
</svg>
@saborflowdanang @saborflowdanang
</a> </a>
<button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu"> <button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu">
@@ -53,7 +62,8 @@
<div class="sfB-page-head"> <div class="sfB-page-head">
<h1>Stay <em>Connected</em></h1> <h1>Stay <em>Connected</em></h1>
<div class="info"> <div class="info">
Sabor Flow lives on Instagram and inside a few group chats. There's no app, no email list, no spam &mdash; just messages from real dancers about real parties. Pick whichever channel fits. Sabor Flow lives on Instagram and inside a few group chats. There's no app, no email list, no spam &mdash; just
messages from real dancers about real parties. Pick whichever channel fits.
</div> </div>
</div> </div>
@@ -64,20 +74,32 @@
<div> <div>
<div class="h">@saborflowdanang</div> <div class="h">@saborflowdanang</div>
<h2>The Instagram is the source of truth.</h2> <h2>The Instagram is the source of truth.</h2>
<p>Photos, videos, and announcements from Da Nang's Latin dance community. Social dances almost every day of the week.</p> <p>Photos, videos, and announcements from Da Nang's Latin dance community. Social dances almost every day of the
week.</p>
</div> </div>
</div> </div>
<div class="ch-right"> <div class="ch-right">
<a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-btn primary"> <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-btn primary">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
<line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
</svg>
Follow on Instagram Follow on Instagram
</a> </a>
<a href="https://www.facebook.com/groups/sbkdanang/" target="_blank" rel="noopener" class="sfB-btn ghost"> <a href="https://www.facebook.com/groups/sbkdanang/" target="_blank" rel="noopener" class="sfB-btn ghost">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" />
</svg>
Join Facebook Group Join Facebook Group
</a> </a>
<a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-btn ghost"> <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-btn ghost">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" />
</svg>
DM Us DM Us
</a> </a>
</div> </div>
@@ -86,10 +108,14 @@
<!-- Instagram grid --> <!-- Instagram grid -->
<div style="margin-top: 48px;"> <div style="margin-top: 48px;">
<div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px;"> <div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px;">
<h2 style="font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 28px; letter-spacing: -1px;"> <h2
Latest from the <em style="font-family: 'Caveat Brush', cursive; font-style: normal; font-weight: 400; color: var(--sf-coral);">floor</em> style="font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 28px; letter-spacing: -1px;">
Latest from the <em
style="font-family: 'Caveat Brush', cursive; font-style: normal; font-weight: 400; color: var(--sf-coral);">floor</em>
</h2> </h2>
<a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" style="font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--sf-gold); letter-spacing: 1px; text-decoration: none;">VIEW ALL ↗</a> <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener"
style="font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--sf-gold); letter-spacing: 1px; text-decoration: none;">VIEW
ALL ↗</a>
</div> </div>
<div class="sfB-igrid"> <div class="sfB-igrid">
<div class="ig"> <div class="ig">
@@ -131,16 +157,19 @@
<div class="sfB-collab"> <div class="sfB-collab">
<div class="l">/ COLLABORATE</div> <div class="l">/ COLLABORATE</div>
<h2>Run a venue? <em>Teach?</em><br>DJ Latin?</h2> <h2>Run a venue? <em>Teach?</em><br>DJ Latin?</h2>
<p>We're always looking to expand the floor. If you're an instructor, DJ, or you run a bar that wants to host a Latin night &mdash; let's talk. Sabor Flow is non-profit and connects people, never charges.</p> <p>We're always looking to expand the floor. If you're an instructor, DJ, or you run a bar that wants to host a
Latin night &mdash; let's talk. Sabor Flow is non-profit and connects people, never charges.</p>
<div class="acts"> <div class="acts">
<a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-btn primary">Get in touch ↗</a> <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-btn primary">Get
<a href="https://www.facebook.com/groups/sbkdanang/" target="_blank" rel="noopener" class="sfB-btn ghost">Facebook Group ↗</a> in touch ↗</a>
<a href="https://www.facebook.com/groups/sbkdanang/" target="_blank" rel="noopener"
class="sfB-btn ghost">Facebook Group ↗</a>
</div> </div>
</div> </div>
</main> </main>
<footer class="sfB-foot"> <footer class="sfB-foot">
<div><strong>SABOR FLOW</strong> Da Nang &mdash; Latin dance community &copy; 2025</div> <div><strong>Sabor Flow</strong> Da Nang &mdash; Latin dance community &copy; <span id="footer-year">2025</span></div>
<nav class="foot-links"> <nav class="foot-links">
<a href="/">Home</a> <a href="/">Home</a>
<a href="schedule.html">Schedule</a> <a href="schedule.html">Schedule</a>
@@ -157,4 +186,5 @@
<script src="js/main.js"></script> <script src="js/main.js"></script>
</body> </body>
</html> </html>

99
festivals.html
View File

@@ -1,16 +1,21 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Festivals — Sabor Flow Da Nang</title> <title>Festivals — Sabor Flow Da Nang</title>
<meta name="description" content="Latin dance festivals in Da Nang, Vietnam. Multi-day events with international artists, workshops, and social dancing."> <meta name="description"
content="Latin dance festivals in Da Nang, Vietnam. Multi-day events with international artists, workshops, and social dancing.">
<link rel="icon" type="image/jpeg" href="assets/logo.jpg"> <link rel="icon" type="image/jpeg" href="assets/logo.jpg">
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<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
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"> <link rel="stylesheet" href="css/style.css">
</head> </head>
<body> <body>
<div class="sfB-bg" aria-hidden="true"></div> <div class="sfB-bg" aria-hidden="true"></div>
@@ -40,7 +45,12 @@
</nav> </nav>
<div class="topbar-right"> <div class="topbar-right">
<a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig"> <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
<line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
</svg>
@saborflowdanang @saborflowdanang
</a> </a>
<button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu"> <button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu">
@@ -53,7 +63,8 @@
<div class="sfB-page-head"> <div class="sfB-page-head">
<h1>Da Nang <em>Festivals</em></h1> <h1>Da Nang <em>Festivals</em></h1>
<div class="info"> <div class="info">
Multi-day Latin dance events right here in Da Nang &mdash; workshops, performances, and non-stop social dancing with international artists. Multi-day Latin dance events right here in Da Nang &mdash; workshops, performances, and non-stop social dancing
with international artists.
</div> </div>
</div> </div>
@@ -70,11 +81,21 @@
<div class="body"> <div class="body">
<div class="meta"> <div class="meta">
<div class="item"> <div class="item">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<rect x="3" y="4" width="18" height="18" rx="2" ry="2" />
<line x1="16" y1="2" x2="16" y2="6" />
<line x1="8" y1="2" x2="8" y2="6" />
<line x1="3" y1="10" x2="21" y2="10" />
</svg>
<span><b>May 15–17, 2026</b></span> <span><b>May 15–17, 2026</b></span>
</div> </div>
<div class="item"> <div class="item">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z" />
<circle cx="12" cy="10" r="3" />
</svg>
<span>Royal Lotus Hotel · <b>My Khe Beach, Da Nang</b></span> <span>Royal Lotus Hotel · <b>My Khe Beach, Da Nang</b></span>
</div> </div>
</div> </div>
@@ -82,18 +103,33 @@
<span class="sfB-chip bachata">Bachata</span> <span class="sfB-chip bachata">Bachata</span>
<span class="sfB-chip kizomba">Kizomba</span> <span class="sfB-chip kizomba">Kizomba</span>
</div> </div>
<p>A destination-style festival set against the backdrop of Da Nang's stunning beach. Three days of workshops, social parties, and performances with international artists. The perfect excuse to combine dancing with a beach getaway.</p> <p>A destination-style festival set against the backdrop of Da Nang's stunning beach. Three days of workshops,
social parties, and performances with international artists. The perfect excuse to combine dancing with a
beach getaway.</p>
<div class="acts"> <div class="acts">
<a href="https://www.facebook.com/latin.escape.danang/" target="_blank" rel="noopener"> <a href="https://www.facebook.com/latin.escape.danang/" target="_blank" rel="noopener">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg> <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" />
</svg>
Facebook Facebook
</a> </a>
<a href="https://www.instagram.com/latin.escape.danang/" target="_blank" rel="noopener"> <a href="https://www.instagram.com/latin.escape.danang/" target="_blank" rel="noopener">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg> <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
<line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
</svg>
Instagram Instagram
</a> </a>
<a href="https://www.tickettailor.com/events/latinescapedanang" target="_blank" rel="noopener" class="primary"> <a href="https://www.tickettailor.com/events/latinescapedanang" target="_blank" rel="noopener"
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v2z"/></svg> class="primary">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<path
d="M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v2z" />
</svg>
Buy Tickets Buy Tickets
</a> </a>
</div> </div>
@@ -113,11 +149,21 @@
<div class="body"> <div class="body">
<div class="meta"> <div class="meta">
<div class="item"> <div class="item">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<rect x="3" y="4" width="18" height="18" rx="2" ry="2" />
<line x1="16" y1="2" x2="16" y2="6" />
<line x1="8" y1="2" x2="8" y2="6" />
<line x1="3" y1="10" x2="21" y2="10" />
</svg>
<span><b>October 2–4, 2026</b></span> <span><b>October 2–4, 2026</b></span>
</div> </div>
<div class="item"> <div class="item">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z" />
<circle cx="12" cy="10" r="3" />
</svg>
<span>Da Nang Beach · <b>Da Nang</b></span> <span>Da Nang Beach · <b>Da Nang</b></span>
</div> </div>
</div> </div>
@@ -127,18 +173,32 @@
<span class="sfB-chip kizomba">Kizomba</span> <span class="sfB-chip kizomba">Kizomba</span>
<span class="sfB-chip zouk">Zouk</span> <span class="sfB-chip zouk">Zouk</span>
</div> </div>
<p>Now in its 7th edition and recently moved to Da Nang, the Vietnam Latin Xperience (VLX) is one of Southeast Asia's most beloved Latin festivals. Three days of workshops, bootcamps, and social parties with a warm, family-like community vibe.</p> <p>Now in its 7th edition and recently moved to Da Nang, the Vietnam Latin Xperience (VLX) is one of Southeast
Asia's most beloved Latin festivals. Three days of workshops, bootcamps, and social parties with a warm,
family-like community vibe.</p>
<div class="acts"> <div class="acts">
<a href="https://vietnamlatinxperience.com" target="_blank" rel="noopener"> <a href="https://vietnamlatinxperience.com" target="_blank" rel="noopener">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="2" y1="12" x2="22" y2="12"/><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/></svg> <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="10" />
<line x1="2" y1="12" x2="22" y2="12" />
<path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z" />
</svg>
Website Website
</a> </a>
<a href="https://www.facebook.com/VietnamLatinXperience/" target="_blank" rel="noopener"> <a href="https://www.facebook.com/VietnamLatinXperience/" target="_blank" rel="noopener">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg> <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" />
</svg>
Facebook Facebook
</a> </a>
<a href="https://www.tickettailor.com" target="_blank" rel="noopener" class="primary"> <a href="https://www.tickettailor.com" target="_blank" rel="noopener" class="primary">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v2z"/></svg> <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<path
d="M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v2z" />
</svg>
Buy Tickets Buy Tickets
</a> </a>
</div> </div>
@@ -152,7 +212,7 @@
</main> </main>
<footer class="sfB-foot"> <footer class="sfB-foot">
<div><strong>SABOR FLOW</strong> Da Nang &mdash; Latin dance community &copy; 2025</div> <div><strong>Sabor Flow</strong> Da Nang &mdash; Latin dance community &copy; <span id="footer-year">2025</span></div>
<nav class="foot-links"> <nav class="foot-links">
<a href="/">Home</a> <a href="/">Home</a>
<a href="schedule.html">Schedule</a> <a href="schedule.html">Schedule</a>
@@ -169,4 +229,5 @@
<script src="js/main.js"></script> <script src="js/main.js"></script>
</body> </body>
</html> </html>

6
index.html
View File

@@ -1,4 +1,4 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
@@ -6,7 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sabor Flow Da Nang — Dance community</title> <title>Sabor Flow Da Nang — Dance community</title>
<meta name="description" <meta name="description"
content="Da Nang'sDance community. Weekly socials, studios, classes, and festivals for Salsa, Bachata, Kizomba, and Zouk."> content="Da Nang's Latin dance community. Weekly socials, studios, classes, and festivals for Salsa, Bachata, Kizomba, and Zouk.">
<link rel="icon" type="image/jpeg" href="assets/logo.jpg"> <link rel="icon" type="image/jpeg" href="assets/logo.jpg">
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
@@ -252,7 +252,7 @@
<!-- Footer --> <!-- Footer -->
<footer class="sfB-foot"> <footer class="sfB-foot">
<div> <div>
<strong>Sabor Flow</strong> Da Nang &mdash;Dance community &copy; <span id="footer-year">2025</span> <strong>Sabor Flow</strong> Da Nang &mdash; Latin dance community &copy; <span id="footer-year">2025</span>
</div> </div>
<nav class="foot-links"> <nav class="foot-links">
<a href="/">Home</a> <a href="/">Home</a>

2
js/main.js
View File

@@ -146,4 +146,6 @@ document.addEventListener('DOMContentLoaded', () => {
renderScheduleList(); renderScheduleList();
renderScheduleTeaser(); renderScheduleTeaser();
initFilters(); initFilters();
const yearEl = document.getElementById('footer-year');
if (yearEl) yearEl.textContent = new Date().getFullYear();
}); });

32
schedule.html
View File

@@ -1,16 +1,21 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Weekly Schedule — Sabor Flow Da Nang</title> <title>Weekly Schedule — Sabor Flow Da Nang</title>
<meta name="description" content="The weekly Latin social dance schedule in Da Nang and Hoi An. Salsa, Bachata, Kizomba, Zouk — every day of the week."> <meta name="description"
content="The weekly Latin social dance schedule in Da Nang and Hoi An. Salsa, Bachata, Kizomba, Zouk — every day of the week.">
<link rel="icon" type="image/jpeg" href="assets/logo.jpg"> <link rel="icon" type="image/jpeg" href="assets/logo.jpg">
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<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
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"> <link rel="stylesheet" href="css/style.css">
</head> </head>
<body> <body>
<div class="sfB-bg" aria-hidden="true"></div> <div class="sfB-bg" aria-hidden="true"></div>
@@ -40,7 +45,12 @@
</nav> </nav>
<div class="topbar-right"> <div class="topbar-right">
<a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig"> <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
<line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
</svg>
@saborflowdanang @saborflowdanang
</a> </a>
<button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu"> <button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu">
@@ -53,7 +63,11 @@
<div class="sfB-page-head"> <div class="sfB-page-head">
<h1>Weekly <em>Schedule</em></h1> <h1>Weekly <em>Schedule</em></h1>
<div class="info"> <div class="info">
Music ratios (e.g. <b>2 Salsa · 2 Bachata · 2 Kizomba</b>) show approximate songs per style per rotation. Schedules may change — follow <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener">@saborflowdanang</a> and the <a href="https://www.facebook.com/groups/sbkdanang/" target="_blank" rel="noopener">Da Nang SBK group</a> for real-time updates. Pop-up parties for <b>Zouk</b> and <b>Tango</b> are announced there too. Music ratios (e.g. <b>2 Salsa · 2 Bachata · 2 Kizomba</b>) show approximate songs per style per rotation.
Schedules may change — follow <a href="https://www.instagram.com/saborflowdanang/" target="_blank"
rel="noopener">@saborflowdanang</a> and the <a href="https://www.facebook.com/groups/sbkdanang/"
target="_blank" rel="noopener">Da Nang SBK group</a> for real-time updates. Pop-up parties for <b>Zouk</b> and
<b>Tango</b> are announced there too.
</div> </div>
</div> </div>
@@ -71,11 +85,12 @@
<div class="sfB-list" id="sfB-schedule-list"></div> <div class="sfB-list" id="sfB-schedule-list"></div>
<p class="footnote">Schedule updated monthly &mdash; last update: <strong style="color:var(--sf-gold)">May 2026</strong></p> <p class="footnote">Schedule updated monthly &mdash; last update: <strong style="color:var(--sf-gold)">May
2026</strong></p>
</main> </main>
<footer class="sfB-foot"> <footer class="sfB-foot">
<div><strong>SABOR FLOW</strong> Da Nang &mdash; Latin dance community &copy; 2025</div> <div><strong>Sabor Flow</strong> Da Nang &mdash; Latin dance community &copy; <span id="footer-year">2025</span></div>
<nav class="foot-links"> <nav class="foot-links">
<a href="/">Home</a> <a href="/">Home</a>
<a href="schedule.html">Schedule</a> <a href="schedule.html">Schedule</a>
@@ -102,7 +117,7 @@
document.querySelectorAll('.sfB-row').forEach(row => { document.querySelectorAll('.sfB-row').forEach(row => {
if (f === 'all') { row.style.display = ''; return; } if (f === 'all') { row.style.display = ''; return; }
const music = row.querySelector('.col-music')?.textContent.toLowerCase() || ''; const music = row.querySelector('.col-music')?.textContent.toLowerCase() || '';
const city = row.querySelector('.col-city')?.textContent.toLowerCase() || ''; const city = row.querySelector('.col-city')?.textContent.toLowerCase() || '';
const show = music.includes(f) || city.includes(f === 'danang' ? 'da nang' : f); const show = music.includes(f) || city.includes(f === 'danang' ? 'da nang' : f);
row.style.display = show ? '' : 'none'; row.style.display = show ? '' : 'none';
}); });
@@ -111,4 +126,5 @@
}); });
</script> </script>
</body> </body>
</html> </html>

49
studios.html
View File

@@ -1,16 +1,21 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Dance Studios — Sabor Flow Da Nang</title> <title>Dance Studios — Sabor Flow Da Nang</title>
<meta name="description" content="Latin dance studios in Da Nang, Vietnam. Find schools teaching Salsa, Bachata, Kizomba, and Zouk."> <meta name="description"
content="Latin dance studios in Da Nang, Vietnam. Find schools teaching Salsa, Bachata, Kizomba, and Zouk.">
<link rel="icon" type="image/jpeg" href="assets/logo.jpg"> <link rel="icon" type="image/jpeg" href="assets/logo.jpg">
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<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
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"> <link rel="stylesheet" href="css/style.css">
</head> </head>
<body> <body>
<div class="sfB-bg" aria-hidden="true"></div> <div class="sfB-bg" aria-hidden="true"></div>
@@ -40,7 +45,12 @@
</nav> </nav>
<div class="topbar-right"> <div class="topbar-right">
<a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig"> <a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener" class="sfB-ig">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
<line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
</svg>
@saborflowdanang @saborflowdanang
</a> </a>
<button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu"> <button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu">
@@ -53,7 +63,8 @@
<div class="sfB-page-head"> <div class="sfB-page-head">
<h1>Dance <em>Studios</em></h1> <h1>Dance <em>Studios</em></h1>
<div class="info"> <div class="info">
Dedicated schools and venues where you can take Latin dance lessons in Da Nang. Filter by style to find your perfect fit. Dedicated schools and venues where you can take Latin dance lessons in Da Nang. Filter by style to find your
perfect fit.
</div> </div>
</div> </div>
@@ -92,7 +103,10 @@
</div> </div>
<div class="links"> <div class="links">
<a href="https://www.facebook.com/frog.goose/" target="_blank" rel="noopener"> <a href="https://www.facebook.com/frog.goose/" target="_blank" rel="noopener">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg> <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" />
</svg>
Facebook Facebook
</a> </a>
</div> </div>
@@ -122,11 +136,21 @@
</div> </div>
<div class="links"> <div class="links">
<a href="https://salsadanang.com" target="_blank" rel="noopener"> <a href="https://salsadanang.com" target="_blank" rel="noopener">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="2" y1="12" x2="22" y2="12"/><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/></svg> <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="10" />
<line x1="2" y1="12" x2="22" y2="12" />
<path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z" />
</svg>
Website Website
</a> </a>
<a href="https://www.instagram.com/salsadanang/" target="_blank" rel="noopener"> <a href="https://www.instagram.com/salsadanang/" target="_blank" rel="noopener">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg> <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
<line x1="17.5" y1="6.5" x2="17.51" y2="6.5" />
</svg>
Instagram Instagram
</a> </a>
</div> </div>
@@ -158,7 +182,11 @@
</div> </div>
<div class="links"> <div class="links">
<a href="mailto:LearnToDanceDANANG@gmail.com"> <a href="mailto:LearnToDanceDANANG@gmail.com">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/><polyline points="22,6 12,13 2,6"/></svg> <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
stroke-linecap="round" stroke-linejoin="round">
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z" />
<polyline points="22,6 12,13 2,6" />
</svg>
Email Email
</a> </a>
</div> </div>
@@ -173,7 +201,7 @@
</main> </main>
<footer class="sfB-foot"> <footer class="sfB-foot">
<div><strong>SABOR FLOW</strong> Da Nang &mdash; Latin dance community &copy; 2025</div> <div><strong>Sabor Flow</strong> Da Nang &mdash; Latin dance community &copy; <span id="footer-year">2025</span></div>
<nav class="foot-links"> <nav class="foot-links">
<a href="/">Home</a> <a href="/">Home</a>
<a href="schedule.html">Schedule</a> <a href="schedule.html">Schedule</a>
@@ -190,4 +218,5 @@
<script src="js/main.js"></script> <script src="js/main.js"></script>
</body> </body>
</html> </html>