88 lines
4.3 KiB
PHP
88 lines
4.3 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}"
|
|
x-data="{
|
|
darkMode: localStorage.getItem('darkMode') ||
|
|
localStorage.setItem('darkMode', 'system')
|
|
}"
|
|
x-init="$watch('darkMode', val => localStorage.setItem('darkMode', val))"
|
|
x-bind:class="{'dark': darkMode === 'dark' || (darkMode === 'system' && window.matchMedia('(prefers-color-scheme: dark)').matches)}"
|
|
>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="csrf-token" content="{{ csrf_token() }}">
|
|
|
|
<title>{{ config('app.name', 'Laravel') }}</title>
|
|
|
|
<!-- Fonts -->
|
|
<link rel="preconnect" href="https://fonts.bunny.net">
|
|
<link href="https://fonts.bunny.net/css?family=figtree:400,500,600&display=swap" rel="stylesheet" />
|
|
|
|
<!-- Scripts -->
|
|
@vite(['resources/css/app.css', 'resources/js/app.js'])
|
|
</head>
|
|
<body class="antialiased bg-nexi-primary dark:bg-nexi-primary-dark font-sans text-nexi-black transition-colors duration-300">
|
|
<div x-data="{ sidebarOpen: false }">
|
|
<div class="relative z-50 lg:hidden" role="dialog" aria-modal="true">
|
|
{{-- TODO: Look into why the fuck does this not work? mobile views seem to not work with livewire clicks??? --}}
|
|
<div x-show="sidebarOpen"
|
|
x-transition:enter="transition-opacity ease-linear duration-300"
|
|
x-transition:enter-start="opacity-0"
|
|
x-transition:enter-end="opacity-100"
|
|
x-transition:leave="transition-opacity ease-linear duration-300"
|
|
x-transition:leave-start="opacity-100"
|
|
x-transition:leave-end="opacity-0"
|
|
class="fixed inset-0 bg-nexi-black/80"></div>
|
|
|
|
<div class="fixed inset-0 flex">
|
|
<div x-show="sidebarOpen"
|
|
x-transition:enter="transition ease-in-out duration-300 transform"
|
|
x-transition:enter-start="-translate-x-full"
|
|
x-transition:enter-end="translate-x-0"
|
|
x-transition:leave="transition ease-in-out duration-300 transform"
|
|
x-transition:leave-start="translate-x-0"
|
|
x-transition:leave-end="-translate-x-full"
|
|
class="relative mr-16 flex w-full max-w-xs flex-1">
|
|
|
|
<div x-show="sidebarOpen"
|
|
x-transition:enter="ease-in-out duration-300"
|
|
x-transition:enter-start="opacity-0"
|
|
x-transition:enter-end="opacity-100"
|
|
x-transition:leave="ease-in-out duration-300"
|
|
x-transition:leave-start="opacity-100"
|
|
x-transition:leave-end="opacity-0"
|
|
class="absolute left-full top-0 flex w-16 justify-center pt-5">
|
|
<button type="button" class="-m-2.5 p-2.5" @click="sidebarOpen = false">
|
|
<svg class="h-6 w-6 text-white" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
|
|
<div class="flex grow flex-col gap-y-5 overflow-y-auto px-6 pb-4">
|
|
<x-sidebar/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Static sidebar for desktop -->
|
|
<div class="hidden lg:fixed lg:inset-y-0 lg:z-50 lg:flex lg:w-72 lg:flex-col">
|
|
<div class="flex grow flex-col gap-y-5 overflow-y-auto border-r border-gray-200 px-6 pb-4">
|
|
<x-sidebar/>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="lg:pl-72">
|
|
<livewire:layout.navigation />
|
|
|
|
<main class="py-10">
|
|
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
|
|
{{ $slot }}
|
|
</div>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|