oke mantap lanjut👍🤙

This commit is contained in:
ghozahimma65 2026-04-08 01:12:54 +07:00
parent 885f55c0f5
commit 4db17667aa
16 changed files with 621 additions and 250 deletions

View File

@ -1,13 +1,27 @@
@extends('layouts.app')
@section('content')
<div class="bg-white shadow-md rounded-lg p-6">
<div class="flex justify-between items-center mb-4">
<h1 class="text-xl font-semibold text-gray-700">👨‍🏫 Data Guru</h1>
<a href="{{ route('guru.create') }}" class="bg-green-600 text-white px-4 py-2 rounded hover:bg-green-700">+ Tambah Guru</a>
<div class="bg-white shadow-md rounded-2xl border border-[#e1f0e8] overflow-hidden">
<!-- Header Section -->
<div class="flex flex-col md:flex-row justify-between items-start md:items-center bg-gradient-to-br from-green-600 to-teal-700 p-8 shadow-inner relative overflow-hidden">
<!-- Decorative inner pattern -->
<div class="absolute inset-0 bg-[url('https://www.transparenttextures.com/patterns/cubes.png')] opacity-10 mix-blend-overlay"></div>
<div class="relative z-10">
<h1 class="text-2xl font-extrabold text-white flex items-center drop-shadow">
<span class="bg-white/20 text-white p-2.5 rounded-xl mr-4 backdrop-blur-md"><i class="fas fa-chalkboard-teacher"></i></span> Data Guru
</h1>
<p class="text-green-50 mt-2 ml-14 font-medium drop-shadow-sm">Kelola informasi tenaga pengajar PAUD.</p>
</div>
<div class="mt-6 md:mt-0 relative z-10">
<a href="{{ route('guru.create') }}" class="inline-flex items-center gap-2 bg-white text-green-700 px-6 py-3 rounded-xl hover:bg-green-50 font-bold text-sm shadow-lg transition-all hover:-translate-y-1">
<i class="fas fa-plus"></i> Tambah Guru
</a>
</div>
</div>
<table class="w-full border-collapse">
<div class="p-6">
<div class="overflow-x-auto">
<table class="w-full border-collapse">
<thead>
<tr class="bg-green-600 text-white text-left">
<th class="p-2">#</th>
@ -51,5 +65,7 @@
@endforelse
</tbody>
</table>
</div>
</div>
</div>
@endsection

View File

@ -1,13 +1,27 @@
@extends('layouts.app')
@section('content')
<div class="bg-white shadow-md rounded p-6">
<div class="flex justify-between items-center mb-4">
<h1 class="text-xl font-semibold">📢 Pengumuman</h1>
<a href="{{ route('pengumuman.create') }}" class="bg-green-600 text-white px-4 py-2 rounded hover:bg-green-700">+ Tambah</a>
<div class="bg-white shadow-md rounded-2xl border border-[#e1f0e8] overflow-hidden">
<!-- Header Section -->
<div class="flex flex-col md:flex-row justify-between items-start md:items-center bg-gradient-to-br from-green-600 to-teal-700 p-8 shadow-inner relative overflow-hidden">
<!-- Decorative inner pattern -->
<div class="absolute inset-0 bg-[url('https://www.transparenttextures.com/patterns/cubes.png')] opacity-10 mix-blend-overlay"></div>
<div class="relative z-10">
<h1 class="text-2xl font-extrabold text-white flex items-center drop-shadow">
<span class="bg-white/20 text-white p-2.5 rounded-xl mr-4 backdrop-blur-md"><i class="fas fa-bullhorn"></i></span> Menu Pengumuman
</h1>
<p class="text-green-50 mt-2 ml-14 font-medium drop-shadow-sm">Kelola informasi dan pengumuman untuk seluruh pihak.</p>
</div>
<div class="mt-6 md:mt-0 relative z-10">
<a href="{{ route('pengumuman.create') }}" class="inline-flex items-center gap-2 bg-white text-green-700 px-6 py-3 rounded-xl hover:bg-green-50 font-bold text-sm shadow-lg transition-all hover:-translate-y-1">
<i class="fas fa-plus"></i> Tambah Pengumuman
</a>
</div>
</div>
<table class="w-full border-collapse">
<div class="p-6">
<div class="overflow-x-auto">
<table class="w-full border-collapse">
<thead>
<tr class="bg-green-600 text-white">
<th class="p-2">#</th>
@ -42,5 +56,7 @@
@endforeach
</tbody>
</table>
</div>
</div>
</div>
@endsection

View File

@ -1,59 +1,57 @@
@extends('layouts.app')
@section('content')
<div class="container mx-auto px-4">
<div class="flex flex-col md:flex-row justify-between items-center mb-6 mt-6">
<div class="bg-white shadow-md rounded-2xl p-6 border border-[#e1f0e8]">
<div class="flex flex-col md:flex-row justify-between items-start md:items-center mb-6 border-b border-[#e1f0e8] pb-4">
<div>
<h1 class="text-2xl font-bold text-gray-800">🛵 Log Penjemputan</h1>
<p class="text-gray-500 text-sm mt-1">Daftar riwayat penjemputan siswa (Real-time).</p>
<h1 class="text-2xl font-extrabold text-gray-800 flex items-center">
<span class="bg-green-100 text-green-700 p-2 rounded-xl mr-3"><i class="fas fa-bus"></i></span> Log Penjemputan
</h1>
<p class="text-sm text-gray-500 mt-1 ml-12">Daftar riwayat penjemputan siswa (Real-time).</p>
</div>
<div class="flex gap-3">
<div class="bg-blue-50 text-blue-700 px-4 py-2 rounded-lg text-sm font-semibold border border-blue-100">
Hari Ini: {{ $logs->where('waktu_jemput', '>=', now()->today())->count() }}
</div>
<div class="mt-4 md:mt-0 flex items-center bg-green-50 text-green-800 px-4 py-2.5 rounded-xl font-bold text-sm border border-green-100 shadow-sm">
<i class="fas fa-calendar-day mr-2 text-green-500"></i> Hari Ini: {{ $logs->where('waktu_jemput', '>=', now()->today())->count() }}
</div>
</div>
<div class="bg-white shadow-md rounded-xl overflow-hidden border border-gray-100">
<div class="overflow-x-auto">
<table class="w-full text-left border-collapse">
<thead>
<tr class="bg-gray-100 text-gray-600 uppercase text-xs tracking-wider border-b border-gray-200">
<th class="p-4 font-bold">Waktu Jemput</th>
<th class="p-4 font-bold">Nama Siswa</th>
<th class="p-4 font-bold">Nama Penjemput</th>
<th class="p-4 font-bold text-center">Status Hubungan</th>
<th class="p-4 font-bold text-center">Aksi</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-50">
@forelse($logs as $log)
<tr class="hover:bg-blue-50 transition duration-150 group">
<td class="p-4 whitespace-nowrap">
<div class="text-gray-800 font-semibold">
{{ \Carbon\Carbon::parse($log->waktu_jemput)->timezone('Asia/Jakarta')->format('H:i') }} WIB
</div>
<div class="text-xs text-gray-500">
{{ \Carbon\Carbon::parse($log->waktu_jemput)->timezone('Asia/Jakarta')->format('d M Y') }}
</div>
</td>
<td class="p-4">
<div class="font-bold text-gray-800">{{ $log->siswa->nama_siswa ?? 'Siswa Terhapus' }}</div>
<div class="text-xs text-gray-500">NIS: {{ $log->siswa->nis ?? '-' }}</div>
</td>
<div class="overflow-x-auto">
<table class="w-full text-left border-collapse">
<thead>
<tr class="bg-gray-100 text-gray-600 uppercase text-xs tracking-wider border-b border-gray-200">
<th class="p-4 font-bold">Waktu Jemput</th>
<th class="p-4 font-bold">Nama Siswa</th>
<th class="p-4 font-bold">Nama Penjemput</th>
<th class="p-4 font-bold text-center">Status Hubungan</th>
<th class="p-4 font-bold text-center">Aksi</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-50">
@forelse($logs as $log)
<tr class="hover:bg-green-50/50 transition duration-150 group">
<td class="p-4 whitespace-nowrap">
<div class="text-gray-800 font-semibold">
{{ \Carbon\Carbon::parse($log->waktu_jemput)->timezone('Asia/Jakarta')->format('H:i') }} WIB
</div>
<div class="text-xs text-gray-500">
{{ \Carbon\Carbon::parse($log->waktu_jemput)->timezone('Asia/Jakarta')->format('d M Y') }}
</div>
</td>
<td class="p-4">
<div class="font-bold text-gray-800">{{ $log->siswa->nama_siswa ?? 'Siswa Terhapus' }}</div>
<div class="text-xs text-gray-500">NIS: {{ $log->siswa->nis ?? '-' }}</div>
</td>
<td class="p-4 text-gray-700 font-medium">
{{ $log->nama_penjemput }}
</td>
<td class="p-4 text-gray-700 font-medium">
{{ $log->nama_penjemput }}
</td>
<td class="p-4 text-center">
<span class="inline-block px-3 py-1 rounded-full text-xs font-bold bg-blue-100 text-blue-700 border border-blue-200">
{{ $log->status_hubungan }}
</span>
</td>
<td class="p-4 text-center">
<span class="inline-block px-3 py-1 rounded-full text-xs font-bold bg-green-100 text-green-700 border border-green-200 shadow-sm">
{{ $log->status_hubungan }}
</span>
</td>
<td class="p-4 text-center">
<form action="{{ route('penjemputan.destroy', $log->id) }}" method="POST" onsubmit="return confirm('Hapus data log ini?');">
@ -80,6 +78,5 @@
</tbody>
</table>
</div>
</div>
</div>
@endsection

View File

@ -1,19 +1,25 @@
@extends('layouts.app')
@section('content')
<div class="container mx-auto px-4">
<div class="mb-6 flex justify-between items-center">
<div>
<h1 class="text-2xl font-bold text-gray-800">📈 Laporan Perkembangan</h1>
<p class="text-gray-600 text-sm mt-1">Pilih siswa untuk melihat Catatan Anekdot, Hasil Karya, dan Ceklis.</p>
<div class="bg-white shadow-md rounded-2xl border border-[#e1f0e8] overflow-hidden">
<!-- Header Section -->
<div class="flex flex-col md:flex-row justify-between items-start md:items-center bg-gradient-to-br from-green-600 to-teal-700 p-8 shadow-inner relative overflow-hidden">
<!-- Decorative inner pattern -->
<div class="absolute inset-0 bg-[url('https://www.transparenttextures.com/patterns/cubes.png')] opacity-10 mix-blend-overlay"></div>
<div class="relative z-10">
<h1 class="text-2xl font-extrabold text-white flex items-center drop-shadow">
<span class="bg-white/20 text-white p-2.5 rounded-xl mr-4 backdrop-blur-md"><i class="fas fa-chart-line"></i></span> Laporan Perkembangan
</h1>
<p class="text-green-50 mt-2 ml-14 font-medium drop-shadow-sm">Pilih siswa untuk melihat Catatan Anekdot, Hasil Karya, dan Ceklis.</p>
</div>
<div class="bg-green-100 text-green-800 px-4 py-2 rounded-lg font-bold text-sm">
Total Siswa: {{ $siswas->count() }}
<div class="mt-6 md:mt-0 relative z-10 flex items-center bg-white text-green-800 px-5 py-3 rounded-xl font-bold text-sm shadow-lg">
<i class="fas fa-users mr-2 text-green-500"></i> Total Siswa: {{ $siswas->count() }}
</div>
</div>
<div class="bg-white shadow-md rounded-lg overflow-hidden">
<table class="min-w-full bg-white">
<div class="p-6">
<div class="overflow-x-auto">
<table class="w-full border-collapse">
<thead class="bg-green-600 text-white">
<tr>
<th class="py-3 px-4 text-left uppercase font-semibold text-sm">No</th>
@ -59,11 +65,12 @@
</td>
</tr>
@endforelse
</tbody>
</table>
</tbody>
</table>
</div>
</div>
<div class="mt-4 text-center text-xs text-gray-400">
<div class="mt-4 pb-6 text-center text-xs text-gray-400">
&copy; {{ date('Y') }} PAUD Aisyiyah Monitoring System
</div>
</div>

View File

@ -1,21 +1,34 @@
@extends('layouts.app')
@section('content')
<div class="container mx-auto px-4">
<div class="flex justify-between items-center mb-6">
<h1 class="text-2xl font-bold text-gray-800">👶 Data Peserta Didik</h1>
<a href="{{ route('siswa.create') }}" class="bg-green-600 hover:bg-green-700 text-white font-bold py-2 px-4 rounded shadow-lg transition duration-200">
+ Tambah Siswa
</a>
<div class="bg-white shadow-md rounded-2xl border border-[#e1f0e8] overflow-hidden">
<!-- Header Section -->
<div class="flex flex-col md:flex-row justify-between items-start md:items-center bg-gradient-to-br from-green-600 to-teal-700 p-8 shadow-inner relative overflow-hidden">
<!-- Decorative inner pattern -->
<div class="absolute inset-0 bg-[url('https://www.transparenttextures.com/patterns/cubes.png')] opacity-10 mix-blend-overlay"></div>
<div class="relative z-10">
<h1 class="text-2xl font-extrabold text-white flex items-center drop-shadow">
<span class="bg-white/20 text-white p-2.5 rounded-xl mr-4 backdrop-blur-md"><i class="fas fa-child"></i></span> Data Peserta Didik
</h1>
<p class="text-green-50 mt-2 ml-14 font-medium drop-shadow-sm">Manajemen data peserta didik PAUD.</p>
</div>
<div class="mt-6 md:mt-0 relative z-10">
<a href="{{ route('siswa.create') }}" class="inline-flex items-center gap-2 bg-white text-green-700 px-6 py-3 rounded-xl hover:bg-green-50 font-bold text-sm shadow-lg transition-all hover:-translate-y-1">
<i class="fas fa-plus"></i> Tambah Siswa
</a>
</div>
</div>
<div class="p-6">
@if(session('success'))
<div class="bg-green-100 border-l-4 border-green-500 text-green-700 p-4 mb-4" role="alert">
<p>{{ session('success') }}</p>
<div class="bg-green-50/50 border border-green-200 text-green-700 p-4 mb-6 rounded-xl flex items-center shadow-sm" role="alert">
<i class="fas fa-check-circle mr-3 text-xl text-green-500"></i>
<p class="font-medium">{{ session('success') }}</p>
</div>
@endif
<div class="bg-white shadow-md rounded-lg overflow-hidden">
<div class="overflow-x-auto">
<table class="min-w-full bg-white">
<thead class="bg-green-600 text-white">
<tr>
@ -86,7 +99,8 @@
</tr>
@endforelse
</tbody>
</table>
</table>
</div>
</div>
</div>
@endsection

View File

@ -1,13 +1,27 @@
@extends('layouts.app')
@section('content')
<div class="bg-white shadow-md rounded-lg p-6">
<div class="flex justify-between items-center mb-4">
<h1 class="text-xl font-semibold text-gray-700">👪 Data Wali Murid</h1>
<a href="{{ route('wali.create') }}" class="bg-green-600 text-white px-4 py-2 rounded hover:bg-green-700">+ Tambah Wali</a>
<div class="bg-white shadow-md rounded-2xl border border-[#e1f0e8] overflow-hidden">
<!-- Header Section -->
<div class="flex flex-col md:flex-row justify-between items-start md:items-center bg-gradient-to-br from-green-600 to-teal-700 p-8 shadow-inner relative overflow-hidden">
<!-- Decorative inner pattern -->
<div class="absolute inset-0 bg-[url('https://www.transparenttextures.com/patterns/cubes.png')] opacity-10 mix-blend-overlay"></div>
<div class="relative z-10">
<h1 class="text-2xl font-extrabold text-white flex items-center drop-shadow">
<span class="bg-white/20 text-white p-2.5 rounded-xl mr-4 backdrop-blur-md"><i class="fas fa-users"></i></span> Data Wali Murid
</h1>
<p class="text-green-50 mt-2 ml-14 font-medium drop-shadow-sm">Kelola informasi orang tua / wali peserta didik.</p>
</div>
<div class="mt-6 md:mt-0 relative z-10">
<a href="{{ route('wali.create') }}" class="inline-flex items-center gap-2 bg-white text-green-700 px-6 py-3 rounded-xl hover:bg-green-50 font-bold text-sm shadow-lg transition-all hover:-translate-y-1">
<i class="fas fa-plus"></i> Tambah Wali
</a>
</div>
</div>
<table class="w-full border-collapse">
<div class="p-6">
<div class="overflow-x-auto">
<table class="w-full border-collapse">
<thead>
<tr class="bg-green-600 text-white text-left">
<th class="p-2">No</th>
@ -40,5 +54,7 @@
@endforelse
</tbody>
</table>
</div>
</div>
</div>
@endsection

View File

@ -1,52 +1,104 @@
<!DOCTYPE html>
<html lang="en">
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Login - Simpaud</title>
<title>Login - Simpaud Kartoharjo</title>
<!-- Google Fonts: Plus Jakarta Sans -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
<script src="https://cdn.tailwindcss.com"></script>
<script>
tailwind.config = {
theme: {
extend: {
fontFamily: { sans: ['"Plus Jakarta Sans"', 'sans-serif'] },
}
}
}
</script>
<style>
body { font-family: 'Plus Jakarta Sans', sans-serif; }
.mesh-bg {
background-color: #f2f8f5;
background-image:
radial-gradient(at 40% 20%, #c5e2d4 0px, transparent 50%),
radial-gradient(at 80% 0%, #e1f0e8 0px, transparent 50%),
radial-gradient(at 0% 50%, #d4ebe0 0px, transparent 50%),
radial-gradient(at 80% 50%, #b7dac9 0px, transparent 50%),
radial-gradient(at 0% 100%, #e1f0e8 0px, transparent 50%),
radial-gradient(at 80% 100%, #c5e2d4 0px, transparent 50%),
radial-gradient(at 0% 0%, #f2f8f5 0px, transparent 50%);
}
</style>
</head>
<body class="h-screen flex items-center justify-center bg-gradient-to-br from-green-400 via-green-500 to-green-700">
<body class="h-screen flex items-center justify-center mesh-bg relative overflow-hidden">
<div class="bg-white rounded-2xl shadow-2xl w-full max-w-5xl flex flex-col md:flex-row overflow-hidden">
<!-- Decorative floating elements -->
<div class="absolute top-10 left-10 w-72 h-72 bg-green-200/50 rounded-full mix-blend-multiply filter blur-3xl opacity-70 animate-pulse"></div>
<div class="absolute bottom-10 right-10 w-72 h-72 bg-teal-200/50 rounded-full mix-blend-multiply filter blur-3xl opacity-70 animate-pulse" style="animation-delay: 2s;"></div>
<div class="bg-[#f0f9f4]/80 backdrop-blur-xl rounded-[2rem] shadow-[0_8px_30px_rgb(0,0,0,0.04)] border border-green-100 w-full max-w-5xl flex flex-col md:flex-row overflow-hidden relative z-10 m-4">
<!-- Left Side (hidden di HP, tampil di desktop) -->
<div class="hidden md:flex w-1/2 bg-gradient-to-br from-green-500 to-green-700 text-white p-10 flex-col justify-center">
<h2 class="text-3xl font-bold">Selamat Datang</h2>
<p class="mt-4 text-lg">Silahkan login untuk mengakses dashboard admin Simpaud Kartoharjo</p>
<!-- Ganti logo -->
<img src="{{ asset('images/logo.png') }}" alt="logo" class="mt-10 w-40 mx-auto animate-pulse">
<div class="hidden md:flex w-1/2 bg-gradient-to-br from-green-500/90 to-teal-600/90 text-white p-12 flex-col justify-center relative overflow-hidden">
<!-- inner flare -->
<div class="absolute inset-0 bg-[url('https://www.transparenttextures.com/patterns/cubes.png')] opacity-10 mix-blend-overlay"></div>
<div class="relative z-10 flex flex-col items-center text-center">
<img src="{{ asset('images/logo.png') }}" alt="logo" class="w-32 h-32 object-contain mb-8 drop-shadow-lg">
<h2 class="text-4xl font-extrabold tracking-tight mb-4">Selamat Datang</h2>
<p class="text-lg text-green-50 font-medium leading-relaxed max-w-sm">
Sistem Informasi Monitoring dan Manajemen PAUD Terpadu Kartoharjo.
</p>
<div class="mt-8 flex items-center space-x-2 text-green-100 text-sm justify-center">
<span class="w-8 h-px bg-green-200/50"></span>
<span>Akses khusus staf & admin</span>
<span class="w-8 h-px bg-green-200/50"></span>
</div>
</div>
</div>
<!-- Right Side (Form Login) -->
<div class="w-full md:w-1/2 p-10 flex flex-col justify-center">
<h2 class="text-2xl font-bold text-gray-800 mb-6 text-center md:text-left">Sign In</h2>
<div class="w-full md:w-1/2 p-10 lg:p-14 flex flex-col justify-center bg-[#e8f5ed]/30 backdrop-blur-md">
<div class="mb-8">
<h2 class="text-3xl font-extrabold text-gray-800 tracking-tight">Sign In</h2>
<p class="text-gray-500 mt-2 font-medium">Masuk untuk melanjutkan ke dashboard.</p>
</div>
<form method="POST" action="{{ route('login') }}" class="space-y-5">
<form method="POST" action="{{ route('login') }}" class="space-y-6">
@csrf
<div>
<label class="block text-sm font-semibold text-gray-600">Email</label>
<input type="text" name="email" required
class="w-full mt-2 px-4 py-2 rounded-lg border focus:ring-2 focus:ring-green-400 outline-none">
<label class="block text-sm font-semibold text-gray-700 mb-2">Alamat Email</label>
<input type="email" name="email" required placeholder="admin@simpaud.com"
class="w-full px-5 py-3.5 bg-[#f0f9f4]/80 border border-green-200 rounded-xl focus:bg-white focus:ring-2 focus:ring-green-400 focus:border-green-400 outline-none transition-all shadow-sm text-gray-700">
</div>
<div>
<label class="block text-sm font-semibold text-gray-600">Password</label>
<input type="password" name="password" required
class="w-full mt-2 px-4 py-2 rounded-lg border focus:ring-2 focus:ring-green-400 outline-none">
<label class="block text-sm font-semibold text-gray-700 mb-2">Kata Sandi</label>
<input type="password" name="password" required placeholder="••••••••"
class="w-full px-5 py-3.5 bg-[#f0f9f4]/80 border border-green-200 rounded-xl focus:bg-white focus:ring-2 focus:ring-green-400 focus:border-green-400 outline-none transition-all shadow-sm text-gray-700">
</div>
@if (session('error'))
<div style="color:red;">{{ session('error') }}</div>
@endif
@if (session('error'))
<div class="p-4 bg-red-50 border-l-4 border-red-500 rounded-r-xl">
<p class="text-sm font-medium text-red-700">{{ session('error') }}</p>
</div>
@endif
<button type="submit"
class="w-full py-3 rounded-lg bg-gradient-to-r from-green-400 to-green-600 text-white font-bold shadow-lg hover:opacity-90 transition">
Login
class="w-full py-3.5 mt-4 rounded-xl bg-green-600 text-white font-bold tracking-wide shadow-[0_4px_14px_0_rgba(22,163,74,0.39)] hover:bg-green-700 hover:shadow-[0_6px_20px_rgba(22,163,74,0.23)] hover:-translate-y-0.5 transition-all duration-200">
Masuk ke Sistem
</button>
</form>
<p class="text-sm text-gray-500 mt-6 text-center md:text-left">© 2025 Simpaud Kartoharjo</p>
<div class="mt-auto pt-10 text-center md:text-left">
<p class="text-sm text-gray-400 font-medium tracking-wide">© 2026 Simpaud Kartoharjo.</p>
</div>
</div>
</div>

View File

@ -1,99 +1,149 @@
@extends('layouts.app')
@section('content')
<div class="py-12">
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
<div class="py-6">
<div class="max-w-7xl mx-auto space-y-8">
<div class="flex justify-between items-center mb-6">
<div>
<h2 class="text-2xl font-bold text-gray-800">📊 Dashboard Utama</h2>
<p class="text-sm text-gray-500">Ringkasan aktivitas dan informasi sekolah.</p>
<!-- Header Section -->
<div class="flex flex-col md:flex-row justify-between items-start md:items-center bg-gradient-to-br from-green-600 to-teal-700 p-8 rounded-2xl shadow-lg relative overflow-hidden">
<!-- Decorative inner pattern -->
<div class="absolute inset-0 bg-white/5 bg-[url('https://www.transparenttextures.com/patterns/cubes.png')] opacity-20 mix-blend-overlay"></div>
<div class="relative z-10">
<h2 class="text-3xl font-extrabold text-white flex items-center drop-shadow-md">
<span class="bg-white/20 text-white p-2.5 rounded-xl mr-4 backdrop-blur-sm"><i class="fas fa-chart-pie"></i></span>
Dashboard Utama
</h2>
<p class="text-green-50 text-base mt-2 ml-14 font-medium drop-shadow">Ringkasan aktivitas dan informasi sekolah terkini.</p>
</div>
@if(Auth::user()->role == 'admin')
<a href="{{ route('pengumuman.index') }}" class="bg-indigo-600 text-white px-4 py-2 rounded shadow hover:bg-indigo-700 text-sm font-bold flex items-center gap-2">
<span>📢</span> Buat Pengumuman
</a>
<div class="mt-6 md:mt-0 relative z-10">
<a href="{{ route('pengumuman.index') }}" class="group flex items-center gap-2 bg-white text-green-700 px-6 py-3 rounded-xl shadow-lg hover:shadow-xl hover:bg-green-50 font-bold text-sm transition-all hover:-translate-y-1">
<i class="fas fa-bullhorn group-hover:scale-110 transition-transform"></i>
<span>Buat Pengumuman</span>
</a>
</div>
@endif
</div>
<div class="mb-8">
<h3 class="text-lg font-bold text-gray-700 mb-3 flex items-center">
<svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5.882V19.24a1.76 1.76 0 01-3.417.592l-2.147-6.15M18 13a3 3 0 100-6M5.436 13.683A4.001 4.001 0 017 6h1.832c4.1 0 7.625-1.234 9.168-3v14c-1.543-1.766-5.067-3-9.168-3H7a3.988 3.988 0 01-1.564-.317z"></path></svg>
Papan Pengumuman
</h3>
<!-- Stats Grid -->
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
<div class="bg-white overflow-hidden rounded-2xl p-6 border border-[#e1f0e8] relative group hover:shadow-md transition-shadow">
<div class="absolute top-0 right-0 p-4 opacity-10 group-hover:opacity-20 transition-opacity">
<i class="fas fa-child text-6xl text-teal-600"></i>
</div>
<div class="text-green-500/80 text-xs font-bold tracking-widest uppercase mb-1">Total Siswa</div>
<div class="text-4xl font-extrabold text-gray-800 flex items-baseline">
{{ $totalSiswa }} <span class="text-sm text-gray-400 font-medium ml-2">Anak</span>
</div>
</div>
<div class="bg-white overflow-hidden rounded-2xl p-6 border border-[#e1f0e8] relative group hover:shadow-md transition-shadow">
<div class="absolute top-0 right-0 p-4 opacity-10 group-hover:opacity-20 transition-opacity">
<i class="fas fa-chalkboard-teacher text-6xl text-green-600"></i>
</div>
<div class="text-green-500/80 text-xs font-bold tracking-widest uppercase mb-1">Total Guru</div>
<div class="text-4xl font-extrabold text-gray-800 flex items-baseline">
{{ $totalGuru }} <span class="text-sm text-gray-400 font-medium ml-2">Pengajar</span>
</div>
</div>
<div class="bg-white overflow-hidden rounded-2xl p-6 border border-[#e1f0e8] relative group hover:shadow-md transition-shadow">
<div class="absolute top-0 right-0 p-4 opacity-10 group-hover:opacity-20 transition-opacity">
<i class="fas fa-door-open text-6xl text-emerald-600"></i>
</div>
<div class="text-green-500/80 text-xs font-bold tracking-widest uppercase mb-1">Total Kelas</div>
<div class="text-4xl font-extrabold text-gray-800 flex items-baseline">
{{ $totalKelas }} <span class="text-sm text-gray-400 font-medium ml-2">Ruangan</span>
</div>
</div>
</div>
@forelse($pengumuman as $info)
<div class="bg-white border-l-4 border-indigo-500 shadow-sm rounded-r-lg p-4 mb-4 relative">
<div class="flex justify-between items-start">
<div>
<h4 class="text-lg font-bold text-gray-800">{{ $info->judul }}</h4>
<p class="text-gray-600 mt-1 text-sm">{{ Str::limit($info->isi, 150) }}</p>
<div class="mt-2 text-xs text-gray-500 flex items-center bg-gray-100 w-fit px-2 py-1 rounded">
📅
@if($info->tanggal_mulai)
{{ \Carbon\Carbon::parse($info->tanggal_mulai)->format('d M Y') }}
s/d
{{ \Carbon\Carbon::parse($info->tanggal_selesai)->format('d M Y') }}
@else
Permanen
@endif
<div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
<!-- Papan Pengumuman -->
<div class="lg:col-span-2">
<div class="flex items-center mb-4 px-2">
<div class="w-8 h-8 rounded-lg bg-green-100 text-green-600 flex items-center justify-center mr-3">
<i class="fas fa-bell"></i>
</div>
<h3 class="text-lg font-bold text-gray-700">Info & Pengumuman</h3>
</div>
<div class="space-y-4 max-h-[500px] overflow-y-auto custom-scrollbar pr-2">
@forelse($pengumuman as $info)
<div class="bg-white rounded-2xl p-5 border border-l-4 border-[#e1f0e8] border-l-green-400 hover:border-l-green-500 transition-colors shadow-sm group">
<div class="flex justify-between items-start">
<div class="flex-1 pr-4">
<h4 class="text-base font-bold text-gray-800 group-hover:text-green-700 transition-colors">{{ $info->judul }}</h4>
<p class="text-gray-500 mt-2 text-sm leading-relaxed">{{ Str::limit($info->isi, 150) }}</p>
<div class="mt-4 flex items-center gap-3">
<div class="inline-flex items-center text-xs font-medium text-green-700 bg-green-50 px-2.5 py-1 rounded-md">
<i class="far fa-calendar-alt mr-1.5 opacity-70"></i>
@if($info->tanggal_mulai)
{{ \Carbon\Carbon::parse($info->tanggal_mulai)->format('d M y') }}
-
{{ \Carbon\Carbon::parse($info->tanggal_selesai)->format('d M y') }}
@else
Info Permanen
@endif
</div>
</div>
</div>
<div class="text-[10px] uppercase tracking-wider font-bold text-gray-400 bg-gray-50 px-2 py-1 rounded-md whitespace-nowrap">
{{ $info->created_at->diffForHumans() }}
</div>
</div>
</div>
<span class="text-xs text-gray-400 italic">
{{ $info->created_at->diffForHumans() }}
</span>
@empty
<div class="bg-white/50 border border-dashed border-gray-300 rounded-2xl p-10 text-center flex flex-col items-center justify-center">
<div class="w-16 h-16 bg-gray-100 text-gray-300 rounded-full flex items-center justify-center mb-3">
<i class="fas fa-inbox text-2xl"></i>
</div>
<p class="text-gray-500 font-medium">Belum ada pengumuman aktif saat ini.</p>
</div>
@endforelse
</div>
</div>
<!-- Siswa Terbaru -->
<div class="lg:col-span-1">
<div class="bg-white rounded-2xl shadow-sm border border-[#e1f0e8] overflow-hidden flex flex-col h-full">
<div class="px-6 py-5 border-b border-[#f2f8f5] flex items-center justify-between bg-green-50/30">
<h3 class="text-sm font-bold tracking-wider uppercase text-green-800 flex items-center">
<i class="fas fa-user-plus mr-2 text-green-500"></i> Siswa Baru
</h3>
</div>
<div class="p-6 flex-1">
@if($siswaBaru->count() > 0)
<ul class="space-y-4">
@foreach($siswaBaru as $siswa)
<li class="flex items-center justify-between pb-4 border-b border-gray-50 last:border-0 last:pb-0">
<div class="flex items-center">
<div class="w-10 h-10 rounded-full bg-gradient-to-r from-green-100 to-teal-100 flex justify-center items-center text-green-700 font-bold text-sm shadow-sm border border-white">
{{ substr($siswa->nama_siswa, 0, 1) }}
</div>
<div class="ml-3">
<p class="text-sm font-bold text-gray-800">{{ $siswa->nama_siswa }}</p>
<p class="text-xs text-gray-500">{{ $siswa->nis }}</p>
</div>
</div>
<span class="w-2 h-2 rounded-full bg-green-400 cursor-help" title="Aktif"></span>
</li>
@endforeach
</ul>
@else
<div class="h-full flex flex-col items-center justify-center text-center py-8">
<i class="fas fa-user-slash text-gray-300 text-3xl mb-2"></i>
<p class="text-sm text-gray-500">Belum ada siswa baru.</p>
</div>
@endif
</div>
</div>
@empty
<div class="bg-gray-50 border border-gray-200 rounded-lg p-6 text-center text-gray-500">
Belum ada pengumuman aktif saat ini.
</div>
@endforelse
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
<div class="bg-white overflow-hidden shadow rounded-lg p-5 border-b-4 border-blue-500">
<div class="text-gray-500 text-sm font-bold uppercase">Total Siswa</div>
<div class="text-3xl font-bold text-gray-800">{{ $totalSiswa }}</div>
</div>
<div class="bg-white overflow-hidden shadow rounded-lg p-5 border-b-4 border-green-500">
<div class="text-gray-500 text-sm font-bold uppercase">Total Guru</div>
<div class="text-3xl font-bold text-gray-800">{{ $totalGuru }}</div>
</div>
<div class="bg-white overflow-hidden shadow rounded-lg p-5 border-b-4 border-purple-500">
<div class="text-gray-500 text-sm font-bold uppercase">Total Kelas</div>
<div class="text-3xl font-bold text-gray-800">{{ $totalKelas }}</div>
</div>
</div>
<div class="bg-white shadow rounded-lg overflow-hidden">
<div class="px-6 py-4 border-b border-gray-200 font-bold text-gray-700">
Siswa Terbaru
</div>
<table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Nama</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">NIS</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Status</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-200">
@foreach($siswaBaru as $siswa)
<tr>
<td class="px-6 py-4 whitespace-nowrap">{{ $siswa->nama_siswa }}</td>
<td class="px-6 py-4 whitespace-nowrap">{{ $siswa->nis }}</td>
<td class="px-6 py-4 whitespace-nowrap">
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">
Aktif
</span>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>

View File

@ -2,78 +2,222 @@
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Simpaud Kartoharjo</title>
<!-- Google Fonts: Plus Jakarta Sans -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css" rel="stylesheet">
<!-- Tailwind Custom Config & Global CSS -->
<script>
tailwind.config = {
theme: {
extend: {
fontFamily: {
sans: ['"Plus Jakarta Sans"', 'sans-serif'],
},
colors: {
green: {
50: '#f2f8f5',
100: '#e1f0e8',
200: '#c5e2d4',
300: '#9dcdb9',
400: '#70b197',
500: '#4e957a',
600: '#3a7760',
700: '#30604e',
800: '#274d40',
900: '#213f35',
}
}
}
}
}
</script>
<style>
/* Global Enhancements */
body { font-family: 'Plus Jakarta Sans', sans-serif; background-color: #e5f0ea; }
/* Soften all cards globally and tint white to pastel green */
.bg-white {
background-color: #f3fbf6 !important; /* Soft green tint instead of stark white */
}
.bg-white.shadow-md {
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03);
border-radius: 1rem;
border: 1px solid rgba(225, 240, 232, 0.8);
}
/* Beautify all inputs/selects globally */
input[type="text"], input[type="email"], input[type="password"], input[type="number"], input[type="date"], select, textarea {
border-radius: 0.75rem !important;
border-color: #c5e2d4 !important;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.02) !important;
transition: all 0.2s ease;
}
input:focus, select:focus, textarea:focus {
ring: 2px !important;
ring-color: #70b197 !important;
border-color: #70b197 !important;
outline: none !important;
}
/* Global Button Enhancements */
button, .btn, a.bg-green-600, a.bg-blue-600 {
transition: all 0.2s ease;
}
button:hover, .btn:hover, a.bg-green-600:hover {
transform: translateY(-1px);
box-shadow: 0 4px 6px -1px rgba(58, 119, 96, 0.2);
}
/* Improve HTML Table looks globally */
table.w-full {
border-radius: 0.75rem;
overflow: hidden;
border-collapse: separate;
border-spacing: 0;
border: 1px solid #e1f0e8;
}
table th {
background-color: #f2f8f5 !important;
color: #30604e !important;
text-transform: uppercase;
font-size: 0.75rem;
letter-spacing: 0.05em;
padding: 1rem !important;
}
table td {
padding: 1rem !important;
color: #4a5568;
border-bottom: 1px solid #e1f0e8;
}
table tr:last-child td {
border-bottom: none;
}
table tr:hover td {
background-color: #fcfdfd;
}
</style>
</head>
<body class="flex bg-gray-100 font-sans">
<body class="flex bg-[#e5f0ea] text-gray-800 font-sans antialiased selection:bg-green-200 selection:text-green-900">
<!-- Sidebar -->
<aside class="w-64 bg-green-600 text-white min-h-screen p-6 shadow-xl">
<h2 class="text-2xl font-bold mb-10">Simpaud Kartoharjo</h2>
<nav class="space-y-4 text-sm">
<a href="{{ route('dashboard') }}" class="flex items-center p-2 rounded-lg hover:bg-green-700 transition">
<i class="fas fa-home mr-3"></i> Home
<aside class="w-64 bg-[#f1f8f4] border-r border-[#d4ebd8] flex flex-col transition-all duration-300 shadow-sm z-20">
<div class="p-6 flex items-center border-b border-[#f2f8f5]">
<div class="w-10 h-10 rounded-xl bg-gradient-to-br from-green-400 to-green-600 flex items-center justify-center shadow-lg text-white font-bold text-xl mr-3">
S
</div>
<h2 class="text-xl font-extrabold text-gray-800 tracking-tight">Simpaud</h2>
</div>
<nav class="flex-1 p-4 space-y-6 overflow-y-auto custom-scrollbar">
<!-- Main Menu -->
<div>
<p class="px-3 text-xs font-bold text-green-500 uppercase tracking-wider mb-2">Menu Utama</p>
<a href="{{ route('dashboard') }}" class="flex items-center px-3 py-2.5 text-sm font-medium rounded-xl text-green-900 bg-green-50 hover:bg-green-100 transition-colors shadow-sm">
<i class="fas fa-home w-5 h-5 mr-3 flex items-center justify-center text-green-600"></i>
Dashboard
</a>
@if(auth()->user()->role == 'admin')
<div>
<p class="font-semibold uppercase text-xs mb-2 text-green-200">Data Master</p>
<ul class="ml-4 space-y-1">
<li><a href="{{ route('guru.index') }}" class="block p-2 hover:bg-green-700 rounded text-white">👨‍🏫 Guru</a></li>
<li><a href="{{ route('wali-murid.index') }}" class="block p-2 hover:bg-green-700 rounded text-white">👪 Wali Murid</a></li>
<li><a href="{{ route('siswa.index') }}" class="block p-2 hover:bg-green-700 rounded text-white">🧒 Peserta Didik</a></li>
</ul>
</div>
@if(auth()->user()->role == 'admin')
<!-- Data Master -->
<div>
<p class="px-3 text-xs font-bold text-gray-400 uppercase tracking-wider mb-2">Data Master</p>
<ul class="space-y-1">
<li><a href="{{ route('guru.index') }}" class="group flex items-center px-3 py-2 text-sm font-medium rounded-xl text-gray-600 hover:text-green-800 hover:bg-green-50/50 transition-colors">
<i class="fas fa-chalkboard-teacher w-5 h-5 mr-3 text-gray-400 flex items-center justify-center group-hover:text-green-500"></i> Guru</a>
</li>
<li><a href="{{ route('wali-murid.index') }}" class="group flex items-center px-3 py-2 text-sm font-medium rounded-xl text-gray-600 hover:text-green-800 hover:bg-green-50/50 transition-colors">
<i class="fas fa-users w-5 h-5 mr-3 text-gray-400 flex items-center justify-center group-hover:text-green-500"></i> Wali Murid</a>
</li>
<li><a href="{{ route('siswa.index') }}" class="group flex items-center px-3 py-2 text-sm font-medium rounded-xl text-gray-600 hover:text-green-800 hover:bg-green-50/50 transition-colors">
<i class="fas fa-child w-5 h-5 mr-3 text-gray-400 flex items-center justify-center group-hover:text-green-500"></i> Peserta Didik</a>
</li>
</ul>
</div>
@endif
<!-- Laporan & Info -->
<div>
<p class="px-3 text-xs font-bold text-gray-400 uppercase tracking-wider mb-2">Laporan & Info</p>
<ul class="space-y-1">
<li>
<a href="{{ route('admin.perkembangan.index') }}" class="group flex items-center px-3 py-2 text-sm font-medium rounded-xl text-gray-600 hover:text-green-800 hover:bg-green-50/50 transition-colors">
<i class="fas fa-chart-line w-5 h-5 mr-3 text-gray-400 flex items-center justify-center group-hover:text-green-500"></i> Perkembangan
</a>
</li>
@if(auth()->user()->role == 'admin')
<li>
<a href="{{ route('pengumuman.index') }}" class="group flex items-center px-3 py-2 text-sm font-medium rounded-xl text-gray-600 hover:text-green-800 hover:bg-green-50/50 transition-colors">
<i class="fas fa-bullhorn w-5 h-5 mr-3 text-gray-400 flex items-center justify-center group-hover:text-green-500"></i> Pengumuman
</a>
</li>
@endif
<li>
<a href="{{ route('penjemputan.index') }}" class="group flex items-center px-3 py-2 text-sm font-medium rounded-xl text-gray-600 hover:text-green-800 hover:bg-green-50/50 transition-colors">
<i class="fas fa-bus w-5 h-5 mr-3 text-gray-400 flex items-center justify-center group-hover:text-green-500"></i> Penjemputan
</a>
</li>
</ul>
</div>
</nav>
<div class="p-4 border-t border-[#e1f0e8]">
<div class="flex items-center p-3 bg-gradient-to-r from-green-50 to-white rounded-xl shadow-sm border border-green-100">
<div class="w-9 h-9 rounded-full bg-green-200 flex items-center justify-center text-green-800 font-bold mr-3 border-2 border-white shadow-sm">
{{ substr(Auth::user()->name, 0, 1) }}
</div>
@endif
<div>
<p class="font-semibold uppercase text-xs mb-2 text-green-200">Laporan & Info</p>
<div class="space-y-1">
<a href="{{ route('admin.perkembangan.index') }}" class="flex items-center p-2 rounded-lg hover:bg-green-700 transition">
<i class="fas fa-chart-line mr-3"></i> Laporan Perkembangan
</a>
@if(auth()->user()->role == 'admin')
<a href="{{ route('pengumuman.index') }}" class="flex items-center p-2 rounded-lg hover:bg-green-700 transition">
<i class="fas fa-bullhorn mr-3"></i> Menu Pengumuman
</a>
@endif
<a href="{{ route('penjemputan.index') }}" class="flex items-center p-2 rounded-lg hover:bg-green-700 transition">
<i class="fas fa-bus mr-3"></i> Penjemputan
</a>
</div>
<div class="overflow-hidden">
<p class="text-sm font-bold text-gray-800 truncate">{{ Auth::user()->name }}</p>
<p class="text-xs text-green-600 uppercase font-semibold">{{ Auth::user()->role }}</p>
</div>
</nav>
</aside>
</div>
</div>
</aside>
<!-- Main Content -->
<div class="flex-1 flex flex-col">
<div class="flex-1 flex flex-col h-screen overflow-hidden relative">
<!-- Navbar -->
<header class="flex items-center justify-between bg-white px-6 py-4 shadow">
Hai, {{ Auth::user()->name }}
<div class="flex items-center space-x-4">
<input type="text" placeholder="Search Class, Documents, Activities..."
class="px-4 py-2 rounded-lg border focus:ring-2 focus:ring-green-400 w-72 text-sm">
<header class="flex items-center justify-between bg-[#f1f8f4]/80 backdrop-blur-lg px-8 py-4 border-b border-[#d4ebd8] z-10 sticky top-0">
<div class="flex items-center text-gray-700">
<h1 class="text-lg font-semibold tracking-wide flex items-center">
👋 <span class="ml-2">Halo, <span class="text-green-700">{{ Auth::user()->name }}</span></span>
</h1>
</div>
<div class="flex items-center space-x-6">
<!-- Search Input with Icon -->
<div class="relative hidden md:block">
<i class="fas fa-search absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400 text-sm"></i>
<input type="text" placeholder="Cari..."
class="pl-10 pr-4 py-2 bg-gray-50/50 border border-gray-200 focus:bg-white rounded-xl w-64 text-sm transition-all focus:w-80 shadow-sm">
</div>
<form action="{{ route('logout') }}" method="POST">
@csrf
<button type="submit" class="px-4 py-2 bg-red-500 text-white rounded hover:bg-red-600">
Logout
<button type="submit" class="flex items-center justify-center px-4 py-2 rounded-xl bg-red-50 text-red-500 hover:bg-red-500 hover:text-white transition-all font-medium text-sm shadow-sm" title="Logout">
<i class="fas fa-sign-out-alt mr-2"></i> Keluar
</button>
</form>
</div>
</header>
<!-- Content -->
<main class="p-6">
<!-- Content Area -->
<main class="flex-1 overflow-x-hidden overflow-y-auto bg-[#e5f0ea] p-8">
@yield('content')
@if (session('success'))
<div class="bg-green-100 text-green-800 p-3 rounded mb-4">
{{ session('success') }}
<div class="fixed bottom-6 right-6 bg-green-600 text-white px-6 py-4 rounded-xl shadow-2xl flex items-center animate-bounce border-2 border-green-400 z-50">
<i class="fas fa-check-circle mr-3 text-xl"></i>
<span class="font-semibold">{{ session('success') }}</span>
</div>
@endif
</main>

View File

@ -1,28 +1,85 @@
<!DOCTYPE html>
<html lang="en">
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Splash Screen</title>
<title>Simpaud - Monitoring & Management PAUD</title>
<!-- Google Fonts: Plus Jakarta Sans -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
<script src="https://cdn.tailwindcss.com"></script>
<script>
tailwind.config = {
theme: {
extend: {
fontFamily: { sans: ['"Plus Jakarta Sans"', 'sans-serif'] },
}
}
}
</script>
<style>
body { font-family: 'Plus Jakarta Sans', sans-serif; }
.mesh-bg {
background-color: #f2f8f5;
background-image:
radial-gradient(at 40% 20%, #c5e2d4 0px, transparent 50%),
radial-gradient(at 80% 0%, #e1f0e8 0px, transparent 50%),
radial-gradient(at 0% 50%, #d4ebe0 0px, transparent 50%),
radial-gradient(at 80% 50%, #b7dac9 0px, transparent 50%),
radial-gradient(at 0% 100%, #e1f0e8 0px, transparent 50%),
radial-gradient(at 80% 100%, #c5e2d4 0px, transparent 50%),
radial-gradient(at 0% 0%, #f2f8f5 0px, transparent 50%);
}
@keyframes float {
0% { transform: translateY(0px); }
50% { transform: translateY(-10px); }
100% { transform: translateY(0px); }
}
.animate-float { animation: float 4s ease-in-out infinite; }
@keyframes fadeOut {
to { opacity: 0; visibility: hidden; }
0% { opacity: 1; filter: blur(0); transform: scale(1); }
100% { opacity: 0; filter: blur(10px); transform: scale(1.1); visibility: hidden; }
}
.fade-out {
animation: fadeOut 1s ease-in-out forwards;
animation-delay: 2.5s;
animation: fadeOut 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
animation-delay: 2.2s;
}
@keyframes fadeInScale {
0% { opacity: 0; transform: scale(0.9); }
100% { opacity: 1; transform: scale(1); }
}
.animate-entrance {
animation: fadeInScale 1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
</style>
</head>
<body class="h-screen flex items-center justify-center bg-gradient-to-br from-green-400 via-green-500 to-green-700">
<body class="h-screen flex items-center justify-center mesh-bg overflow-hidden relative">
<div class="text-center fade-out">
<div class="animate-bounce">
<!-- Decorative modern blobs -->
<div class="absolute top-[-10%] left-[-10%] w-96 h-96 bg-green-200/40 rounded-full mix-blend-multiply filter blur-3xl opacity-70 animate-pulse"></div>
<div class="absolute bottom-[-10%] right-[-10%] w-96 h-96 bg-teal-200/40 rounded-full mix-blend-multiply filter blur-3xl opacity-70 animate-pulse" style="animation-delay: 1s;"></div>
<div class="text-center fade-out animate-entrance z-10">
<div class="relative inline-block animate-float mb-6">
<div class="absolute inset-0 bg-green-400 blur-xl opacity-30 rounded-full"></div>
<!-- Ganti logo disini -->
<img src="{{ asset('images/logo.png') }}" alt="logo" class="h-28 w-28 mx-auto rounded-full object-cover shadow-lg border-4 border-white">
<h1 class="mt-6 text-4xl font-extrabold text-white drop-shadow-lg">Simpaud Kartoharjo</h1>
<p class="mt-2 text-lg text-green-100">Monitoring & Management PAUD</p>
<img src="{{ asset('images/logo.png') }}" alt="Simpaud Logo" class="relative h-32 w-32 mx-auto rounded-3xl object-cover shadow-[0_8px_30px_rgb(0,0,0,0.08)] border border-white/60 bg-white/40 backdrop-blur-sm p-2">
</div>
<h1 class="text-4xl md:text-5xl font-extrabold tracking-tight text-gray-800 drop-shadow-sm">
<span class="text-transparent bg-clip-text bg-gradient-to-r from-green-600 to-teal-600">Simpaud</span>
</h1>
<p class="mt-3 text-lg md:text-xl font-medium text-gray-600 tracking-wide opacity-80">Monitoring & Management PAUD</p>
<div class="mt-10 flex justify-center space-x-2">
<div class="w-2 h-2 bg-green-400 rounded-full animate-bounce" style="animation-delay: 0s;"></div>
<div class="w-2 h-2 bg-green-400 rounded-full animate-bounce" style="animation-delay: 0.2s;"></div>
<div class="w-2 h-2 bg-green-400 rounded-full animate-bounce" style="animation-delay: 0.4s;"></div>
</div>
</div>
<script>

View File

@ -1,2 +0,0 @@
*
!.gitignore

View File

@ -0,0 +1 @@
a:3:{s:6:"_token";s:40:"sDTN2eel2XLvgOIi2iCJoGQPjJjq3y5H52v5TpBf";s:9:"_previous";a:1:{s:3:"url";s:21:"http://127.0.0.1:8000";}s:6:"_flash";a:2:{s:3:"old";a:0:{}s:3:"new";a:0:{}}}

View File

@ -0,0 +1 @@
a:4:{s:6:"_token";s:40:"eWLnDbrqXYS5aXlTxB1xh6b0Lnp8wmte7kkkWUnz";s:9:"_previous";a:1:{s:3:"url";s:39:"http://127.0.0.1:8000/admin/penjemputan";}s:6:"_flash";a:2:{s:3:"old";a:0:{}s:3:"new";a:0:{}}s:50:"login_web_59ba36addc2b2f9401580f014c7f58ea4e30989d";i:1;}

View File

@ -0,0 +1 @@
a:4:{s:6:"_token";s:40:"00mfxFm9DrbF1elsEluX9X6oWjH0R4XSNXCoGuB3";s:6:"_flash";a:2:{s:3:"old";a:0:{}s:3:"new";a:0:{}}s:9:"_previous";a:1:{s:3:"url";s:32:"http://127.0.0.1:8000/admin/guru";}s:50:"login_web_59ba36addc2b2f9401580f014c7f58ea4e30989d";i:1;}

1
test_db.php Normal file
View File

@ -0,0 +1 @@
<?php try { $db = new PDO('mysql:host=127.0.0.1;dbname=paud_monitoring;port=3306', 'root', '', [PDO::ATTR_TIMEOUT => 3, PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION]); echo 'Koneksi Sukses!'; } catch (Exception $e) { echo 'Error: ' . $e->getMessage(); } ?>

BIN
vendor.zip Normal file

Binary file not shown.