Little fixes
This commit is contained in:
384
classes/index.html
Normal file
384
classes/index.html
Normal file
@@ -0,0 +1,384 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<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.">
|
||||
<link rel="icon" type="image/jpeg" href="../assets/logo.jpg">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<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 rel="stylesheet" href="../css/style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div class="sfB-bg" aria-hidden="true">
|
||||
<div class="sfB-palms">
|
||||
<img class="sfB-palm corner-tl" src="../assets/palm-fronds-left.png" alt=""
|
||||
style="--sway:2.5deg;animation-duration:8s;animation-delay:0s">
|
||||
<img class="sfB-palm corner-tr" src="../assets/palm-fronds-right.png" alt=""
|
||||
style="--sway:3deg;animation-duration:9s;animation-delay:-2s">
|
||||
<img class="sfB-palm corner-bl" src="../assets/palm-fronds-left.png" alt=""
|
||||
style="--sway:2.8deg;animation-duration:10s;animation-delay:-4s;--flip:scaleY(-1)">
|
||||
<img class="sfB-palm corner-br" src="../assets/palm-fronds-right.png" alt=""
|
||||
style="--sway:2.2deg;animation-duration:11s;animation-delay:-1.5s;--flip:scaleY(-1)">
|
||||
<img class="sfB-palm corner-ml" src="../assets/palm-fronds-left.png" alt=""
|
||||
style="--sway:3.2deg;animation-duration:9.5s;animation-delay:-3s">
|
||||
<img class="sfB-palm corner-ml2" src="../assets/palm-fronds-left.png" alt=""
|
||||
style="--sway:2.6deg;animation-duration:10.5s;animation-delay:-6s;--flip:scaleY(-1)">
|
||||
<img class="sfB-palm corner-mr" src="../assets/palm-fronds-right.png" alt=""
|
||||
style="--sway:2.4deg;animation-duration:11.5s;animation-delay:-1s">
|
||||
<img class="sfB-palm corner-mr2" src="../assets/palm-fronds-right.png" alt=""
|
||||
style="--sway:3.4deg;animation-duration:8.5s;animation-delay:-7s;--flip:scaleY(-1)">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<nav class="sfB-mobile-nav" id="sfB-mobile-nav">
|
||||
<button class="mnav-close" id="sfB-mobile-nav-close">✕</button>
|
||||
<a href="/">Home</a>
|
||||
<a href="/schedule">Schedule</a>
|
||||
<a href="/connect">Connect</a>
|
||||
<a href="/studios">Studios</a>
|
||||
<a href="/classes" class="active">Classes</a>
|
||||
<a href="/festivals">Festivals</a>
|
||||
</nav>
|
||||
|
||||
<header class="sfB-topbar">
|
||||
<a href="/" class="logo">
|
||||
<div class="mark"><img src="../assets/logo.jpg" alt="Sabor Flow Da Nang"></div>
|
||||
<div class="name">SABOR FLOW<span class="city">Da Nang</span></div>
|
||||
</a>
|
||||
<nav class="sfB-nav">
|
||||
<a href="/">Home</a>
|
||||
<a href="/schedule">Schedule</a>
|
||||
<a href="/connect">Connect</a>
|
||||
<a href="/studios">Studios</a>
|
||||
<a href="/classes" class="active">Classes</a>
|
||||
<a href="/festivals">Festivals</a>
|
||||
</nav>
|
||||
<div class="topbar-right">
|
||||
<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>
|
||||
@saborflowdanang
|
||||
</a>
|
||||
<button class="sfB-hamburger" id="sfB-hamburger" aria-label="Open menu">
|
||||
<span></span><span></span><span></span>
|
||||
</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="sfB-page">
|
||||
<div class="sfB-page-head">
|
||||
<h1>Dance <em>Classes</em></h1>
|
||||
<div class="info">
|
||||
Whether you're just starting out or looking to sharpen your moves — there's a class for you in Da Nang and
|
||||
Hoi An.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sfB-toolbar">
|
||||
<div class="sfB-pills">
|
||||
<button class="filter-pill active" data-filter="all">All</button>
|
||||
<button class="filter-pill" data-filter="salsa">Salsa</button>
|
||||
<button class="filter-pill" data-filter="bachata">Bachata</button>
|
||||
<button class="filter-pill" data-filter="kizomba">Kizomba</button>
|
||||
<button class="filter-pill" data-filter="zouk">Zouk</button>
|
||||
<button class="filter-pill" data-filter="beginner">Beginner</button>
|
||||
<button class="filter-pill" data-filter="advanced">Advanced</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sfB-cards two">
|
||||
|
||||
<!-- Lucho Giraldes — Salsa -->
|
||||
<div class="sfB-card-x filterable-card" data-styles="salsa,beginner,intermediate,advanced">
|
||||
<div class="stripe salsa"></div>
|
||||
<h3>Lucho Giraldes — Salsa</h3>
|
||||
<div class="ts">
|
||||
<span class="sfB-chip salsa">Salsa On1</span>
|
||||
<span class="sfB-chip salsa">Salsa On2</span>
|
||||
</div>
|
||||
<div class="info">
|
||||
<div class="row"><span class="ic">👤</span><span>Lucho Giraldes — 20+ years experience</span></div>
|
||||
<div class="row"><span class="ic">📍</span><span>Various venues in Da Nang (see website)</span></div>
|
||||
<div class="row"><span class="ic">📅</span><span>Check website for current schedule</span></div>
|
||||
<div class="row"><span class="ic">🎓</span><span>Beginner · Intermediate · Advanced</span></div>
|
||||
</div>
|
||||
<div class="links">
|
||||
<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>
|
||||
salsadanang.com
|
||||
</a>
|
||||
<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>
|
||||
@salsadanang
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Daisy Nguyen -->
|
||||
<div class="sfB-card-x filterable-card" data-styles="bachata,kizomba,intermediate">
|
||||
<div class="stripe bachata"></div>
|
||||
<h3>Daisy Nguyen</h3>
|
||||
<div class="ts">
|
||||
<span class="sfB-chip bachata">Bachata</span>
|
||||
<span class="sfB-chip kizomba">Kizomba</span>
|
||||
</div>
|
||||
<div class="info">
|
||||
<div class="row"><span class="ic">👤</span><span>Daisy Nguyen — local instructor & social
|
||||
organizer</span></div>
|
||||
<div class="row"><span class="ic">📍</span><span>Da Nang (venues change — follow for updates)</span>
|
||||
</div>
|
||||
<div class="row"><span class="ic">📅</span><span>Tuesday at Caliz Bar · Sunday at Corner Bar</span></div>
|
||||
</div>
|
||||
<div class="links">
|
||||
<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>
|
||||
Check Instagram
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Frog Goose — Bachata Workshop -->
|
||||
<div class="sfB-card-x filterable-card" data-styles="bachata,beginner,intermediate">
|
||||
<div class="stripe bachata"></div>
|
||||
<h3>Frog Goose — Bachata Workshop</h3>
|
||||
<div class="ts">
|
||||
<span class="sfB-chip bachata">Bachata</span>
|
||||
</div>
|
||||
<div class="info">
|
||||
<div class="row"><span class="ic">👥</span><span>Luu Nhat Phuong, Phong & 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>Every Monday — Workshop 8:30 PM · Social 9:30 PM</span>
|
||||
</div>
|
||||
<div class="row"><span class="ic">🎓</span><span>Beginner · Intermediate</span></div>
|
||||
</div>
|
||||
<div class="links">
|
||||
<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>
|
||||
Facebook
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sean Kim — Kizomba & Bachata -->
|
||||
<div class="sfB-card-x filterable-card" data-styles="kizomba,bachata,intermediate">
|
||||
<div class="stripe kizomba"></div>
|
||||
<h3>Sean Kim — Kizomba & Bachata</h3>
|
||||
<div class="ts">
|
||||
<span class="sfB-chip kizomba">Kizomba</span>
|
||||
<span class="sfB-chip bachata">Bachata</span>
|
||||
</div>
|
||||
<div class="info">
|
||||
<div class="row"><span class="ic">👤</span><span>Sean Kim — 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>Wednesday — Kizomba 7:30 PM · Bachata 9 PM</span></div>
|
||||
</div>
|
||||
<div class="links">
|
||||
<a href="/connect">
|
||||
<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
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- LearnToDance Da Nang -->
|
||||
<div class="sfB-card-x filterable-card" data-styles="salsa,bachata,kizomba,zouk">
|
||||
<div class="stripe multi"></div>
|
||||
<h3>LearnToDance Da Nang</h3>
|
||||
<div class="ts">
|
||||
<span class="sfB-chip salsa">Salsa</span>
|
||||
<span class="sfB-chip bachata">Bachata</span>
|
||||
<span class="sfB-chip kizomba">Kizomba</span>
|
||||
<span class="sfB-chip zouk">Zouk</span>
|
||||
</div>
|
||||
<div class="info">
|
||||
<div class="row"><span class="ic">📍</span><span>Da Nang, Vietnam</span></div>
|
||||
<div class="row"><span class="ic">📞</span><span><a href="tel:+84855085903">+84 85 508 5903</a></span></div>
|
||||
</div>
|
||||
<div class="links">
|
||||
<a href="https://www.facebook.com/groups/LearnToDanceDANANG" 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>
|
||||
Facebook
|
||||
</a>
|
||||
<a href="https://www.instagram.com/LearnToDanceDANANG" 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>
|
||||
Instagram
|
||||
</a>
|
||||
<a href="https://www.tiktok.com/@LearnToDanceDANANG" 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="M9 12a4 4 0 1 0 4 4V4a5 5 0 0 0 5 5" />
|
||||
</svg>
|
||||
TikTok
|
||||
</a>
|
||||
<a href="https://youtube.com/@LearnToDanceDANANG" 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="M22.54 6.42a2.78 2.78 0 0 0-1.95-1.96C18.88 4 12 4 12 4s-6.88 0-8.59.46A2.78 2.78 0 0 0 1.46 6.42 29 29 0 0 0 1 12a29 29 0 0 0 .46 5.58 2.78 2.78 0 0 0 1.95 1.96C5.12 20 12 20 12 20s6.88 0 8.59-.46a2.78 2.78 0 0 0 1.95-1.96A29 29 0 0 0 23 12a29 29 0 0 0-.46-5.58z" />
|
||||
<polygon points="9.75 15.02 15.5 12 9.75 8.98 9.75 15.02" />
|
||||
</svg>
|
||||
YouTube
|
||||
</a>
|
||||
<a href="https://chat.whatsapp.com/IFdIfpIxztw6tgTe6ZaD2y" 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="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" />
|
||||
</svg>
|
||||
WhatsApp
|
||||
</a>
|
||||
<a href="https://zalo.me/g/wvnlyh104" 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="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" />
|
||||
</svg>
|
||||
Zalo
|
||||
</a>
|
||||
<a href="https://x.com/LearnToDanceDN" 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="M4 4l16 16M20 4L4 20" />
|
||||
</svg>
|
||||
X
|
||||
</a>
|
||||
<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>
|
||||
Email
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- SoulKiz Da Nang -->
|
||||
<div class="sfB-card-x filterable-card" data-styles="kizomba">
|
||||
<div class="stripe kizomba"></div>
|
||||
<h3>SoulKiz Da Nang</h3>
|
||||
<div class="ts">
|
||||
<span class="sfB-chip kizomba">Kizomba</span>
|
||||
</div>
|
||||
<div class="info">
|
||||
<div class="row"><span class="ic">📍</span><span>Da Nang, Vietnam</span></div>
|
||||
<div class="row"><span class="ic">📞</span><span><a href="tel:+84776868193">+84 77 686 8193</a> —
|
||||
WhatsApp & Zalo</span></div>
|
||||
</div>
|
||||
<div class="links">
|
||||
<a href="https://www.facebook.com/soulkizdanang" 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>
|
||||
SoulKiz Da Nang
|
||||
</a>
|
||||
<a href="https://www.instagram.com/soulkizdanang/" 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>
|
||||
@soulkizdanang
|
||||
</a>
|
||||
<a href="mailto:soulkizdanang@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>
|
||||
Email
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 50 Decibels -->
|
||||
<div class="sfB-card-x filterable-card" data-styles="kizomba,zouk,salsa,bachata,beginner">
|
||||
<div class="stripe multi"></div>
|
||||
<h3>50 Decibels</h3>
|
||||
<div class="ts">
|
||||
<span class="sfB-chip kizomba">Kizomba</span>
|
||||
<span class="sfB-chip zouk">Zouk</span>
|
||||
<span class="sfB-chip salsa">Salsa</span>
|
||||
<span class="sfB-chip bachata">Bachata</span>
|
||||
</div>
|
||||
<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>Monday 9 PM — Kizomba & Zouk night</span></div>
|
||||
<div class="row"><span class="ic">📅</span><span>Friday 9 PM — Latin Vibes (Salsa, Bachata,
|
||||
Kizomba)</span></div>
|
||||
<div class="row"><span class="ic">💵</span><span>~$3 USD cover · Beginner-friendly</span></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="sfB-suggest">
|
||||
<p>Teaching in Da Nang and not listed here? Get in touch.</p>
|
||||
<a href="/connect" class="sfB-btn ghost">Contact Us</a>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer class="sfB-foot">
|
||||
<div><strong>Sabor Flow</strong> Da Nang — Latin dance community © <span id="footer-year">2025</span>
|
||||
</div>
|
||||
<nav class="foot-links">
|
||||
<a href="/">Home</a>
|
||||
<a href="/schedule">Schedule</a>
|
||||
<a href="/connect">Connect</a>
|
||||
<a href="/studios">Studios</a>
|
||||
<a href="/classes">Classes</a>
|
||||
<a href="/festivals">Festivals</a>
|
||||
</nav>
|
||||
<div class="foot-social">
|
||||
<a href="https://www.instagram.com/saborflowdanang/" target="_blank" rel="noopener">Instagram</a>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="../js/main.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user