Files
Wabenhain/src/components/reading-progress.tsx
T
Nick SzaunigandClaude Opus 5.5 dfda94ddfc feat(ui): Leseerlebnis fuer Wissen und rechtliche Seiten
- Artikel: Lesefortschritt als feine Honiglinie am oberen Rand, Initiale
  in Serifenschrift und Honig, groesserer Titel, angenehme Zeilenlaenge
- Wissen-Uebersicht und "Weitere Artikel" als ruhige Liste mit grossen
  Serifen-Titeln, Unterstrich und gezeichnetem Pfeil statt "→"
- Rechtliche Seiten mit klarerer Ueberschriften-Hierarchie

Co-Authored-By: Claude Opus 5.5 (1M context) <[email protected]>
2026-09-25 13:09:22 +02:00

22 lines
669 B
TypeScript

"use client";
import { motion, useScroll, useSpring } from "motion/react";
/**
* Feine Honiglinie am oberen Rand, die sich beim Lesen eines Artikels
* fuellt — zeigt, wie weit man ist, ohne vom Text abzulenken. Rein
* dekorativ fuer Sehende; die Seite bleibt ohne sie vollstaendig lesbar.
*/
export function ReadingProgress() {
const { scrollYProgress } = useScroll();
const scaleX = useSpring(scrollYProgress, { stiffness: 140, damping: 26, mass: 0.4 });
return (
<motion.div
aria-hidden="true"
style={{ scaleX }}
className="fixed inset-x-0 top-0 z-[55] h-[3px] origin-left bg-gradient-to-r from-honey-dark to-honey"
/>
);
}