Panduan Layout

Struktur Halaman Utama

Layout dashboard aplikasi menggunakan struktur Sidebar-Navbar-Content yang responsif.

1. Sidebar (Navigasi Kiri)

Area navigasi utama. Berisi menu-menu aplikasi.

• Desktop: Selalu tampil (fixed width).
• Mobile: Tersembunyi (off-canvas), dapat diakses melalui tombol hamburger menu.
• Warna: Menggunakan skema gelap (Slate-900) untuk kontras tinggi dengan konten.

2. Topbar (Header)

Berisi breadcrumb navigasi, notifikasi, dan profil pengguna. Sticky di bagian atas layar.

3. Content Area

Area kerja utama. Menggunakan container max-w-7xl agar nyaman dibaca pada layar lebar.

Komponen UI

Tombol (Buttons)

<button class="px-4 py-2 bg-indigo-600 text-white rounded-md">Primary</button>

Card (Kartu)

Digunakan untuk mengelompokkan konten terkait.

Palet Warna