Korbs/sudovanilla-website
1
Fork 0
Code Issues Pull requests Activity

Update links, move theme button, fix mobile menu icon

Browse source
This commit is contained in:
Korbs 2024-12-03 23:05:34 -05:00
parent 7f4edf307f
commit f1cd50fe9d
1 changed files with 15 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
src/components/global/Header.astro
View file

@ -18,15 +18,20 @@ SunLight
<a class="header-link-item" href="/blog/">Blog</a>
<a class="header-link-item" href="https://ark.sudovanilla.org/">Ark</a>
<a class="header-link-item" href="/instances/">Instances</a>
<a class="header-link-item" href="/docs/">Docs</a>
<a class="header-link-item special" href="/donate/">Donate</a>
<!-- <a class="header-link-item" href="/init/">Init Privacy</a> -->
<a class="header-link-item" href="/donate/">Donate</a>
<a class="header-link-item" href="https://status.sudovanilla.org/">Status</a>
</div>
<a href="/"><SudoVanilla OnlyLogo WithLogo /></a>
<p>{MobileTitle}</p>
<button onclick="ToggleMobileMenu()">
<MenuScale/>
</button>
<div style="display: flex; align-items: center;">
<button id="toggle-da-theme" data-color-mode-switch style="display: none;"></button>
<button onclick="document.querySelector('#toggle-da-theme').click()" data-color-mode-switch class="theme-toggle-button theme-is-light"><SunLight/></button>
<button onclick="document.querySelector('#toggle-da-theme').click()" data-color-mode-switch class="theme-toggle-button theme-is-dark"><HalfMoon/></button>
<button style="color: white;" onclick="ToggleMobileMenu()">
<MenuScale/>
</button>
</div>
</mobilebar>
<header>
@ -34,18 +39,16 @@ SunLight
<div class="header-row-top">
<div>
<a href="/"><SudoVanilla WithLogo /></a>
<button id="toggle-da-theme" data-color-mode-switch style="display: none;"></button>
<button onclick="document.querySelector('#toggle-da-theme').click()" data-color-mode-switch class="theme-toggle-button theme-is-light"><SunLight/></button>
<button onclick="document.querySelector('#toggle-da-theme').click()" data-color-mode-switch class="theme-toggle-button theme-is-dark"><HalfMoon/></button>
</div>
<div>
<a class="header-link-item" href="/blog/">Blog</a>
<a class="header-link-item" href="https://ark.sudovanilla.org/">Ark</a>
<a class="header-link-item" href="/instances/">Instances</a>
<a class="header-link-item" href="/docs/">Docs</a>
<!-- <a class="header-link-item" href="/init/">Init Privacy</a> -->
<a class="header-link-item" href="/donate/">Donate</a>
<a class="header-link-item" href="https://status.sudovanilla.org/">Status</a>
<a class="header-link-item special" href="/donate/">Donate</a>
<button id="toggle-da-theme" data-color-mode-switch style="display: none;"></button>
<button onclick="document.querySelector('#toggle-da-theme').click()" data-color-mode-switch class="theme-toggle-button theme-is-light"><SunLight/></button>
<button onclick="document.querySelector('#toggle-da-theme').click()" data-color-mode-switch class="theme-toggle-button theme-is-dark"><HalfMoon/></button>
</div>
</div>
{
@ -243,6 +246,7 @@ mobilebar {
div:nth-child(1) {
display: flex;
gap: 12px;
align-items: center;
}
div:nth-child(2) {
display: flex;