diff options
| author | Fuwn <[email protected]> | 2024-01-04 20:30:21 -0800 |
|---|---|---|
| committer | Fuwn <[email protected]> | 2024-01-04 20:30:21 -0800 |
| commit | 6fa883da369eafcc38210a172d0bd20a7870d798 (patch) | |
| tree | 9290cc3db49a7e3592439faecb680dc28b587dcd /src/routes/+layout.svelte | |
| parent | feat(css): new font combo (diff) | |
| download | due.moe-6fa883da369eafcc38210a172d0bd20a7870d798.tar.xz due.moe-6fa883da369eafcc38210a172d0bd20a7870d798.zip | |
feat(layout): style navigation
Diffstat (limited to 'src/routes/+layout.svelte')
| -rw-r--r-- | src/routes/+layout.svelte | 29 |
1 files changed, 19 insertions, 10 deletions
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index becb8b58..f1a99fc7 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -35,17 +35,20 @@ <HeadTitle /> <div id="container"> - <div id="header"> - <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> • - <a href="/tools">Tools</a> • {#if data.user} - <a href={`/user/${currentUserIdentity.name}`}>Profile</a> • - {/if} <a href="/settings">Settings</a> 」 + <div id="header" class="card card-centered"> + <div id={$settings.displayHoverNavigation ? 'hover-header' : ''}> + <a href="/" class="header-item">Home</a><a href="/completed" class="header-item">Completed</a> + <a href="/schedule" class="header-item">Anime Schedule</a> + <a href="/updates" class="header-item">Manga & WN Updates</a> + <a href="/tools" class="header-item">Tools</a>{#if data.user} + <a href={`/user/${currentUserIdentity.name}`} class="header-item">Profile</a> + {/if} <a href="/settings" class="header-item">Settings</a> + + <span style="opacity: 50%; font-weight: bold;">|</span> {#if data.user === undefined} <a + class="header-item" href={`https://anilist.co/api/v2/oauth/authorize?client_id=${env.PUBLIC_ANILIST_CLIENT_ID}&redirect_uri=${env.PUBLIC_ANILIST_REDIRECT_URI}&response_type=code`} on:click={() => { localStorage.setItem( @@ -57,15 +60,17 @@ Log in with AniList </a> {:else} - <a href="/api/authentication/log-out" + <a href="/api/authentication/log-out" class="header-item" >Log out<button class="smaller-button button-badge badge-info" >{currentUserIdentity.name}</button ></a > {/if} - </p> + </div> </div> + <p /> + <slot /> </div> @@ -123,4 +128,8 @@ :global(a:hover) { text-decoration: underline; } + + .header-item { + margin: 0 0.625rem; + } </style> |