Minimalist Stepper

HTML_STRUCTURE

<div class='bh-nav-v2-step'><div class='bh-v2-s done'></div><div class='bh-v2-s active'></div><div class='bh-v2-s'></div></div>

CSS_STYLING

.bh-nav-v2-step { display: flex; gap: 15px; align-items: center; } .bh-v2-s { width: 30px; height: 4px; background: #111; transition: 0.3s; } .bh-v2-s.active { background: #fff; box-shadow: 0 0 10px rgba(255,255,255,0.3); } .bh-v2-s.done { background: #00ff88; }

// DESIGN_NOTES: Komponen ini menggunakan CSS variabel untuk memudahkan kustomisasi warna dan transisi.