update sidebar layout
This commit is contained in:
@@ -82,58 +82,64 @@ const adminTabs = [
|
||||
|
||||
<BaseLayout title={title}>
|
||||
<ClientRouter />
|
||||
<div class="flex flex-row max-h-[100vh]">
|
||||
<ul class="menu bg-base-200 w-70 h-[100vh] flex">
|
||||
{
|
||||
preTabs.map((tab) => (
|
||||
<li>
|
||||
<a href={tab.href}>
|
||||
<span class="iconify" class:list={tab.iconClass} />
|
||||
<span>{tab.name}</span>
|
||||
</a>
|
||||
</li>
|
||||
))
|
||||
}
|
||||
<div class="divider mx-1 my-1"></div>
|
||||
{
|
||||
adminTabs.map(
|
||||
(tab) =>
|
||||
tab.enabled && (
|
||||
<li>
|
||||
<a href={tab.href}>
|
||||
<span class="iconify" class:list={tab.iconClass} />
|
||||
<span>{tab.name}</span>
|
||||
</a>
|
||||
{tab.subTabs && (
|
||||
<ul>
|
||||
{tab.subTabs.map((subTab) => (
|
||||
<li>
|
||||
<a href={subTab.href}>
|
||||
<span class="iconify" class:list={subTab.iconClass} />
|
||||
<span>{subTab.name}</span>
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
</li>
|
||||
)
|
||||
)
|
||||
}
|
||||
{
|
||||
Astro.slots.has('actions') && (
|
||||
<fieldset class="fieldset bg-base-300 border-base-100 rounded-box border p-2 -ml-1.5 -mr-1.5 mt-auto">
|
||||
<slot name="actions" />
|
||||
</fieldset>
|
||||
)
|
||||
}
|
||||
<li class:list={[Astro.slots.has('actions') ? null : 'mt-auto']}>
|
||||
<button id="logout">
|
||||
<span class="iconify iconify-[heroicons--arrow-left-end-on-rectangle]"></span>
|
||||
<span>Ausloggen</span>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="flex flex-row max-h-[100vh] overflow-hidden">
|
||||
<div class="bg-base-200 w-72 flex flex-col justify-between overflow-scroll">
|
||||
<ul class="menu">
|
||||
{
|
||||
preTabs.map((tab) => (
|
||||
<li>
|
||||
<a href={tab.href}>
|
||||
<span class="iconify" class:list={tab.iconClass} />
|
||||
<span>{tab.name}</span>
|
||||
</a>
|
||||
</li>
|
||||
))
|
||||
}
|
||||
<div class="divider mx-1 my-1"></div>
|
||||
{
|
||||
adminTabs.map(
|
||||
(tab) =>
|
||||
tab.enabled && (
|
||||
<li>
|
||||
<a href={tab.href}>
|
||||
<span class="iconify" class:list={tab.iconClass} />
|
||||
<span>{tab.name}</span>
|
||||
</a>
|
||||
{tab.subTabs && (
|
||||
<ul>
|
||||
{tab.subTabs.map((subTab) => (
|
||||
<li>
|
||||
<a href={subTab.href}>
|
||||
<span class="iconify" class:list={subTab.iconClass} />
|
||||
<span>{subTab.name}</span>
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
</li>
|
||||
)
|
||||
)
|
||||
}
|
||||
</ul>
|
||||
<ul class="menu">
|
||||
{
|
||||
Astro.slots.has('actions') && (
|
||||
<fieldset class="fieldset bg-base-300 border-base-100 rounded-box border p-2">
|
||||
<slot name="actions" />
|
||||
</fieldset>
|
||||
)
|
||||
}
|
||||
<div class="divider mx-1 my-0"></div>
|
||||
<li>
|
||||
<button id="logout">
|
||||
<span class="iconify iconify-[heroicons--arrow-left-end-on-rectangle]"></span>
|
||||
<span>Ausloggen</span>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="w-full overflow-scroll relative">
|
||||
<slot />
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user