Implement dark mode, bug report page, and schema dump
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
|
||||
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}" x-data="themeSwitcher()" x-init="init()" :class="{'dark': isDark}">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
@@ -14,13 +14,13 @@
|
||||
<!-- Scripts -->
|
||||
@vite(['resources/css/app.css', 'resources/js/app.js'])
|
||||
</head>
|
||||
<body class="font-sans antialiased">
|
||||
<div class="min-h-screen bg-gray-100">
|
||||
<body class="font-sans antialiased bg-gray-50 text-slate-900 transition-colors duration-300 dark:bg-slate-900 dark:text-slate-100">
|
||||
<div class="min-h-screen">
|
||||
@include('layouts.navigation')
|
||||
|
||||
<!-- Page Heading -->
|
||||
@if (isset($header))
|
||||
<header class="bg-white shadow">
|
||||
<header class="bg-white/80 shadow dark:bg-slate-800/80 backdrop-blur">
|
||||
<div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
|
||||
{{ $header }}
|
||||
</div>
|
||||
@@ -28,9 +28,34 @@
|
||||
@endif
|
||||
|
||||
<!-- Page Content -->
|
||||
<main>
|
||||
<main class="bg-gray-50 dark:bg-slate-900">
|
||||
{{ $slot }}
|
||||
</main>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function themeSwitcher() {
|
||||
return {
|
||||
isDark: false,
|
||||
init() {
|
||||
const stored = localStorage.getItem('theme');
|
||||
if (stored) {
|
||||
this.isDark = stored === 'dark';
|
||||
} else {
|
||||
this.isDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
|
||||
}
|
||||
this.apply();
|
||||
},
|
||||
toggle() {
|
||||
this.isDark = !this.isDark;
|
||||
localStorage.setItem('theme', this.isDark ? 'dark' : 'light');
|
||||
this.apply();
|
||||
},
|
||||
apply() {
|
||||
document.documentElement.classList.toggle('dark', this.isDark);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user