Galeri Gambar dan Lightbox Interaktif
Setiap gambar di dalam artikel dokumentasi secara otomatis dilengkapi fitur Lightbox Estetik. Klik gambar manapun untuk memperbesar tampilan, melihat dalam mode layar penuh, memperbesar zoom, atau berpindah gambar dengan tombol panah:
📊 Klik untuk memperbesar Dashboard Monitoring
💻 Klik untuk memperbesar Source Code Architecture
HTML
<div style="display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); margin: 1.5rem 0px;">
<div>
<img alt="Dashboard Monitoring Traffic WhatsApp Gateway" src="https://images.unsplash.com/photo-1551288049-bebda4e38f71?auto=format&fit=crop&w=800&q=80" style="height: 200px; margin: 0px; object-fit: cover; width: 100%;" />
<p class="text-xs text-slate-500 mt-1.5 text-center">📊 Klik untuk memperbesar Dashboard Monitoring</p>
</div>
<div>
<img alt="Tampilan Source Code Engine Microservice Node.js" src="https://images.unsplash.com/photo-1555066931-4365d14bab8c?auto=format&fit=crop&w=800&q=80" style="height: 200px; margin: 0px; object-fit: cover; width: 100%;" />
<p class="text-xs text-slate-500 mt-1.5 text-center">💻 Klik untuk memperbesar Source Code Architecture</p>
</div>
</div>