Industrial Step Loader

HTML_STRUCTURE

<div class='bh-load-v1-step'><div class='bh-v1-s active'></div><div class='bh-v1-s'></div><div class='bh-v1-s'></div></div>

CSS_STYLING

.bh-load-v1-step { display: flex; gap: 5px; } .bh-v1-s { width: 20px; height: 20px; border: 1px solid #333; } .bh-load-v1-step .active { background: #fff; animation: bh-v1-step-mov 1.5s infinite steps(3); } @keyframes bh-v1-step-mov { 0% { transform: translateX(0); } 100% { transform: translateX(75px); } }

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