diff options
| author | Fuwn <[email protected]> | 2023-12-18 23:02:57 -0800 |
|---|---|---|
| committer | Fuwn <[email protected]> | 2023-12-18 23:03:42 -0800 |
| commit | 67902af01df7c457cb498ccffd2cee912ee1efa6 (patch) | |
| tree | d65d3699effa0dc51cd96adbb34e72f98f318671 /src | |
| parent | refactor(layout): simplify bars (diff) | |
| download | due.moe-67902af01df7c457cb498ccffd2cee912ee1efa6.tar.xz due.moe-67902af01df7c457cb498ccffd2cee912ee1efa6.zip | |
feat(layout): unify mobile and desktop bars
Diffstat (limited to 'src')
| -rw-r--r-- | src/routes/+layout.svelte | 40 |
1 files changed, 11 insertions, 29 deletions
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 13290fce..856c6569 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -28,7 +28,7 @@ <div id="container"> <div id="header"> - <p id={$settings.displayHoverNavigation ? 'hover-header' : 'desktop-navigation-bar'}> + <p id={$settings.displayHoverNavigation ? 'hover-header' : ''}> 「 <a href="/">Home</a> • <a href="/completed">Completed</a> • <a href="/schedule">Anime Schedule</a> • <a href="/updates">Manga & WN Updates</a> • @@ -47,22 +47,10 @@ {/if} </p> - <div id="mobile-navigation-bar"> - <a href="/">Home</a> • <a href="/completed">Completed</a> • - <a href="/schedule">Anime Schedule</a> • - <a href="/updates">Manga & LN Updates</a> • - <a href="/tools">Tools</a> • - {#if data.user} - <a href={`/user/${currentUserIdentity.name}`}>Profile</a> • - {/if} - <br /> - <a href="/settings">Settings</a> - - <p /> - </div> - {#if !$settings.displayHoverNavigation} <hr /> + {:else} + <hr id="separator" /> {/if} </div> @@ -95,20 +83,6 @@ flex-direction: column; } - #mobile-navigation-bar { - display: none; - } - - @media (max-width: 640px) { - #desktop-navigation-bar { - display: none; - } - - #mobile-navigation-bar { - display: unset; - } - } - #hover-header { position: fixed; top: 0; @@ -121,6 +95,10 @@ width: 100%; } + #separator { + display: none; + } + @media (max-width: 640px) { #hover-header { opacity: 1; @@ -128,6 +106,10 @@ padding: 0; /* font-size: 5vw; */ } + + #separator { + display: block; + } } #hover-header:hover { |