48 lines
2.1 KiB
PHP
48 lines
2.1 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}" data-appearance="{{ $appearance ?? 'system' }}" @class(['dark' => ($appearance ?? 'system') === 'dark'])>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
{{-- Resolve before first paint; the Vue plugin reads the same data attribute. --}}
|
|
<script>
|
|
(function() {
|
|
const root = document.documentElement;
|
|
let appearance = root.dataset.appearance;
|
|
try {
|
|
const stored = window.localStorage.getItem('appearance');
|
|
if (stored !== null) {
|
|
appearance = stored;
|
|
}
|
|
} catch {
|
|
// Fall back to the server cookie when browser storage is unavailable.
|
|
}
|
|
appearance = ['light', 'dark', 'system'].includes(appearance) ? appearance : 'system';
|
|
const dark = appearance === 'dark' || (appearance === 'system' && window.matchMedia('(prefers-color-scheme: dark)').matches);
|
|
root.dataset.appearance = appearance;
|
|
root.classList.toggle('dark', dark);
|
|
root.style.colorScheme = dark ? 'dark' : 'light';
|
|
})();
|
|
</script>
|
|
|
|
{{-- The same tokens are bundled by Vite, so first paint cannot drift. --}}
|
|
<style>
|
|
{!! file_get_contents(resource_path('css/theme.css')) !!}
|
|
</style>
|
|
|
|
<title inertia>{{ config('app.name', 'Laravel') }}</title>
|
|
|
|
<link rel="icon" href="/favicon.ico" sizes="any">
|
|
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
|
|
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
|
|
|
|
<link rel="preload" href="{{ asset('fonts/inter/InterVariable.woff2') }}" as="font" type="font/woff2" crossorigin>
|
|
|
|
@vite(['resources/js/app.ts', "resources/js/pages/{$page['component']}.vue"])
|
|
@inertiaHead
|
|
</head>
|
|
<body class="font-sans antialiased">
|
|
@inertia
|
|
</body>
|
|
</html>
|