diff --git a/public/fonts/MONETASANS-REGULAR.OTF b/public/fonts/MONETASANS-REGULAR.OTF new file mode 100644 index 0000000..5911e44 Binary files /dev/null and b/public/fonts/MONETASANS-REGULAR.OTF differ diff --git a/public/fonts/MonetaSans-Regular.ttf b/public/fonts/MonetaSans-Regular.ttf deleted file mode 100644 index 3c25209..0000000 --- a/public/fonts/MonetaSans-Regular.ttf +++ /dev/null @@ -1,11 +0,0 @@ - - - - - Error 404 (Not Found)!!1 - - -

404. That’s an error. -

The requested URL /s/moneta/v1/1Ptsg8zYS_SKggPNyC0IT4ttDfA.ttf was not found on this server. That’s all we know. diff --git a/public/fonts/RENNER_ 300 LIGHT.OTF b/public/fonts/RENNER_ 300 LIGHT.OTF new file mode 100644 index 0000000..010e0f9 Binary files /dev/null and b/public/fonts/RENNER_ 300 LIGHT.OTF differ diff --git a/public/fonts/RENNER_ 500 MEDIUM.OTF b/public/fonts/RENNER_ 500 MEDIUM.OTF new file mode 100644 index 0000000..c4e0cfb Binary files /dev/null and b/public/fonts/RENNER_ 500 MEDIUM.OTF differ diff --git a/public/fonts/RENNER_ 700 BOLD.OTF b/public/fonts/RENNER_ 700 BOLD.OTF new file mode 100644 index 0000000..6bc7b21 Binary files /dev/null and b/public/fonts/RENNER_ 700 BOLD.OTF differ diff --git a/public/fonts/SAMANTHA SIGNATURE.OTF b/public/fonts/SAMANTHA SIGNATURE.OTF new file mode 100644 index 0000000..addf7ca Binary files /dev/null and b/public/fonts/SAMANTHA SIGNATURE.OTF differ diff --git a/public/fonts/Samantha-Signature.ttf b/public/fonts/Samantha-Signature.ttf deleted file mode 100644 index f581726..0000000 --- a/public/fonts/Samantha-Signature.ttf +++ /dev/null @@ -1,105 +0,0 @@ - - - - - - - - - - - - -Dafont Free | Download free fonts - - - - - - - - - - - - - - - - -

-
-
- -
-
-
-
- - -
-
-

Latest update | page 1 of 20,647

1234520647
-
-
-
-
-
-
-
-
-
-
-
-
-
- -
- - - -
- -
Copyright © 2020 - Version 2.0
- diff --git a/src/app/globals.css b/src/app/globals.css index a25d5bd..563bfb9 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -5,17 +5,31 @@ /* Renner font */ @font-face { font-family: 'Renner*'; - src: url('/fonts/Renner-Light.woff2') format('woff2'), - url('/fonts/Renner-Light.woff') format('woff'); + src: url('/fonts/RENNER_ 300 LIGHT.OTF') format('opentype'); font-weight: 300; font-style: normal; font-display: swap; } +@font-face { + font-family: 'Renner*'; + src: url('/fonts/RENNER_ 500 MEDIUM.OTF') format('opentype'); + font-weight: 500; + font-style: normal; + font-display: swap; +} +@font-face { + font-family: 'Renner*'; + src: url('/fonts/RENNER_ 700 BOLD.OTF') format('opentype'); + font-weight: 700; + font-style: normal; + font-display: swap; +} + /* Samantha Signature font */ @font-face { font-family: 'Samantha Signature'; - src: url('/fonts/Samantha-Signature.ttf') format('truetype'); + src: url('/fonts/SAMANTHA SIGNATURE.OTF') format('opentype'); font-weight: normal; font-style: normal; font-display: swap; @@ -24,7 +38,7 @@ /* MonetaSans-Regular font */ @font-face { font-family: 'MonetaSans-Regular'; - src: url('/fonts/MonetaSans-Regular.ttf') format('truetype'); + src: url('/fonts/MONETASANS-REGULAR.OTF') format('opentype'); font-weight: normal; font-style: normal; font-display: swap; @@ -446,3 +460,10 @@ html { maximum-scale: 5; user-scalable: yes; } +.no-scrollbar::-webkit-scrollbar { + display: none; +} +.no-scrollbar { + -ms-overflow-style: none; /* IE and Edge */ + scrollbar-width: none; /* Firefox */ +} diff --git a/src/app/page.tsx b/src/app/page.tsx index c867d4d..5f01fd5 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,77 +1,77 @@ -'use client'; +"use client"; -import { motion } from 'framer-motion'; -import Header from '@/components/Header'; -import Footer from '@/components/Footer'; -import Section from '@/components/Section'; -import Button from '@/components/Button'; -import BannerSlider from '@/components/BannerSlider'; -import Image from 'next/image'; -import { useState, useEffect, useRef, useCallback, useMemo } from 'react'; -import { AnimatePresence } from 'framer-motion'; -import { useInstagram } from '@/hooks/useInstagram'; +import { motion } from "framer-motion"; +import Header from "@/components/Header"; +import Footer from "@/components/Footer"; +import Section from "@/components/Section"; +import Button from "@/components/Button"; +import BannerSlider from "@/components/BannerSlider"; +import Image from "next/image"; +import { useState, useEffect, useRef, useCallback, useMemo } from "react"; +import { AnimatePresence } from "framer-motion"; +import { useInstagram } from "@/hooks/useInstagram"; // Premium animation variants const fadeInUp = { initial: { opacity: 0, y: 30 }, animate: { opacity: 1, y: 0 }, - transition: { duration: 0.8, ease: [0.25, 0.46, 0.45, 0.94] } + transition: { duration: 0.8, ease: [0.25, 0.46, 0.45, 0.94] }, }; const fadeInLeft = { initial: { opacity: 0, x: -30 }, animate: { opacity: 1, x: 0 }, - transition: { duration: 0.8, ease: [0.25, 0.46, 0.45, 0.94] } + transition: { duration: 0.8, ease: [0.25, 0.46, 0.45, 0.94] }, }; const fadeInRight = { initial: { opacity: 0, x: 30 }, animate: { opacity: 1, x: 0 }, - transition: { duration: 0.8, ease: [0.25, 0.46, 0.45, 0.94] } + transition: { duration: 0.8, ease: [0.25, 0.46, 0.45, 0.94] }, }; const staggerContainer = { animate: { transition: { - staggerChildren: 0.2 - } - } + staggerChildren: 0.2, + }, + }, }; const categories = [ - 'Bars', - 'Barks', - 'Pralines', - 'Spreads', - 'Dragees', - 'Gelatos', + "Bars", + "Barks", + "Pralines", + "Spreads", + "Dragees", + "Gelatos", ]; const categoryImages = [ - '/categories/c1.svg', - '/categories/c2.svg', - '/categories/c3.svg', - '/categories/c4.svg', - '/categories/c5.svg', - '/categories/c6.svg', + "/categories/c1.svg", + "/categories/c2.svg", + "/categories/c3.svg", + "/categories/c4.svg", + "/categories/c5.svg", + "/categories/c6.svg", ]; const partnerImages = [ - '/partners/p1.svg', - '/partners/p2.svg', - '/partners/p3.svg', - '/partners/p4.svg', + "/partners/p1.svg", + "/partners/p2.svg", + "/partners/p3.svg", + "/partners/p4.svg", ]; export default function Home() { const [currentCategory, setCurrentCategory] = useState(0); const categoriesSectionRef = useRef(null); const currentCategoryRef = useRef(currentCategory); - + // Update ref when currentCategory changes useEffect(() => { currentCategoryRef.current = currentCategory; }, [currentCategory]); - + // Optimized wheel event handler const handleWheel = useCallback((e: WheelEvent) => { e.preventDefault(); @@ -80,12 +80,12 @@ export default function Home() { if (e.deltaY > 0) { // Scroll down - next category if (currentCategoryRef.current < categories.length - 1) { - setCurrentCategory(prev => prev + 1); + setCurrentCategory((prev) => prev + 1); } } else if (e.deltaY < 0) { // Scroll up - previous category if (currentCategoryRef.current > 0) { - setCurrentCategory(prev => prev - 1); + setCurrentCategory((prev) => prev - 1); } } }, []); @@ -94,16 +94,16 @@ export default function Home() { useEffect(() => { const section = categoriesSectionRef.current; if (!section) return; - + let isScrolling = false; let scrollTimeout: NodeJS.Timeout; - + const onWheel = (e: WheelEvent) => { if (isScrolling) return; - + isScrolling = true; clearTimeout(scrollTimeout); - + handleWheel(e); // Reset scrolling flag after delay @@ -111,10 +111,10 @@ export default function Home() { isScrolling = false; }, 800); }; - - section.addEventListener('wheel', onWheel, { passive: false }); + + section.addEventListener("wheel", onWheel, { passive: false }); return () => { - section.removeEventListener('wheel', onWheel); + section.removeEventListener("wheel", onWheel); clearTimeout(scrollTimeout); }; }, [handleWheel]); @@ -130,108 +130,118 @@ export default function Home() { const { posts, loading, error, isTokenExpired } = useInstagram(); // Memoize expensive components - const BrandStorySection = useMemo(() => ( -
-
- {/* Left Column - Text */} - - ( +
+
+ {/* Left Column - Text */} + - Brand Story - -
- + Brand Story + +
+ + Mozimo's journey is a passionate pursuit of crafting + exceptional chocolate that celebrates the origin of each cocoa + bean. + + + We meticulously roast, crack, winnow, and refine beans in-house, + using modern techniques to highlight their natural flavors. + + + Each chocolate is a masterpiece, capturing the essence of cocoa + in its purest form. + +
+ - Mozimo's journey is a passionate pursuit of crafting exceptional chocolate that celebrates the origin of each cocoa bean. - - - We meticulously roast, crack, winnow, and refine beans in-house, using modern techniques to highlight their natural flavors. - - - Each chocolate is a masterpiece, capturing the essence of cocoa in its purest form. - -
- - + + - - {/* Right Column - Image */} - - - Cocoa pods and beans - Mozimo chocolate ingredients - {/* Premium overlay for depth */} -
+ + Cocoa pods and beans - Mozimo chocolate ingredients + {/* Premium overlay for depth */} +
+ - -
-
- ), []); - +
+
+ ), + [] + ); + return (
@@ -248,13 +258,13 @@ export default function Home() { whileInView="animate" viewport={{ once: true, margin: "-50px" }} variants={fadeInLeft} - className="relative order-1 lg:order-1" + className="relative order-1 lg:order-1 w-screen md:w-auto -mx-4 md:mx-0" // ← Added for mobile edge-to-edge > -