novy/aplikasi-ketertiban
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Poles UI/UX premium: fondasi global

Browse Source 
- Font Plus Jakarta Sans (Google Fonts) menggantikan font sistem default
- Sidebar: brand area gradient + nama sekolah, nav aktif jadi pill gradient
  biru-indigo + chevron, label grup lebih elegan, footer badge NOCTKJ.net
- Topbar: sticky + backdrop-blur glass
- Background utama: gradient halus slate → biru samar
- Kartu standar premium (.card) + tombol (.btn-primary/.btn-outline) + input
  seragam di CSS; kartu utama halaman diseragamkan rounded-2xl
- Border global diselaraskan ke palet slate; scrollbar & seleksi teks premium
- Verifikasi: 29 test / 99 assertion, blade cache OK, vite build OK
This commit is contained in:
Novy San87
2026-08-03 14:27:03 +07:00
parent 279ef07ae2
commit 151a66639b
32 changed files with 317 additions and 277 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/settings/reset.blade.php
+16 -16
View File
@@ -47,7 +47,7 @@
@csrf
{{-- Selectable Data Cards --}}
<div class="bg-white rounded-2xl shadow-sm border border-gray-200 overflow-hidden mb-6">
<div class="bg-white rounded-2xl shadow-sm border border-slate-200 overflow-hidden mb-6">
<div class="px-6 py-4 border-b border-gray-100 flex items-center justify-between">
<div class="flex items-center gap-2.5">
<div class="w-8 h-8 rounded-lg bg-red-50 flex items-center justify-center">
@@ -68,7 +68,7 @@
<div class="p-5">
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-3">
{{-- Presensi --}}
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-gray-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-orange-300 has-[:checked]:bg-orange-50/50 transition-all select-none">
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-slate-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-orange-300 has-[:checked]:bg-orange-50/50 transition-all select-none">
<input type="checkbox" name="reset_items[]" value="attendances" class="reset-checkbox mt-0.5 w-4 h-4 rounded border-gray-300 text-orange-500 focus:ring-orange-400 focus:ring-offset-0 flex-shrink-0">
<div class="min-w-0">
<p class="text-sm font-semibold text-gray-900">Presensi</p>
@@ -77,7 +77,7 @@
</label>
{{-- Pelanggaran & Evidences --}}
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-gray-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-red-300 has-[:checked]:bg-red-50/50 transition-all select-none">
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-slate-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-red-300 has-[:checked]:bg-red-50/50 transition-all select-none">
<input type="checkbox" name="reset_items[]" value="violations" class="reset-checkbox mt-0.5 w-4 h-4 rounded border-gray-300 text-red-500 focus:ring-red-400 focus:ring-offset-0 flex-shrink-0">
<div class="min-w-0">
<p class="text-sm font-semibold text-gray-900">Pelanggaran</p>
@@ -85,7 +85,7 @@
</div>
</label>
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-gray-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-red-300 has-[:checked]:bg-red-50/50 transition-all select-none">
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-slate-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-red-300 has-[:checked]:bg-red-50/50 transition-all select-none">
<input type="checkbox" name="reset_items[]" value="evidences" class="reset-checkbox mt-0.5 w-4 h-4 rounded border-gray-300 text-red-500 focus:ring-red-400 focus:ring-offset-0 flex-shrink-0">
<div class="min-w-0">
<p class="text-sm font-semibold text-gray-900">Foto Bukti</p>
@@ -94,7 +94,7 @@
</label>
{{-- Surat Peringatan --}}
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-gray-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-red-300 has-[:checked]:bg-red-50/50 transition-all select-none">
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-slate-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-red-300 has-[:checked]:bg-red-50/50 transition-all select-none">
<input type="checkbox" name="reset_items[]" value="sp_letters" class="reset-checkbox mt-0.5 w-4 h-4 rounded border-gray-300 text-red-500 focus:ring-red-400 focus:ring-offset-0 flex-shrink-0">
<div class="min-w-0">
<p class="text-sm font-semibold text-gray-900">Surat Peringatan</p>
@@ -103,7 +103,7 @@
</label>
{{-- Notifikasi --}}
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-gray-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-red-300 has-[:checked]:bg-red-50/50 transition-all select-none">
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-slate-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-red-300 has-[:checked]:bg-red-50/50 transition-all select-none">
<input type="checkbox" name="reset_items[]" value="notifications" class="reset-checkbox mt-0.5 w-4 h-4 rounded border-gray-300 text-red-500 focus:ring-red-400 focus:ring-offset-0 flex-shrink-0">
<div class="min-w-0">
<p class="text-sm font-semibold text-gray-900">Notifikasi</p>
@@ -112,7 +112,7 @@
</label>
{{-- Data Siswa --}}
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-gray-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-red-300 has-[:checked]:bg-red-50/50 transition-all select-none">
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-slate-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-red-300 has-[:checked]:bg-red-50/50 transition-all select-none">
<input type="checkbox" name="reset_items[]" value="students" class="reset-checkbox mt-0.5 w-4 h-4 rounded border-gray-300 text-red-500 focus:ring-red-400 focus:ring-offset-0 flex-shrink-0">
<div class="min-w-0">
<p class="text-sm font-semibold text-gray-900">Siswa</p>
@@ -121,7 +121,7 @@
</label>
{{-- Kelas --}}
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-gray-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-red-300 has-[:checked]:bg-red-50/50 transition-all select-none">
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-slate-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-red-300 has-[:checked]:bg-red-50/50 transition-all select-none">
<input type="checkbox" name="reset_items[]" value="classes" class="reset-checkbox mt-0.5 w-4 h-4 rounded border-gray-300 text-red-500 focus:ring-red-400 focus:ring-offset-0 flex-shrink-0">
<div class="min-w-0">
<p class="text-sm font-semibold text-gray-900">Kelas</p>
@@ -130,7 +130,7 @@
</label>
{{-- Kategori Pelanggaran --}}
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-gray-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-orange-300 has-[:checked]:bg-orange-50/50 transition-all select-none">
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-slate-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-orange-300 has-[:checked]:bg-orange-50/50 transition-all select-none">
<input type="checkbox" name="reset_items[]" value="categories" class="reset-checkbox mt-0.5 w-4 h-4 rounded border-gray-300 text-orange-500 focus:ring-orange-400 focus:ring-offset-0 flex-shrink-0">
<div class="min-w-0">
<p class="text-sm font-semibold text-gray-900">Kategori Pelanggaran</p>
@@ -140,7 +140,7 @@
</label>
{{-- Jenis Pelanggaran --}}
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-gray-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-orange-300 has-[:checked]:bg-orange-50/50 transition-all select-none">
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-slate-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-orange-300 has-[:checked]:bg-orange-50/50 transition-all select-none">
<input type="checkbox" name="reset_items[]" value="types" class="reset-checkbox mt-0.5 w-4 h-4 rounded border-gray-300 text-orange-500 focus:ring-orange-400 focus:ring-offset-0 flex-shrink-0">
<div class="min-w-0">
<p class="text-sm font-semibold text-gray-900">Jenis Pelanggaran</p>
@@ -149,7 +149,7 @@
</label>
{{-- Ambang SP --}}
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-gray-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-orange-300 has-[:checked]:bg-orange-50/50 transition-all select-none">
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-slate-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-orange-300 has-[:checked]:bg-orange-50/50 transition-all select-none">
<input type="checkbox" name="reset_items[]" value="thresholds" class="reset-checkbox mt-0.5 w-4 h-4 rounded border-gray-300 text-orange-500 focus:ring-orange-400 focus:ring-offset-0 flex-shrink-0">
<div class="min-w-0">
<p class="text-sm font-semibold text-gray-900">Ambang SP</p>
@@ -159,7 +159,7 @@
</label>
{{-- Pengaturan --}}
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-gray-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-purple-300 has-[:checked]:bg-purple-50/50 transition-all select-none">
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-slate-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-purple-300 has-[:checked]:bg-purple-50/50 transition-all select-none">
<input type="checkbox" name="reset_items[]" value="settings" class="reset-checkbox mt-0.5 w-4 h-4 rounded border-gray-300 text-purple-500 focus:ring-purple-400 focus:ring-offset-0 flex-shrink-0">
<div class="min-w-0">
<p class="text-sm font-semibold text-gray-900">Pengaturan</p>
@@ -169,7 +169,7 @@
</label>
{{-- Penanganan --}}
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-gray-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-amber-300 has-[:checked]:bg-amber-50/50 transition-all select-none">
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-slate-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-amber-300 has-[:checked]:bg-amber-50/50 transition-all select-none">
<input type="checkbox" name="reset_items[]" value="handlings" class="reset-checkbox mt-0.5 w-4 h-4 rounded border-gray-300 text-amber-500 focus:ring-amber-400 focus:ring-offset-0 flex-shrink-0">
<div class="min-w-0">
<p class="text-sm font-semibold text-gray-900">Riwayat Penanganan</p>
@@ -179,7 +179,7 @@
</label>
{{-- Backup Files --}}
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-gray-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-sky-300 has-[:checked]:bg-sky-50/50 transition-all select-none">
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-slate-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-sky-300 has-[:checked]:bg-sky-50/50 transition-all select-none">
<input type="checkbox" name="reset_items[]" value="backups" class="reset-checkbox mt-0.5 w-4 h-4 rounded border-gray-300 text-sky-500 focus:ring-sky-400 focus:ring-offset-0 flex-shrink-0">
<div class="min-w-0">
<p class="text-sm font-semibold text-gray-900">File Backup</p>
@@ -189,7 +189,7 @@
</label>
{{-- User Lain --}}
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-gray-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-red-300 has-[:checked]:bg-red-50/50 transition-all select-none">
<label class="reset-card relative flex items-start gap-3 p-4 rounded-xl border border-slate-200 cursor-pointer hover:border-gray-300 has-[:checked]:border-red-300 has-[:checked]:bg-red-50/50 transition-all select-none">
<input type="checkbox" name="reset_items[]" value="users" class="reset-checkbox mt-0.5 w-4 h-4 rounded border-gray-300 text-red-500 focus:ring-red-400 focus:ring-offset-0 flex-shrink-0">
<div class="min-w-0">
<p class="text-sm font-semibold text-gray-900">User Lain</p>
@@ -201,7 +201,7 @@
</div>
{{-- Confirm Form --}}
<div class="bg-white rounded-2xl shadow-sm border border-gray-200 overflow-hidden">
<div class="bg-white rounded-2xl shadow-sm border border-slate-200 overflow-hidden">
<div class="px-6 py-4 border-b border-gray-100">
<div class="flex items-center gap-2.5">
<div class="w-8 h-8 rounded-lg bg-gray-50 flex items-center justify-center">