mirror of
https://github.com/faiztyanirh/clqms-shadcn-v1.git
synced 2026-04-22 17:19:52 +07:00
56 lines
1.8 KiB
Svelte
56 lines
1.8 KiB
Svelte
<script>
|
|
import favicon from '$lib/assets/favicon.svg';
|
|
import "../app.css";
|
|
import AppSidebar from "$lib/components/app-sidebar.svelte";
|
|
import * as Sidebar from "$lib/components/ui/sidebar/index.js";
|
|
import * as Breadcrumb from "$lib/components/ui/breadcrumb/index.js";
|
|
import { ModeWatcher } from "mode-watcher";
|
|
import SunIcon from "@lucide/svelte/icons/sun";
|
|
import MoonIcon from "@lucide/svelte/icons/moon";
|
|
import { toggleMode } from "mode-watcher";
|
|
import { Button } from "$lib/components/ui/button/index.js";
|
|
import { Separator } from "$lib/components/ui/separator/index.js";
|
|
|
|
let { children, data } = $props();
|
|
</script>
|
|
|
|
<svelte:head>
|
|
<link rel="icon" href={favicon} />
|
|
</svelte:head>
|
|
|
|
<Sidebar.Provider>
|
|
<AppSidebar />
|
|
<Sidebar.Inset class="flex flex-col h-screen overflow-hidden">
|
|
<header class="flex h-10 shrink-0 items-center justify-between gap-2">
|
|
<div class="flex items-center gap-2 px-4">
|
|
<Sidebar.Trigger class="-ml-1" />
|
|
<Separator orientation="vertical" class="mr-2 data-[orientation=vertical]:h-4" />
|
|
<Breadcrumb.Root>
|
|
<Breadcrumb.List>
|
|
<Breadcrumb.Item class="hidden md:block">
|
|
<Breadcrumb.Page>{data.title}</Breadcrumb.Page>
|
|
</Breadcrumb.Item>
|
|
</Breadcrumb.List>
|
|
</Breadcrumb.Root>
|
|
</div>
|
|
<div class="flex items-center gap-2 px-2">
|
|
<Button onclick={toggleMode} variant="ghost" size="icon" class="size-7">
|
|
<SunIcon
|
|
class="w-4 h-4 rotate-0 scale-100 !transition-all dark:-rotate-90 dark:scale-0"
|
|
/>
|
|
<MoonIcon
|
|
class="absolute w-4 h-4 rotate-90 scale-0 !transition-all dark:rotate-0 dark:scale-100"
|
|
/>
|
|
<span class="sr-only">Toggle theme</span>
|
|
</Button>
|
|
</div>
|
|
</header>
|
|
<Separator />
|
|
<div class="flex-1 min-h-0 overflow-hidden">
|
|
{@render children?.()}
|
|
</div>
|
|
</Sidebar.Inset>
|
|
</Sidebar.Provider>
|
|
|
|
<ModeWatcher />
|