diff --git a/resources/js/components/common/PawsDecoration.tsx b/resources/js/components/common/PawsDecoration.tsx new file mode 100644 index 0000000..1a87b72 --- /dev/null +++ b/resources/js/components/common/PawsDecoration.tsx @@ -0,0 +1,13 @@ +import {SVGAttributes} from "react"; + +export default function PawsDecoration(props: SVGAttributes) { + return ( + + + + + + ); +} + + diff --git a/resources/js/components/features/home/HeroSection.tsx b/resources/js/components/features/home/HeroSection.tsx index a10897b..4844b66 100644 --- a/resources/js/components/features/home/HeroSection.tsx +++ b/resources/js/components/features/home/HeroSection.tsx @@ -4,9 +4,12 @@ import { Button } from '@/components/ui/button'; import { dashboard, membership } from '@/routes'; import { type SharedData } from '@/types'; import illustrationImage from '@/img/utils/lrl-illustration.png'; +import PawsDecoration from '@/components/common/PawsDecoration'; +import { useParallax } from '@/hooks/use-parallax'; export function HeroSection() { const { auth } = usePage().props; + const pawsRef = useParallax(0.12); const scrollToFirstSection = () => { document.getElementById('first-section')?.scrollIntoView({ behavior: 'smooth' }); @@ -15,7 +18,7 @@ export function HeroSection() { return (
{/* Contenu principal */}
@@ -43,6 +46,10 @@ export function HeroSection() {
+
+ +
+ {/* Flèche vers la première section */}