bender/6f6c5e78-9ee1-4bdb-b92e-e19a18b28169
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

Merge version_35 into main #53

Merged
bender merged 1 commits from version_35 into main 2026-03-21 22:59:20 +00:00
Conversation 0 Commits 1 Files Changed 1 +34 -91
1 changed files with 34 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

125
src/app/page.tsx
View File

@@ -17,8 +17,8 @@ export default function LandingPage() {
const [showBackToTop, setShowBackToTop] = useState(false);
const [showViewMoreButton, setShowViewMoreButton] = useState(false);
const [showShoesArrow, setShowShoesArrow] = useState(false);
const [showShoesMoreButton, setShowShoesMoreButton] = useState(false);
const [showVeilsMoreButton, setShowVeilsMoreButton] = useState(false);
const [showShoesMoreButton, setShowShoesMoreButton] = useState(true);
const [showVeilsMoreButton, setShowVeilsMoreButton] = useState(true);
const [scrollDirection, setScrollDirection] = useState<'up' | 'down'>('down');
const [lastScrollY, setLastScrollY] = useState(0);
const viewMoreButtonRef = useRef<HTMLDivElement>(null);
@@ -62,38 +62,6 @@ export default function LandingPage() {
}
}
// Check if shoes container (with button) is in view
if (shoesContainerRef.current) {
const shoesContainerRect = shoesContainerRef.current.getBoundingClientRect();
const shoesContainerInView = shoesContainerRect.top < window.innerHeight && shoesContainerRect.bottom > 0;
// Show more button when scrolled past shoes section
// Hide when user scrolls back to shoes area
if (!shoesContainerInView && currentScrollY > lastScrollY) {
// We've scrolled past the shoes section, show the more button
setShowShoesMoreButton(true);
} else if (shoesContainerInView && currentScrollY < lastScrollY) {
// We're back at or above the shoes section, hide the button
setShowShoesMoreButton(false);
}
}
// Check if veils container (with button) is in view
if (veilsContainerRef.current) {
const veilsContainerRect = veilsContainerRef.current.getBoundingClientRect();
const veilsContainerInView = veilsContainerRect.top < window.innerHeight && veilsContainerRect.bottom > 0;
// Show more button when scrolled past veils section
// Hide when user scrolls back to veils area
if (!veilsContainerInView && currentScrollY > lastScrollY) {
// We've scrolled past the veils section, show the more button
setShowVeilsMoreButton(true);
} else if (veilsContainerInView && currentScrollY < lastScrollY) {
// We're back at or above the veils section, hide the button
setShowVeilsMoreButton(false);
}
}
ticking = false;
});
ticking = true;
@@ -331,35 +299,18 @@ export default function LandingPage() {
</button>
)}
{/* Fixed "Go to Shoes" Button - With scroll detection */}
{!showShoesArrow && (
<button
onClick={scrollToShoes}
className="fixed right-6 bottom-20 z-40 w-12 h-12 rounded-full bg-gradient-to-r from-[#D4AF37] to-[#D4AF37] text-black shadow-lg hover:shadow-2xl transition-all duration-300 ease-out flex items-center justify-center hover:scale-110 active:scale-95"
aria-label="Go to Shoes"
title="Go to Shoes"
>
<div className="flex flex-col items-center justify-center gap-0.5">
<ArrowDown className="w-4 h-4" />
<span className="text-xs font-semibold text-center leading-tight">Shoes</span>
</div>
</button>
)}
{/* Fixed "Back to Shoes" Button - Appears when scrolled past shoes */}
{showShoesArrow && (
<button
onClick={scrollToShoes}
className="fixed right-6 bottom-20 z-40 w-12 h-12 rounded-full bg-gradient-to-r from-[#D4AF37] to-[#D4AF37] text-black shadow-lg hover:shadow-2xl transition-all duration-300 ease-out flex items-center justify-center hover:scale-110 active:scale-95 animate-in fade-in slide-in-from-bottom-4"
aria-label="Back to Shoes"
title="Back to Shoes"
>
<div className="flex flex-col items-center justify-center gap-0.5">
<ArrowUp className="w-4 h-4" />
<span className="text-xs font-semibold text-center leading-tight">Shoes</span>
</div>
</button>
)}
{/* Fixed "Go to Shoes" Button - Always visible */}
<button
onClick={scrollToShoes}
className="fixed right-6 bottom-20 z-40 w-12 h-12 rounded-full bg-gradient-to-r from-[#D4AF37] to-[#D4AF37] text-black shadow-lg hover:shadow-2xl transition-all duration-300 ease-out flex items-center justify-center hover:scale-110 active:scale-95"
aria-label="Go to Shoes"
title="Go to Shoes"
>
<div className="flex flex-col items-center justify-center gap-0.5">
<ArrowDown className="w-4 h-4" />
<span className="text-xs font-semibold text-center leading-tight">Shoes</span>
</div>
</button>
{/* Fixed Top Social & Contact Bar */}
<div className="fixed top-0 left-0 right-0 z-50 bg-[#D4AF37] text-black py-3 px-4 flex items-center justify-center gap-6">
@@ -667,20 +618,16 @@ export default function LandingPage() {
]}
/>
{/* More Button for Shoes - Positioned after shoes section */}
<div className="relative mt-0">
{showShoesMoreButton && (
<div className="absolute -top-[280px] right-8 lg:right-16 z-30 flex justify-end animate-in fade-in slide-in-from-bottom-4 duration-300">
<button
onClick={scrollToVeils}
className="group relative inline-flex items-center gap-2 px-4 md:px-6 py-2 md:py-3 bg-gradient-to-r from-[#D4AF37] to-[#D4AF37] text-black rounded-lg font-semibold hover:shadow-lg transition-all duration-300 ease-out shadow-lg"
aria-label="View More Shoes"
>
<span className="text-sm md:text-base">View More</span>
<ChevronRight className="w-4 h-4 md:w-5 md:h-5 group-hover:translate-x-1 transition-transform" />
</button>
</div>
)}
{/* More Button for Shoes - Always visible */}
<div className="fixed right-6 bottom-8 z-30 flex justify-end">
<button
onClick={scrollToVeils}
className="group relative inline-flex items-center gap-2 px-4 md:px-6 py-2 md:py-3 bg-gradient-to-r from-[#D4AF37] to-[#D4AF37] text-black rounded-lg font-semibold hover:shadow-lg transition-all duration-300 ease-out shadow-lg"
aria-label="View More Shoes"
>
<span className="text-sm md:text-base">View More</span>
<ChevronRight className="w-4 h-4 md:w-5 md:h-5 group-hover:translate-x-1 transition-transform" />
</button>
</div>
</div>
</div>
@@ -719,20 +666,16 @@ export default function LandingPage() {
]}
/>
{/* More Button for Veils - Positioned after veils section */}
<div className="relative mt-0">
{showVeilsMoreButton && (
<div className="absolute -top-[280px] right-8 lg:right-16 z-30 flex justify-end animate-in fade-in slide-in-from-bottom-4 duration-300">
<button
onClick={scrollToVeils}
className="group relative inline-flex items-center gap-2 px-4 md:px-6 py-2 md:py-3 bg-gradient-to-r from-[#D4AF37] to-[#D4AF37] text-black rounded-lg font-semibold hover:shadow-lg transition-all duration-300 ease-out shadow-lg"
aria-label="View More Veils"
>
<span className="text-sm md:text-base">View More</span>
<ChevronRight className="w-4 h-4 md:w-5 md:h-5 group-hover:translate-x-1 transition-transform" />
</button>
</div>
)}
{/* More Button for Veils - Always visible */}
<div className="fixed right-6 bottom-8 z-30 flex justify-end">
<button
onClick={scrollToVeils}
className="group relative inline-flex items-center gap-2 px-4 md:px-6 py-2 md:py-3 bg-gradient-to-r from-[#D4AF37] to-[#D4AF37] text-black rounded-lg font-semibold hover:shadow-lg transition-all duration-300 ease-out shadow-lg"
aria-label="View More Veils"
>
<span className="text-sm md:text-base">View More</span>
<ChevronRight className="w-4 h-4 md:w-5 md:h-5 group-hover:translate-x-1 transition-transform" />
</button>
</div>
</div>
</div>