58 lines
2.4 KiB
PHP
58 lines
2.4 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="{{ app()->getLocale() }}">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="csrf-token" content="{{ csrf_token() }}">
|
|
<title>{{ $title ?? 'Clusev' }}</title>
|
|
@vite(['resources/css/app.css', 'resources/js/app.js'])
|
|
@livewireStyles
|
|
</head>
|
|
<body class="min-h-screen overflow-x-clip bg-void font-sans text-ink antialiased selection:bg-accent/25">
|
|
<div x-data="{ nav: false, desktop: window.matchMedia('(min-width: 1024px)').matches }"
|
|
@resize.window.debounce.200ms="desktop = window.matchMedia('(min-width: 1024px)').matches">
|
|
{{-- mobile/tablet backdrop --}}
|
|
<div x-show="nav" x-cloak x-transition.opacity @click="nav = false"
|
|
class="fixed inset-0 z-30 bg-void/70 lg:hidden"
|
|
aria-hidden="true"></div>
|
|
|
|
<x-sidebar />
|
|
|
|
<div class="relative z-10 lg:pl-[272px]">
|
|
<x-topbar />
|
|
<main class="mx-auto w-full max-w-7xl px-4 py-6 sm:px-6 lg:px-8">
|
|
{{ $slot }}
|
|
</main>
|
|
</div>
|
|
</div>
|
|
{{-- Toaster: catches Livewire-dispatched `notify` browser events --}}
|
|
<div
|
|
x-data="{ toasts: [] }"
|
|
x-on:notify.window="
|
|
const msg = $event.detail?.message ?? $event.detail?.[0]?.message ?? @js(__('shell.toast_done'));
|
|
const id = (window.crypto?.randomUUID?.() ?? String(Date.now() + Math.random()));
|
|
toasts.push({ id, msg });
|
|
setTimeout(() => { toasts = toasts.filter(t => t.id !== id) }, 4000);
|
|
"
|
|
class="pointer-events-none fixed inset-x-0 bottom-4 z-50 flex flex-col items-center gap-2 px-4 sm:items-end sm:px-6"
|
|
aria-live="polite"
|
|
>
|
|
<template x-for="t in toasts" :key="t.id">
|
|
<div
|
|
x-transition.opacity.duration.200ms
|
|
class="pointer-events-auto flex items-center gap-2.5 rounded-md border border-line bg-raised px-4 py-2.5 shadow-pop"
|
|
>
|
|
<span class="h-1.5 w-1.5 shrink-0 rounded-full bg-online"></span>
|
|
<span class="font-mono text-xs text-ink-2" x-text="t.msg"></span>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
|
|
{{-- Command palette + keyboard shortcuts (persistent; one global keydown listener) --}}
|
|
<x-command-palette />
|
|
|
|
<livewire:wire-elements-modal />
|
|
@livewireScripts
|
|
</body>
|
|
</html>
|