mirror of
https://github.com/MetaCubeX/metacubexd.git
synced 2024-12-25 19:14:12 +08:00
feat: update header layout
This commit is contained in:
parent
ad43bdaa9b
commit
07c82e87d8
@ -5,6 +5,7 @@ import {
|
||||
IconHome,
|
||||
IconNetwork,
|
||||
IconNetworkOff,
|
||||
IconPalette,
|
||||
IconRuler,
|
||||
IconSettings,
|
||||
} from '@tabler/icons-solidjs'
|
||||
@ -17,75 +18,69 @@ export const Header = () => {
|
||||
const navigate = useNavigate()
|
||||
|
||||
return (
|
||||
<div class="sticky inset-x-0 top-0 z-10 flex items-center rounded-md bg-base-200 px-4 py-2">
|
||||
<ul class="menu rounded-box menu-horizontal sticky left-0 top-0 z-10 flex items-center justify-center gap-2 bg-base-200 p-2">
|
||||
<Show when={location.pathname !== '/setup'}>
|
||||
<ul class="menu rounded-box menu-horizontal">
|
||||
<li>
|
||||
<A class="tooltip tooltip-bottom" href="/" data-tip="Home">
|
||||
<IconHome />
|
||||
</A>
|
||||
</li>
|
||||
<li>
|
||||
<A class="tooltip tooltip-bottom" href="/" data-tip="Home">
|
||||
<IconHome />
|
||||
</A>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<A
|
||||
class="tooltip tooltip-bottom"
|
||||
href="/proxies"
|
||||
data-tip="Proxies"
|
||||
>
|
||||
<IconGlobe />
|
||||
</A>
|
||||
</li>
|
||||
<li>
|
||||
<A class="tooltip tooltip-bottom" href="/proxies" data-tip="Proxies">
|
||||
<IconGlobe />
|
||||
</A>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<A class="tooltip tooltip-bottom" href="/rules" data-tip="Rules">
|
||||
<IconRuler />
|
||||
</A>
|
||||
</li>
|
||||
<li>
|
||||
<A class="tooltip tooltip-bottom" href="/rules" data-tip="Rules">
|
||||
<IconRuler />
|
||||
</A>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<A
|
||||
class="tooltip tooltip-bottom"
|
||||
href="/conns"
|
||||
data-tip="Connections"
|
||||
>
|
||||
<IconNetwork />
|
||||
</A>
|
||||
</li>
|
||||
<li>
|
||||
<A
|
||||
class="tooltip tooltip-bottom"
|
||||
href="/conns"
|
||||
data-tip="Connections"
|
||||
>
|
||||
<IconNetwork />
|
||||
</A>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<A class="tooltip tooltip-bottom" href="/logs" data-tip="Logs">
|
||||
<IconFileStack />
|
||||
</A>
|
||||
</li>
|
||||
<li>
|
||||
<A class="tooltip tooltip-bottom" href="/logs" data-tip="Logs">
|
||||
<IconFileStack />
|
||||
</A>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<A class="tooltip tooltip-bottom" href="/config" data-tip="Config">
|
||||
<IconSettings />
|
||||
</A>
|
||||
</li>
|
||||
<li>
|
||||
<A class="tooltip tooltip-bottom" href="/config" data-tip="Config">
|
||||
<IconSettings />
|
||||
</A>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<button
|
||||
class="tooltip tooltip-bottom"
|
||||
data-tip="Switch Endpoint"
|
||||
onClick={() => {
|
||||
setSelectedEndpoint('')
|
||||
<li>
|
||||
<button
|
||||
class="tooltip tooltip-bottom"
|
||||
data-tip="Switch Endpoint"
|
||||
onClick={() => {
|
||||
setSelectedEndpoint('')
|
||||
|
||||
navigate('/setup')
|
||||
}}
|
||||
>
|
||||
<IconNetworkOff />
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
navigate('/setup')
|
||||
}}
|
||||
>
|
||||
<IconNetworkOff />
|
||||
</button>
|
||||
</li>
|
||||
</Show>
|
||||
|
||||
<div class="drawer drawer-end ml-auto w-auto">
|
||||
<div class="drawer drawer-end w-auto sm:ml-auto">
|
||||
<input id="themes" type="checkbox" class="drawer-toggle" />
|
||||
|
||||
<div class="drawer-content">
|
||||
<label for="themes" class="btn drawer-button btn-sm m-2 uppercase">
|
||||
Themes
|
||||
<label for="themes" class="btn btn-primary drawer-button btn-sm">
|
||||
<IconPalette />
|
||||
</label>
|
||||
</div>
|
||||
|
||||
@ -107,6 +102,6 @@ export const Header = () => {
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ul>
|
||||
)
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user