<template>
<div
id="imperial-dashboard-layout"
class="flex flex-col h-screen overflow-hidden bg-black"
>
<UHeader class="border-b border-red-900/20 bg-black/50 backdrop-blur-md">
<template #left>
<NuxtLink to="/dashboard">
<UAvatar
src="https://www.geekcals.com/wp-content/uploads/2015/08/Imperial-Logo.jpg"
class="w-8 h-8 p-1 bg-black ring-1 ring-red-600/30"
/>
</NuxtLink>
<span class="ml-3 font-bold tracking-tighter uppercase italic text-white">Terminal</span>
</template>
<template #right>
<UColorModeButton />
</template>
</UHeader>
<div class="flex flex-1 overflow-hidden">
<AppSidebar class="w-64 shrink-0 border-r border-zinc-900" />
<UMain class="flex-1 overflow-y-auto relative bg-zinc-950">
<div class="fixed inset-0 pointer-events-none opacity-[0.02] bg-[linear-gradient(rgba(18,16,16,0)_50%,rgba(0,0,0,0.25)_50%),linear-gradient(90deg,rgba(255,0,0,0.06),rgba(0,255,0,0.02),rgba(0,0,255,0.06))] bg-size-[100%_2px,3px_100%]" />
<div class="relative z-10">
<slot />
</div>
</UMain>
</div>
<UFooter class="border-t border-zinc-900 bg-black py-2">
<template #left>
<span class="text-[10px] text-zinc-600 uppercase tracking-[0.2em] px-4 font-mono">
Status: Sector Secure // Protocol 4.2.2
</span>
</template>
</UFooter>
</div>
</template>
<template>
<div
id="imperial-dashboard-layout"
class="flex flex-col h-screen overflow-hidden bg-black"
>
<UHeader class="border-b border-red-900/20 bg-black/50 backdrop-blur-md">
<template #left>
<NuxtLink to="/dashboard">
<UAvatar
src="https://www.geekcals.com/wp-content/uploads/2015/08/Imperial-Logo.jpg"
class="w-8 h-8 p-1 bg-black ring-1 ring-red-600/30"
/>
</NuxtLink>
<span class="ml-3 font-bold tracking-tighter uppercase italic text-white">Terminal</span>
</template>
<template #right>
<UColorModeButton />
</template>
</UHeader>
<div class="flex flex-1 overflow-hidden">
<AppSidebar class="w-64 shrink-0 border-r border-zinc-900" />
<UMain class="flex-1 overflow-y-auto relative bg-zinc-950">
<div class="fixed inset-0 pointer-events-none opacity-[0.02] bg-[linear-gradient(rgba(18,16,16,0)_50%,rgba(0,0,0,0.25)_50%),linear-gradient(90deg,rgba(255,0,0,0.06),rgba(0,255,0,0.02),rgba(0,0,255,0.06))] bg-size-[100%_2px,3px_100%]" />
<div class="relative z-10">
<slot />
</div>
</UMain>
</div>
<UFooter class="border-t border-zinc-900 bg-black py-2">
<template #left>
<span class="text-[10px] text-zinc-600 uppercase tracking-[0.2em] px-4 font-mono">
Status: Sector Secure // Protocol 4.2.2
</span>
</template>
</UFooter>
</div>
</template>