131 lines
4.8 KiB
PHP
131 lines
4.8 KiB
PHP
<div>
|
|
<div class="row g-3 g-md-4 justify-content-center" style="display: flex; flex-wrap: wrap;" wire:poll>
|
|
|
|
@php
|
|
$menus = [
|
|
['route' => 'admin.statistik', 'icon' => 'bi-bar-chart-fill', 'color' => 'text-primary', 'title' => 'Statistik', 'desc' => 'Laporan Grafik', 'badge' => null],
|
|
['route' => 'admin.koleksi.index', 'icon' => 'bi-journal-bookmark-fill', 'color' => 'text-success', 'title' => 'Koleksi', 'desc' => 'Kumpulan Koleksi', 'badge' => null],
|
|
['route' => 'admin.anggota.index', 'icon' => 'bi-people-fill', 'color' => 'text-info', 'title' => 'Anggota', 'desc' => 'Daftar Anggota', 'badge' => $pendingMembers],
|
|
['route' => 'admin.peminjaman', 'icon' => 'bi-arrow-left-right', 'color' => 'text-warning', 'title' => 'Sirkulasi', 'desc' => 'Kelola Transaksi', 'badge' => $pendingLoans],
|
|
['route' => 'admin.system', 'icon' => 'bi-gear-wide-connected', 'color' => 'text-secondary', 'title' => 'Sistem', 'desc' => 'Pengaturan Admin', 'badge' => null],
|
|
['route' => 'admin.system', 'icon' => 'bi-book-half', 'color' => 'text-danger', 'title' => 'Panduan', 'desc' => 'Manual Book', 'badge' => null, 'target' => '_blank', 'asset' => 'pdf/ManualBook.pdf'],
|
|
];
|
|
@endphp
|
|
|
|
@foreach($menus as $menu)
|
|
|
|
{{-- Sembunyikan menu Sistem untuk admin biasa --}}
|
|
@if($menu['title'] == 'Sistem' && Auth::user()->role !== 'super_admin')
|
|
@continue
|
|
@endif
|
|
|
|
<div class="col-6 col-md-4 col-lg-2">
|
|
<a href="{{ isset($menu['asset']) ? asset($menu['asset']) : route($menu['route']) }}"
|
|
class="text-decoration-none h-100 d-block position-relative"
|
|
@if(isset($menu['target'])) target="{{ $menu['target'] }}" @endif>
|
|
|
|
{{-- Badge Notifikasi --}}
|
|
@if($menu['badge'] && $menu['badge'] > 0)
|
|
<span class="badge-floating {{ $menu['title'] == 'Sirkulasi' ? 'bg-warning text-dark' : 'bg-danger text-white' }}">
|
|
{{ $menu['badge'] }}
|
|
</span>
|
|
@endif
|
|
|
|
<div class="card-solid d-flex flex-column align-items-center justify-content-center">
|
|
<div class="icon-box mb-2">
|
|
<i class="bi {{ $menu['icon'] }} {{ $menu['color'] }} icon-size"></i>
|
|
</div>
|
|
<h6 class="menu-title">{{ $menu['title'] }}</h6>
|
|
<p class="menu-subtitle">{{ $menu['desc'] }}</p>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
@endforeach
|
|
|
|
</div>
|
|
|
|
<style>
|
|
/* Card Solid (Tidak Transparan) */
|
|
.card-solid {
|
|
background: #ffffff; /* Warna putih solid */
|
|
border: 2px solid #e9ecef;
|
|
border-radius: 18px;
|
|
padding: 20px 10px;
|
|
height: 100%;
|
|
min-height: 130px; /* Ukuran dibesarkan */
|
|
transition: all 0.3s ease;
|
|
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
|
|
}
|
|
|
|
.card-solid:hover {
|
|
transform: translateY(-8px);
|
|
border-color: #f89406; /* Warna orange identitas Anda */
|
|
box-shadow: 0 12px 20px rgba(0, 0, 0, 0.15);
|
|
}
|
|
|
|
/* Container Ikon */
|
|
.icon-box {
|
|
background: #f8f9fa;
|
|
padding: 10px;
|
|
border-radius: 12px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
/* Ukuran Ikon dibesarkan */
|
|
.icon-size {
|
|
font-size: 2.2rem;
|
|
}
|
|
|
|
/* Teks Menu lebih besar */
|
|
.menu-title {
|
|
font-weight: 800;
|
|
color: #212529;
|
|
margin-bottom: 2px;
|
|
font-size: 0.95rem; /* Ukuran naik */
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
}
|
|
|
|
.menu-subtitle {
|
|
font-size: 0.7rem; /* Ukuran naik */
|
|
color: #6c757d;
|
|
margin-bottom: 0;
|
|
font-weight: 500;
|
|
}
|
|
|
|
/* Badge Notifikasi */
|
|
.badge-floating {
|
|
position: absolute;
|
|
top: -8px;
|
|
right: 0px;
|
|
z-index: 10;
|
|
font-size: 0.75rem;
|
|
padding: 5px 10px;
|
|
border-radius: 50px;
|
|
font-weight: 900;
|
|
border: 2px solid #fff;
|
|
box-shadow: 0 4px 8px rgba(0,0,0,0.2);
|
|
}
|
|
.badge-floating {
|
|
/* ... kode sebelumnya ... */
|
|
animation: pulse-red 2s infinite;
|
|
}
|
|
|
|
@keyframes pulse-red {
|
|
0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 0, 0, 0.7); }
|
|
70% { transform: scale(1.1); box-shadow: 0 0 0 10px rgba(255, 0, 0, 0); }
|
|
100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 0, 0, 0); }
|
|
}
|
|
/* Responsif untuk Mobile agar tetap 2 kolom lurus */
|
|
@media (max-width: 576px) {
|
|
.card-solid { min-height: 110px; padding: 15px 5px; }
|
|
.icon-size { font-size: 1.8rem; }
|
|
.menu-title { font-size: 0.85rem; }
|
|
}
|
|
</style>
|
|
</div>
|
|
|