Merge version_2 into main #1

Merged
bender merged 3 commits from version_2 into main 2026-04-23 00:41:43 +00:00
3 changed files with 213 additions and 212 deletions

View File

@@ -0,0 +1,79 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import { useState } from 'react';
export default function AnimeCatalogPage() {
const [filter, setFilter] = useState("all");
const allAnime = [
{ id: "1", name: "Cyber Samurai", price: "Action", variant: "2024", imageSrc: "http://img.b2bpic.net/free-photo/concept-halloween-celebration-covid-19-pandemic_1258-18691.jpg" },
{ id: "2", name: "Neon Maiden", price: "Sci-Fi", variant: "2023", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-standing-universe-texture-projection_23-2149512126.jpg" },
{ id: "3", name: "Shadow Knight", price: "Fantasy", variant: "2024", imageSrc: "http://img.b2bpic.net/free-photo/ramadan-boxes-with-lantern-perspective-side_187299-38087.jpg" },
{ id: "4", name: "Cloud Princess", price: "Adventure", variant: "2022", imageSrc: "http://img.b2bpic.net/free-photo/high-tech-portrait-young-girl-with-futuristic-style_23-2151133569.jpg" },
{ id: "5", name: "Dragon Soul", price: "Action", variant: "2024", imageSrc: "http://img.b2bpic.net/free-photo/dark-style-ninja-naruto_23-2151278793.jpg" },
{ id: "6", name: "Elemental Mage", price: "Fantasy", variant: "2023", imageSrc: "http://img.b2bpic.net/free-photo/high-tech-portrait-young-girl-with-futuristic-style_23-2151133576.jpg" },
];
const filteredAnime = filter === "all" ? allAnime : allAnime.filter(a => a.price === filter);
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="mediumLarge"
sizing="mediumLargeSizeLargeTitles"
background="circleGradient"
cardStyle="layered-gradient"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="glass"
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "/" },
{ name: "Catalog", id: "/anime-catalog" },
{ name: "Community", id: "/" },
]}
brandName="AniPortal"
/>
</div>
<div className="pt-32 pb-16 px-4 md:px-8">
<div className="max-w-7xl mx-auto">
<h1 className="text-4xl md:text-5xl font-bold mb-8">Anime Library</h1>
<div className="flex gap-4 mb-8">
{["all", "Action", "Fantasy", "Sci-Fi", "Adventure"].map((f) => (
<button
key={f}
onClick={() => setFilter(f)}
className={`px-4 py-2 rounded-full border transition ${filter === f ? "bg-primary text-white" : "hover:bg-gray-100"}`}>
{f.charAt(0).toUpperCase() + f.slice(1)}
</button>
))}
</div>
<ProductCardFour
products={filteredAnime}
gridVariant="four-items-2x2-equal-grid"
animationType="slide-up"
title=""
description=""
useInvertedBackground={false}
/>
</div>
</div>
<FooterBaseReveal
logoText="AniPortal"
columns={[]}
/>
</ReactLenis>
</ThemeProvider>
);
}

View File

@@ -32,21 +32,13 @@ export default function LandingPage() {
<NavbarStyleCentered
navItems={[
{
name: "Home",
id: "home",
},
name: "Home", id: "home"},
{
name: "Series",
id: "featured",
},
name: "Series", id: "featured"},
{
name: "Community",
id: "metrics",
},
name: "Community", id: "metrics"},
{
name: "FAQ",
id: "faq",
},
name: "FAQ", id: "faq"},
]}
brandName="AniPortal"
/>
@@ -56,98 +48,55 @@ export default function LandingPage() {
<HeroBillboardTestimonial
useInvertedBackground={false}
background={{
variant: "sparkles-gradient",
}}
variant: "sparkles-gradient"}}
title="Immerse Yourself in Anime"
description="Discover your next obsession. Join the largest community of anime fans worldwide."
testimonials={[
{
name: "Akira K.",
handle: "@akira_chan",
testimonial: "The best place to track my favorite series!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/androgynous-avatar-non-binary-queer-person_23-2151100254.jpg",
},
name: "Akira K.", handle: "@akira_chan", testimonial: "The best place to track my favorite series!", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/androgynous-avatar-non-binary-queer-person_23-2151100254.jpg"},
{
name: "Kenji M.",
handle: "@kenji_m",
testimonial: "I love the community discussions here.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/androgynous-avatar-non-binary-queer-person_23-2151100248.jpg",
},
name: "Kenji M.", handle: "@kenji_m", testimonial: "I love the community discussions here.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/androgynous-avatar-non-binary-queer-person_23-2151100248.jpg"},
{
name: "Yuki S.",
handle: "@yuki_s",
testimonial: "So many recommendations, I never run out.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/paintings-cute-kid-s-portrait_23-2151155258.jpg",
},
name: "Yuki S.", handle: "@yuki_s", testimonial: "So many recommendations, I never run out.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/paintings-cute-kid-s-portrait_23-2151155258.jpg"},
{
name: "Hiroshi T.",
handle: "@hiroshi_t",
testimonial: "High quality interface, really feels modern.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/androgynous-avatar-non-binary-queer-person_23-2151100209.jpg",
},
name: "Hiroshi T.", handle: "@hiroshi_t", testimonial: "High quality interface, really feels modern.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/androgynous-avatar-non-binary-queer-person_23-2151100209.jpg"},
{
name: "Mina K.",
handle: "@mina_k",
testimonial: "The community insights are unparalleled.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/digital-art-portrait-asian-female_23-2151836592.jpg",
},
name: "Mina K.", handle: "@mina_k", testimonial: "The community insights are unparalleled.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/digital-art-portrait-asian-female_23-2151836592.jpg"},
]}
buttons={[
{
text: "Explore Now",
href: "#featured",
},
text: "Explore Now", href: "#featured"},
]}
imageSrc="http://img.b2bpic.net/free-photo/fantasy-style-fire_23-2151099756.jpg"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/digital-art-young-student-school_23-2151065217.jpg",
alt: "Anime fan",
},
src: "http://img.b2bpic.net/free-photo/digital-art-young-student-school_23-2151065217.jpg", alt: "Anime fan"},
{
src: "http://img.b2bpic.net/free-photo/androgynous-avatar-non-binary-queer-person_23-2151100232.jpg",
alt: "Anime fan",
},
src: "http://img.b2bpic.net/free-photo/androgynous-avatar-non-binary-queer-person_23-2151100232.jpg", alt: "Anime fan"},
{
src: "http://img.b2bpic.net/free-photo/androgynous-avatar-non-binary-queer-person_23-2151100169.jpg",
alt: "Anime fan",
},
src: "http://img.b2bpic.net/free-photo/androgynous-avatar-non-binary-queer-person_23-2151100169.jpg", alt: "Anime fan"},
{
src: "http://img.b2bpic.net/free-photo/medium-shot-little-girl-indoors_23-2151061746.jpg",
alt: "Anime fan",
},
src: "http://img.b2bpic.net/free-photo/medium-shot-little-girl-indoors_23-2151061746.jpg", alt: "Anime fan"},
{
src: "http://img.b2bpic.net/free-photo/digital-art-portrait-asian-man_23-2151836582.jpg",
alt: "Anime fan",
},
src: "http://img.b2bpic.net/free-photo/digital-art-portrait-asian-man_23-2151836582.jpg", alt: "Anime fan"},
]}
avatarText="Join 1.5M+ fans"
marqueeItems={[
{
type: "text",
text: "New Series Drops",
},
type: "text", text: "New Series Drops"},
{
type: "text",
text: "Community Events",
},
type: "text", text: "Community Events"},
{
type: "text",
text: "Exclusive Merch",
},
type: "text", text: "Exclusive Merch"},
{
type: "text",
text: "Live Discussions",
},
type: "text", text: "Live Discussions"},
{
type: "text",
text: "Fan Art Showcases",
},
type: "text", text: "Fan Art Showcases"},
]}
/>
</div>
@@ -155,8 +104,8 @@ export default function LandingPage() {
<div id="about" data-section="about">
<MediaAbout
useInvertedBackground={true}
title="Where Anime Lives"
description="We are dedicated to bringing the best anime experience to your screens. From trending series to hidden gems, find everything you love in one place."
title="The Ultimate Anime Companion"
description="AniPortal is built by fans, for fans. Our platform aggregates data from global streaming sources, offers advanced tracking for your watchlists, and connects you with a passionate community discussing the latest simulcasts."
imageSrc="http://img.b2bpic.net/free-photo/anime-style-character-space_23-2151134173.jpg"
/>
</div>
@@ -169,20 +118,11 @@ export default function LandingPage() {
useInvertedBackground={false}
metrics={[
{
id: "1",
value: "1.5M+",
description: "Active Anime Fans",
},
id: "1", value: "1.5M+", description: "Active Anime Fans"},
{
id: "2",
value: "50K+",
description: "Series Catalog",
},
id: "2", value: "50K+", description: "Series Catalog"},
{
id: "3",
value: "120+",
description: "Global Regions",
},
id: "3", value: "120+", description: "Global Regions"},
]}
title="Community Power"
description="See the passion driving our platform."
@@ -195,48 +135,14 @@ export default function LandingPage() {
useInvertedBackground={true}
testimonials={[
{
id: "1",
title: "Great Experience",
quote: "I found so many new shows here.",
name: "Akira K.",
role: "Fan",
imageSrc: "http://img.b2bpic.net/free-photo/futuristic-fantasy-portrait-with-costume_23-2151159175.jpg",
},
id: "1", title: "Essential for tracking", quote: "I haven't missed a new episode since I started using this tracker.", name: "Sora T.", role: "Hardcore Fan", imageSrc: "http://img.b2bpic.net/free-photo/futuristic-fantasy-portrait-with-costume_23-2151159175.jpg"},
{
id: "2",
title: "Amazing UI",
quote: "The design is super smooth.",
name: "Kenji M.",
role: "Fan",
imageSrc: "http://img.b2bpic.net/free-photo/digital-art-portrait-asian-woman_23-2151836552.jpg",
},
id: "2", title: "Community is great", quote: "The discussion forums are so much better than generic social networks.", name: "Hana R.", role: "Community Member", imageSrc: "http://img.b2bpic.net/free-photo/digital-art-portrait-asian-woman_23-2151836552.jpg"},
{
id: "3",
title: "Truly Epic",
quote: "Essential for any anime lover.",
name: "Yuki S.",
role: "Fan",
imageSrc: "http://img.b2bpic.net/free-photo/androgynous-avatar-non-binary-queer-person_23-2151100180.jpg",
},
{
id: "4",
title: "Perfect!",
quote: "Highly recommend to my friends.",
name: "Hiroshi T.",
role: "Fan",
imageSrc: "http://img.b2bpic.net/free-photo/androgynous-avatar-non-binary-queer-person_23-2151100148.jpg",
},
{
id: "5",
title: "Simply The Best",
quote: "I love the community features.",
name: "Mina K.",
role: "Fan",
imageSrc: "http://img.b2bpic.net/free-photo/anime-boy-playing-with-water-gun-beach_23-2151987391.jpg",
},
id: "3", title: "Clean Interface", quote: "I love how easy it is to find hidden gems I missed.", name: "Ren K.", role: "Casual Viewer", imageSrc: "http://img.b2bpic.net/free-photo/androgynous-avatar-non-binary-queer-person_23-2151100180.jpg"},
]}
title="Fan Experiences"
description="What our users think about AniPortal."
description="What our global community says about their time on AniPortal."
/>
</div>
@@ -248,41 +154,17 @@ export default function LandingPage() {
useInvertedBackground={false}
products={[
{
id: "p1",
name: "Cyber Samurai Figure",
price: "$89",
imageSrc: "http://img.b2bpic.net/free-photo/concept-halloween-celebration-covid-19-pandemic_1258-18691.jpg",
},
id: "p1", name: "Cyber Samurai Figure", price: "$89", imageSrc: "http://img.b2bpic.net/free-photo/concept-halloween-celebration-covid-19-pandemic_1258-18691.jpg"},
{
id: "p2",
name: "Neon Maiden Doll",
price: "$75",
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-standing-universe-texture-projection_23-2149512126.jpg",
},
id: "p2", name: "Neon Maiden Doll", price: "$75", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-standing-universe-texture-projection_23-2149512126.jpg"},
{
id: "p3",
name: "Shadow Knight Statue",
price: "$120",
imageSrc: "http://img.b2bpic.net/free-photo/ramadan-boxes-with-lantern-perspective-side_187299-38087.jpg",
},
id: "p3", name: "Shadow Knight Statue", price: "$120", imageSrc: "http://img.b2bpic.net/free-photo/ramadan-boxes-with-lantern-perspective-side_187299-38087.jpg"},
{
id: "p4",
name: "Cloud Princess Figure",
price: "$95",
imageSrc: "http://img.b2bpic.net/free-photo/high-tech-portrait-young-girl-with-futuristic-style_23-2151133569.jpg",
},
id: "p4", name: "Cloud Princess Figure", price: "$95", imageSrc: "http://img.b2bpic.net/free-photo/high-tech-portrait-young-girl-with-futuristic-style_23-2151133569.jpg"},
{
id: "p5",
name: "Dragon Soul Keyring",
price: "$25",
imageSrc: "http://img.b2bpic.net/free-photo/dark-style-ninja-naruto_23-2151278793.jpg",
},
id: "p5", name: "Dragon Soul Keyring", price: "$25", imageSrc: "http://img.b2bpic.net/free-photo/dark-style-ninja-naruto_23-2151278793.jpg"},
{
id: "p6",
name: "Elemental Mage Set",
price: "$150",
imageSrc: "http://img.b2bpic.net/free-photo/high-tech-portrait-young-girl-with-futuristic-style_23-2151133576.jpg",
},
id: "p6", name: "Elemental Mage Set", price: "$150", imageSrc: "http://img.b2bpic.net/free-photo/high-tech-portrait-young-girl-with-futuristic-style_23-2151133576.jpg"},
]}
title="Top Anime Merchandise"
description="Exclusive collectibles for true fans."
@@ -295,20 +177,11 @@ export default function LandingPage() {
useInvertedBackground={true}
faqs={[
{
id: "1",
title: "How do I subscribe?",
content: "You can sign up directly via our membership dashboard.",
},
id: "1", title: "How do I subscribe?", content: "You can sign up directly via our membership dashboard."},
{
id: "2",
title: "Are there community guidelines?",
content: "Yes, we encourage a respectful environment for everyone.",
},
id: "2", title: "Are there community guidelines?", content: "Yes, we encourage a respectful environment for everyone."},
{
id: "3",
title: "Can I suggest shows?",
content: "Absolutely! Use the feedback form to reach our content team.",
},
id: "3", title: "Can I suggest shows?", content: "Absolutely! Use the feedback form to reach our content team."},
]}
title="Need Help?"
description="Common questions from our community members."
@@ -321,14 +194,7 @@ export default function LandingPage() {
textboxLayout="default"
useInvertedBackground={false}
names={[
"AniWatch",
"OtakuGlobal",
"StudioDream",
"AnimeFeed",
"FestivAnime",
"JumpApp",
"MerchHaven",
]}
"AniWatch", "OtakuGlobal", "StudioDream", "AnimeFeed", "FestivAnime", "JumpApp", "MerchHaven"]}
title="Trusted By Creators"
description="Leading studios and influencers collaborate with us."
/>
@@ -338,16 +204,13 @@ export default function LandingPage() {
<ContactCTA
useInvertedBackground={true}
background={{
variant: "plain",
}}
tag="Connect With Us"
title="Join The Anime Revolution"
description="Ready to discuss your favorite series? Let's get started today."
variant: "plain"}}
tag="Contact Support"
title="Need Assistance?"
description="Our dedicated support team is here to help with your account, community issues, or feedback. We aim to respond within 24 hours."
buttons={[
{
text: "Join Now",
href: "#",
},
text: "Get Help", href: "#"},
]}
/>
</div>
@@ -357,42 +220,27 @@ export default function LandingPage() {
logoText="AniPortal"
columns={[
{
title: "Platform",
items: [
title: "Platform", items: [
{
label: "About",
href: "#",
},
label: "About", href: "#"},
{
label: "Series",
href: "#featured",
},
label: "Series", href: "#featured"},
],
},
{
title: "Resources",
items: [
title: "Resources", items: [
{
label: "Blog",
href: "#",
},
label: "Blog", href: "#"},
{
label: "Community",
href: "#metrics",
},
label: "Community", href: "#metrics"},
],
},
{
title: "Legal",
items: [
title: "Legal", items: [
{
label: "Privacy",
href: "#",
},
label: "Privacy", href: "#"},
{
label: "Terms",
href: "#",
},
label: "Terms", href: "#"},
],
},
]}
@@ -402,4 +250,4 @@ export default function LandingPage() {
</ReactLenis>
</ThemeProvider>
);
}
}

View File

@@ -0,0 +1,74 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import { useState } from 'react';
export default function AnimeWatchPage({ params }: { params: { id: string } }) {
const [currentEpisode, setCurrentEpisode] = useState(1);
const episodes = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="mediumLarge"
sizing="mediumLargeSizeLargeTitles"
background="circleGradient"
cardStyle="layered-gradient"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="glass"
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "/" },
{ name: "Series", id: "/#featured" },
]}
brandName="AniPortal"
/>
</div>
<main className="pt-24 pb-12 px-6 flex flex-col md:flex-row gap-8 max-w-7xl mx-auto">
<div className="flex-grow">
<div className="aspect-video w-full bg-slate-900 rounded-lg flex items-center justify-center text-white mb-4">
<span className="text-2xl">Video Player: Episode {currentEpisode}</span>
</div>
<h1 className="text-3xl font-bold">Anime Series Title - Episode {currentEpisode}</h1>
</div>
<div className="w-full md:w-80 flex-shrink-0">
<h2 className="text-xl font-semibold mb-4">Episodes</h2>
<div className="grid grid-cols-4 md:grid-cols-2 gap-2">
{episodes.map((ep) => (
<button
key={ep}
onClick={() => setCurrentEpisode(ep)}
className={`p-3 rounded border transition ${currentEpisode === ep ? 'bg-primary text-white' : 'hover:bg-slate-100'}`}
>
Ep {ep}
</button>
))}
</div>
</div>
</main>
<div id="footer" data-section="footer">
<FooterBaseReveal
logoText="AniPortal"
columns={[
{ title: "Platform", items: [{ label: "About", href: "/" }] },
{ title: "Legal", items: [{ label: "Privacy", href: "/" }] },
]}
copyrightText="© 2024 AniPortal. All rights reserved."
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}