Compare commits

..

No commits in common. "ead5dc13c17db0101f36ad5ff36e503686066183" and "fa1ba0f299408f492142208ef2195c10c8c89c92" have entirely different histories.

2 changed files with 2 additions and 16 deletions

View file

@ -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">

View file

@ -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">