feat: add dynamic logo and login cover images via system settings and clean up legacy role migration logic
This commit is contained in:
parent
f0cc242c7e
commit
26463c02a3
@ -2,6 +2,7 @@
|
||||
|
||||
namespace App\Http\Middleware;
|
||||
|
||||
use App\Services\System\Setting\SystemService;
|
||||
use App\Settings\SystemSettings;
|
||||
use Illuminate\Http\Request;
|
||||
use Inertia\Middleware;
|
||||
@ -40,6 +41,8 @@ public function share(Request $request): array
|
||||
...parent::share($request),
|
||||
'name' => fn () => app(SystemSettings::class)->app_name,
|
||||
'address' => fn () => app(SystemSettings::class)->address,
|
||||
'logo_url' => fn () => app(SystemService::class)->systemData()['logo_url'] ?? asset('assets/logo.png'),
|
||||
'login_cover_url' => fn () => app(SystemService::class)->systemData()['login_cover_url'] ?? null,
|
||||
'auth' => fn () => [
|
||||
'user' => $request->user() ? [
|
||||
'id' => $request->user()->id,
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import { useForm } from '@inertiajs/vue3';
|
||||
import { useForm, usePage } from '@inertiajs/vue3';
|
||||
import { Eye, EyeOff } from '@lucide/vue';
|
||||
import { ref } from 'vue';
|
||||
import type {HTMLAttributes} from 'vue';
|
||||
@ -22,6 +22,8 @@ const props = defineProps<{
|
||||
class?: HTMLAttributes['class'];
|
||||
}>();
|
||||
|
||||
const page = usePage();
|
||||
|
||||
const showPassword = ref(false);
|
||||
|
||||
const form = useForm({
|
||||
@ -129,7 +131,7 @@ function submit() {
|
||||
</form>
|
||||
<div class="relative hidden bg-muted md:block">
|
||||
<img
|
||||
src="https://images.pexels.com/photos/37080685/pexels-photo-37080685.jpeg"
|
||||
:src="page.props.login_cover_url || 'https://images.pexels.com/photos/37080685/pexels-photo-37080685.jpeg'"
|
||||
alt="Image"
|
||||
class="absolute inset-0 h-full w-full object-cover"
|
||||
/>
|
||||
|
||||
2
resources/js/types/global.d.ts
vendored
2
resources/js/types/global.d.ts
vendored
@ -25,6 +25,8 @@ declare module '@inertiajs/core' {
|
||||
};
|
||||
sidebarOpen: boolean;
|
||||
appearance: 'light' | 'dark' | 'system';
|
||||
logo_url: string | null;
|
||||
login_cover_url: string | null;
|
||||
[key: string]: unknown;
|
||||
};
|
||||
}
|
||||
|
||||
@ -1,40 +1,38 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}" @class(['dark' => ($appearance ?? 'system') == 'dark'])>
|
||||
|
||||
<head>
|
||||
<script>
|
||||
(function() {
|
||||
const appearance = @json($appearance ?? 'system');
|
||||
<head>
|
||||
<script>
|
||||
(function() {
|
||||
const appearance = @json($appearance ?? 'system');
|
||||
|
||||
if (appearance === 'dark' || (appearance === 'system' && window.matchMedia('(prefers-color-scheme: dark)')
|
||||
.matches)) {
|
||||
document.documentElement.classList.add('dark');
|
||||
} else {
|
||||
document.documentElement.classList.remove('dark');
|
||||
}
|
||||
})();
|
||||
</script>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="csrf-token" content="{{ csrf_token() }}">
|
||||
<meta name="description" content="{{ config('app.name', 'Laravel') }} - Progressive Web App">
|
||||
<meta name="theme-color" content="#171717">
|
||||
if (appearance === 'dark' || (appearance === 'system' && window.matchMedia('(prefers-color-scheme: dark)')
|
||||
.matches)) {
|
||||
document.documentElement.classList.add('dark');
|
||||
} else {
|
||||
document.documentElement.classList.remove('dark');
|
||||
}
|
||||
})();
|
||||
</script>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="csrf-token" content="{{ csrf_token() }}">
|
||||
<meta name="description" content="{{ config('app.name', 'Laravel') }} - Progressive Web App">
|
||||
<meta name="theme-color" content="#171717">
|
||||
|
||||
<link rel="icon" href="/favicon.ico" sizes="any">
|
||||
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
|
||||
<link rel="apple-touch-icon" href="/assets/apple-touch-icon-180x180.png" sizes="180x180">
|
||||
<link rel="manifest" href="/build/manifest.webmanifest">
|
||||
<link rel="icon" href="{{ $page['props']['logo_url'] ?? asset('assets/logo.png') }}" sizes="any">
|
||||
<link rel="manifest" href="/build/manifest.webmanifest">
|
||||
|
||||
@fonts
|
||||
@fonts
|
||||
|
||||
@vite(['resources/css/app.css', 'resources/js/app.ts', "resources/js/pages/{$page['component']}.vue"])
|
||||
<x-inertia::head>
|
||||
<title>{{ config('app.name', 'Laravel') }}</title>
|
||||
</x-inertia::head>
|
||||
</head>
|
||||
@vite(['resources/css/app.css', 'resources/js/app.ts', "resources/js/pages/{$page['component']}.vue"])
|
||||
<x-inertia::head>
|
||||
<title>{{ config('app.name', 'Laravel') }}</title>
|
||||
</x-inertia::head>
|
||||
</head>
|
||||
|
||||
<body class="font-sans antialiased">
|
||||
<x-inertia::app />
|
||||
</body>
|
||||
<body class="font-sans antialiased">
|
||||
<x-inertia::app />
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user