70 lines
1.9 KiB
Plaintext
70 lines
1.9 KiB
Plaintext
---
|
|
import Logo from '@/components/header/Logo.astro';
|
|
import LogoLarge from '@/components/header/LogoLarge.astro';
|
|
import QRDialog from '@/components/image/QRDialog.astro';
|
|
import SearchIcon from '@/components/search/SearchIcon.astro';
|
|
import options from '@/options';
|
|
---
|
|
|
|
<header class="site-aside">
|
|
<div class="aside-overlay"></div>
|
|
<div class="aside-inner bg-secondary">
|
|
<h1 class="navbar-brand">
|
|
<a href={'/'} title={options.title} class="d-block">
|
|
<Logo />
|
|
</a>
|
|
</h1>
|
|
<div class="site-menu">
|
|
<ul>
|
|
{
|
|
options.navigation.map((menu, i) => (
|
|
<li id={`menu-item-${i}`} class={`menu-item ${i === 0 ? 'menu-item-home}' : ''}`}>
|
|
<a href={menu.link} target={menu.target}>
|
|
{menu.text}
|
|
</a>
|
|
</li>
|
|
))
|
|
}
|
|
</ul>
|
|
</div>
|
|
<div class="site-submenu">
|
|
{
|
|
options.socials.map((social) => {
|
|
if (social.type === 'qrcode') {
|
|
return (
|
|
<QRDialog url={social.link} name={social.name} title={social.title ?? social.name} icon={social.icon} />
|
|
);
|
|
} else {
|
|
return (
|
|
<a
|
|
href={social.link}
|
|
target={'_blank'}
|
|
title={social.title ?? social.name}
|
|
class="btn btn-dark btn-icon btn-circle button-social"
|
|
>
|
|
<span>
|
|
<i class={`iconfont ${social.icon}`} />
|
|
</span>
|
|
</a>
|
|
);
|
|
}
|
|
})
|
|
}
|
|
<SearchIcon />
|
|
</div>
|
|
</div>
|
|
</header>
|
|
<div class="mobile-brand">
|
|
<div class="container">
|
|
<div class="d-flex flex-flex align-items-center">
|
|
<a href="/" title={options.title} class="d-block">
|
|
<LogoLarge />
|
|
</a>
|
|
<div class="flex-fill"></div>
|
|
<div class="menu-toggler text-xl">
|
|
<i class="d-block iconfont icon-menu"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|