youwen5/site
1
0
Fork 0
mirror of https://github.com/youwen5/site.git synced 2024-11-24 17:33:51 -08:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: hide navbar on blog posts to reduce clutter

Browse source
This commit is contained in:
Youwen Wu 2024-05-13 00:16:22 -07:00
parent 9440516e0a
commit 8bc54c76ae
Signed by: youwen5
GPG key ID: 865658ED1FE61EC3
2 changed files with 19 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
src/lib/components/Navbar/Navbar.svelte
View file

@ -9,12 +9,21 @@
import Button from '../ui/button/button.svelte'
import { Moon, Sun } from 'svelte-radix'
let current: 'blog' | 'about' | 'home' | 'portfolio' | string
let current: 'blogpost' | 'blog' | 'about' | 'home' | 'portfolio' | string
const updateCurrent = () => {
const path = window.location.pathname
if (path === '/') {
current = 'home'
// if (path === '/') {
// current = 'home'
// } else {
// const segments = path.split('/')
// current = segments[1] || 'home'
// }
if (path === '/blog') {
current = 'blog'
} else if (path.startsWith('/blog')) {
current = 'blogpost'
} else {
const segments = path.split('/')
current = segments[1] || 'home'
@ -24,10 +33,14 @@
onMount(() => navigating.subscribe(updateCurrent))
</script>
<nav class="h-16 lg:h-24 bg-background bg-opacity-50 backdrop-blur-lg fixed w-full z-40 font-serif">
<nav
class="h-16 lg:h-24 bg-background bg-opacity-50 backdrop-blur-lg md:fixed w-full z-40 font-serif"
class:fixed={current !== 'blogpost'}
class:absolute={current === 'blogpost'}
>
<div class="container mx-auto flex justify-between items-center h-full gap-6 overflow-x-auto">
<Drawer />
{#if current === 'blog'}
{#if current === 'blog' || current === 'blogpost'}
<Coredump height="95%" href="/blog" />
{:else}
<Name height="95%" href="/" />

2
src/lib/components/Toc/TocHeader.svelte
View file

@ -23,7 +23,7 @@
}
</script>
<nav class="fixed top-16 left-0 w-full bg-background bg-opacity-50 backdrop-blur-lg z-30 lg:hidden">
<nav class="sticky top-0 left-0 w-full bg-background bg-opacity-50 backdrop-blur-lg z-30 lg:hidden">
<Accordion.Root class="px-8" bind:value>
<Accordion.Item value="toc">
<Accordion.Trigger