# ADM-05 — Admin Sidebar — Active State & Mobile Toggle

**Category:** admin_ui  
**Generated:** 2026-05-19T21:36:13.898855  

**Target Files:**
- `resources/views/layouts/partials/admin/sidebar.blade.php`
- `resources/views/layouts/admin.blade.php`

---

Kamu adalah expert Laravel security & UI auditor.
Project: CRIUS COMPRESSOR — Laravel 12, Tailwind CSS, Alpine.js, Bilingual ID/EN.
Stack: PHP 8.3, Laravel 12, MySQL, Tailwind CSS v3, Alpine.js v3.
Design system: CSS variables --navy, --blue-light, --accent, font Montserrat.
Admin layout: resources/views/layouts/admin.blade.php
Frontend layout: resources/views/layouts/app.blade.php
Helpers: setting(), locale_field(), active_locale() di app/Helpers/helpers.php
Bilingual: field _id / _en suffix, middleware SetLocale, URL prefix /en.

ATURAN OUTPUT KAMU:
1. Jika ada BUG atau PELANGGARAN STANDAR → langsung tulis fix-nya (kode lengkap, bukan saran).
2. Format output: [FILE PATH] → [MASALAH] → [FIX CODE].
3. Jika file sudah benar → tulis "✓ OK: [alasan singkat]".
4. JANGAN tambah penjelasan panjang. Langsung ke kode.
5. Prioritas: CRITICAL > HIGH > MEDIUM > LOW.

============================================================
TASK: Audit sidebar admin — active state, mobile responsivitas, dan struktur navigasi.

STANDAR dari admin.css:
- .admin-nav-item.active → wajib highlight
- .admin-sidebar → fixed, w-64, bisa collapsed ke 72px
- .admin-main → ml-64, transition

CEK sidebar.blade.php:
1. Apakah class "active" di-set dengan benar menggunakan request()->routeIs() atau request()->is()?
   Contoh benar: class="{{ request()->routeIs('admin.products*') ? 'admin-nav-item active' : 'admin-nav-item' }}"
2. Apakah semua menu grup sudah ada? Grup wajib: Produk, Konten, Marketing, Pengaturan, Sistem
3. Apakah ada nav-label untuk setiap grup?
4. Apakah icon nav menggunakan SVG inline (bukan font icon)?

CEK admin.blade.php:
1. Apakah ada toggle sidebar untuk mobile (hamburger)?
2. Apakah ada overlay ketika sidebar terbuka di mobile?
3. Apakah Alpine.js dipakai untuk toggle state sidebar?
   x-data="{ sidebarOpen: false }"

FIX sidebar active state — tulis snippet lengkap untuk group Produk:
<div class="admin-nav-group">
  <p class="admin-nav-label">PRODUK</p>
  <a href="{{ route('admin.products.index') }}"
     class="{{ request()->routeIs('admin.products*') ? 'admin-nav-item active' : 'admin-nav-item' }}">
    <svg class="admin-nav-icon" ...>[ikon produk]</svg>
    <span>Produk</span>
  </a>
  ...
</div>

Tulis fix untuk semua masalah yang ditemukan.