🎂 Birthday Web — Panduan Edit

Struktur File

birthday-web/
├── index.html          ← Struktur halaman
├── css/style.css       ← Semua warna & animasi
├── js/
│   ├── app.js          ← Logic, navigasi, wishes
│   ├── floaties.js     ← Elemen lucu melayang
│   └── confetti.js     ← Confetti di halaman akhir
└── assets/
    ├── photo.jpg       ← 📸 Ganti ini!
    └── music.mp3       ← 🎵 Ganti ini!

---

✏️ Yang Perlu Diganti

Foto

Taruh foto di assets/photo.jpg — otomatis muncul bulat + border spin cantik.

Musik

Taruh MP3 di assets/music.mp3. Bisa juga pakai URL:

<source src="https://cdn.contoh.com/lagu.mp3" type="audio/mpeg" />

Nama (index.html)

<h2 class="name-tag" id="birthdayName">Nama Kamu</h2>

Umur (index.html)

<strong>21</strong> tahun

Pesan (index.html)

<p class="msg-text" id="msgText">
  Tulis pesan kamu di sini...
</p>

Nama pengirim (index.html)

<p class="msg-from">— dari <strong>Nama Pengirim</strong> yang sayang kamu 🌸</p>

Daftar Doa (js/app.js)

const WISHES = [
  { emoji: '💖', text: 'Selalu dicintai',  color: 'c-peach'  },
  { emoji: '🌸', text: 'Hidup mekar terus', color: 'c-lav'  },
  // tambah atau edit...
];
// Warna: c-peach / c-lav / c-mint / c-yellow

---

🎨 Ubah Warna

Edit CSS variables di css/style.css bagian :root:

--peach:    #FFB5A7;  /* peach / salmon */
--lavender: #C9B8F0;  /* ungu pastel    */
--mint:     #A8E6CF;  /* hijau mint      */
--yellow:   #FFE082;  /* kuning lembut  */

---

🚀 Cara Buka

Dobel klik index.html di browser. Atau upload ke Netlify / GitHub Pages buat dikirim lewat link!