105 lines
5.8 KiB
PHP
105 lines
5.8 KiB
PHP
<div
|
|
class="bg-zinc-50/80 backdrop-blur-sm dark:bg-zinc-950 flex shrink-0 items-center justify-between px-4 lg:px-8 h-16 z-50 sticky top-0 app-header">
|
|
<div class="shrink-0 flex items-center space-x-1">
|
|
|
|
</div>
|
|
<div class="flex items-center space-x-1">
|
|
<!--:TLang:-->
|
|
<!--:Theme Lang switcher:-->
|
|
|
|
|
|
<!--:Notifications:-->
|
|
|
|
<!--:Theme color switcher:-->
|
|
<div class="relative">
|
|
<button type="button"
|
|
class="cursor-pointer relative flex items-center justify-center size-8 rounded-lg hover:bg-zinc-200 hover:text-black dark:hover:text-white dark:hover:bg-zinc-800"
|
|
data-bs-toggle="dropdown" data-bs-display="static" data-bs-auto-close="outside">
|
|
<span class="icon-[lucide--settings] text-lg"></span>
|
|
</button>
|
|
<div class="dropdown-menu absolute min-w-56 abslute ltr:right-0 rtl:left-0 top-full z-50 !p-2 mt-4.5">
|
|
<div class="mb-3 px-3 pt-2">
|
|
<h5>Theme</h5>
|
|
</div>
|
|
|
|
<div class="flex flex-wrap px-3 pb-2 gap-2">
|
|
<button id="indigoTheme" class="theme-switcher cursor-pointer">
|
|
<span class="flex items-center justify-center size-7 rounded-full text-white"
|
|
style="background-color: #636DFF;">
|
|
<span class="icon-[lucide--check] theme-check text-lg"></span>
|
|
</span>
|
|
</button>
|
|
<button id="navyTheme" class="theme-switcher cursor-pointer">
|
|
<span class="flex items-center justify-center size-7 rounded-full text-white"
|
|
style="background-color: #0E6DD9;">
|
|
<span class="icon-[lucide--check] theme-check text-lg"></span>
|
|
</span>
|
|
</button>
|
|
<button id="emeraldTheme" class="theme-switcher cursor-pointer">
|
|
<span class="flex items-center justify-center size-7 rounded-full text-white"
|
|
style="background-color: #049772;">
|
|
<span class="icon-[lucide--check] theme-check text-lg"></span>
|
|
</span>
|
|
</button>
|
|
<button id="purpleTheme" class="theme-switcher cursor-pointer">
|
|
<span class="flex items-center justify-center size-7 rounded-full text-white"
|
|
style="background-color: #D300C5;">
|
|
<span class="icon-[lucide--check] theme-check text-lg"></span>
|
|
</span>
|
|
</button>
|
|
</div>
|
|
<div class="pt-2 mt-2 border-t border-dashed border-zinc-200 dark:border-zinc-700">
|
|
<label class="flex items-center cursor-pointer dropdown-item">
|
|
<span class="icon-[lucide--sun-moon] me-1"></span>
|
|
<span class="flex-grow text-sm me-2">Dark mode</span>
|
|
<input class="input-switch" data-theme-switch="dark" name="check_theme" type="checkbox" value="1">
|
|
</label>
|
|
</div>
|
|
<div class="pt-2 mt-2 border-t border-dashed border-zinc-200 dark:border-zinc-700">
|
|
<label for="toggleRTL" class="flex items-center justify-between cursor-pointer dropdown-item">
|
|
<span class="text-sm">Enable RTL</span>
|
|
<input type="checkbox" class="input-switch" id="toggleRTL" />
|
|
</label>
|
|
|
|
</div>
|
|
<div class="pt-2 dark:hidden mt-2 border-t border-dashed border-zinc-200 dark:border-zinc-700">
|
|
<h5 class="px-3 mb-2">Sidebar</h5>
|
|
<div class="radio-group flex items-center">
|
|
<div class="radio-option flex-grow">
|
|
<input class="appearance-none hidden" type="radio" id="sidebarLight" name="sidebarTheme" value="light" checked>
|
|
<label for="sidebarLight" class="block text-center cursor-pointer sidebar-label">
|
|
<span class="w-24 h-16 mb-2 overflow-hidden flex mx-auto p-1 rounded-sm bg-zinc-100 dark:bg-zinc-950 border border-dashed border-zinc-200">
|
|
<span class="w-6 h-full bg-white rounded-sm"></span>
|
|
</span>
|
|
<span class="block text-sm text-zinc-400">
|
|
Light
|
|
</span>
|
|
</label>
|
|
</div>
|
|
<div class="radio-option flex-grow">
|
|
<input class="appearance-none hidden" type="radio" id="sidebarDark" name="sidebarTheme" value="dark">
|
|
<label for="sidebarDark" class="block text-center cursor-pointer sidebar-label">
|
|
<span class="w-24 h-16 mb-2 overflow-hidden flex mx-auto p-1 rounded-sm bg-zinc-100 dark:bg-zinc-950 border border-dashed border-zinc-200">
|
|
<span class="w-6 h-full bg-zinc-900 rounded-sm"></span>
|
|
</span>
|
|
<span class="block text-sm text-zinc-400">
|
|
Dark
|
|
</span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="sm:relative">
|
|
<a href="/" class="dropdown-item">
|
|
<span class="dropdown-icon">
|
|
<span class="icon-[lucide--log-out]"></span>
|
|
</span>Sign out</a>
|
|
</div>
|
|
</div>
|
|
</div>
|