Compare commits
No commits in common. "ead5dc13c17db0101f36ad5ff36e503686066183" and "fa1ba0f299408f492142208ef2195c10c8c89c92" have entirely different histories.
ead5dc13c1
...
fa1ba0f299
2 changed files with 2 additions and 16 deletions
|
|
@ -1,6 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, computed, watch } from 'vue'
|
||||
import { useWindowScroll } from '@vueuse/core'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { RouterLink, useRoute } from 'vue-router'
|
||||
import { cn } from '@/lib/utils'
|
||||
|
|
@ -27,18 +26,6 @@ const route = useRoute()
|
|||
|
||||
const mobileOpen = ref(false)
|
||||
|
||||
// Hide the header on scroll-down, reveal on scroll-up — the standard VueUse
|
||||
// recipe: `useWindowScroll` for the reactive position, then compare against
|
||||
// the watcher's previous value for direction. Always shown near the top of
|
||||
// the page; the 8px deadband stops jitter from tiny scroll deltas.
|
||||
const hidden = ref(false)
|
||||
const { y } = useWindowScroll()
|
||||
watch(y, (cur, prev) => {
|
||||
if (cur < 80) hidden.value = false
|
||||
else if (cur - prev > 8) hidden.value = true
|
||||
else if (prev - cur > 8) hidden.value = false
|
||||
})
|
||||
|
||||
interface NavItem {
|
||||
to: string
|
||||
label: string
|
||||
|
|
@ -101,8 +88,7 @@ watch(() => route.path, closeMobile)
|
|||
|
||||
<template>
|
||||
<header
|
||||
class="sticky top-0 z-40 border-b border-white/10 bg-background/65 backdrop-blur-xl backdrop-saturate-150 transition-transform duration-300 ease-out"
|
||||
:class="hidden && !mobileOpen ? '-translate-y-full' : 'translate-y-0'"
|
||||
class="sticky top-0 z-40 border-b border-white/10 bg-background/65 backdrop-blur-xl backdrop-saturate-150"
|
||||
>
|
||||
<div class="mx-auto max-w-7xl px-4 lg:px-6">
|
||||
<div class="flex h-16 items-center justify-between gap-4">
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ const hasAside = () => !!slots.aside
|
|||
<p v-if="kicker" class="font-display text-xs uppercase tracking-[0.3em] text-accent">
|
||||
{{ kicker }}
|
||||
</p>
|
||||
<h1 class="mt-3 font-display text-3xl uppercase leading-tight tracking-wider md:text-5xl">
|
||||
<h1 class="mt-3 font-display text-4xl uppercase leading-tight tracking-wider md:text-5xl">
|
||||
{{ title }}
|
||||
</h1>
|
||||
<p v-if="lede" class="mt-6 max-w-prose text-lg leading-relaxed text-foreground/90">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue