gbanyan/usher-manage-stack
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implement dark mode, bug report page, and schema dump

Browse Source
This commit is contained in:
gbanyan
2025-11-27 15:06:45 +08:00
parent 13bc6db529
commit 83602b1ed1
91 changed files with 1078 additions and 2291 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
resources/views/layouts/app.blade.php
View File

@@ -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>

24
resources/views/layouts/navigation.blade.php
View File

@@ -1,4 +1,4 @@
<nav x-data="{ open: false }" class="bg-white border-b border-gray-100">
<nav x-data="{ open: false }" class="bg-white border-b border-gray-100 dark:bg-slate-900 dark:border-slate-800 transition-colors duration-300">
<!-- Primary Navigation Menu -->
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex justify-between h-16">
@@ -6,7 +6,7 @@
<!-- Logo -->
<div class="shrink-0 flex items-center">
<a href="{{ route('dashboard') }}">
<x-application-logo class="block h-9 w-auto fill-current text-gray-800" />
<x-application-logo class="block h-9 w-auto fill-current text-gray-800 dark:text-slate-100" />
</a>
</div>
@@ -62,10 +62,26 @@
</div>
<!-- Settings Dropdown -->
<div class="hidden sm:flex sm:items-center sm:ms-6">
<div class="hidden sm:flex sm:items-center sm:ms-6 space-x-3">
<button
type="button"
@click="$root.toggle()"
class="inline-flex items-center px-3 py-2 rounded-md text-sm font-medium border border-transparent bg-gray-100 text-gray-600 hover:bg-gray-200 focus:outline-none focus:ring-2 focus:ring-indigo-500 dark:bg-slate-800 dark:text-slate-100 dark:hover:bg-slate-700"
aria-label="Toggle theme"
>
<span x-show="$root.isDark" class="flex items-center space-x-2">
<svg class="h-4 w-4" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"><path d="M17.293 13.293a1 1 0 00-1.414 0l-.586.586a6 6 0 01-8.486-8.486l.586-.586A1 1 0 006.172 3H6a1 1 0 00-.707.293l-.586.586a8 8 0 1011.314 11.314l.586-.586a1 1 0 000-1.414l-.314-.314z"/></svg>
<span class="sr-only">Switch to light</span>
</span>
<span x-show="!$root.isDark" class="flex items-center space-x-2">
<svg class="h-4 w-4" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"><path d="M10 3a1 1 0 011 1v1a1 1 0 11-2 0V4a1 1 0 011-1zm0 8a3 3 0 100-6 3 3 0 000 6zm5.657-6.657a1 1 0 010 1.414l-.707.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 9a1 1 0 110 2h-1a1 1 0 110-2h1zM5 9a1 1 0 100 2H4a1 1 0 100-2h1zm10.657 6.657a1 1 0 00-1.414 0l-.707.707a1 1 0 001.414 1.414l.707-.707a1 1 0 000-1.414zM10 16a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zm-5.657-.343a1 1 0 010-1.414l.707-.707a1 1 0 011.414 1.414l-.707.707a1 1 0 01-1.414 0z"/></svg>
<span class="sr-only">Switch to dark</span>
</span>
</button>
<x-dropdown align="right" width="48">
<x-slot name="trigger">
<button class="inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium rounded-md text-gray-500 bg-white hover:text-gray-700 focus:outline-none transition ease-in-out duration-150">
<button class="inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium rounded-md text-gray-500 bg-white hover:text-gray-700 focus:outline-none transition ease-in-out duration-150 dark:bg-slate-800 dark:text-slate-100 dark:hover:text-white">
<div>{{ Auth::user()->name }}</div>
<div class="ms-1">