Compare commits
4 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 0ccdd70601 | |||
| d74fd50c93 | |||
| 47aef20792 | |||
| 0ed5e31816 |
141
src/app/page.tsx
141
src/app/page.tsx
@@ -28,14 +28,10 @@ export default function LandingPage() {
|
|||||||
<div id="nav" data-section="nav">
|
<div id="nav" data-section="nav">
|
||||||
<NavbarLayoutFloatingOverlay
|
<NavbarLayoutFloatingOverlay
|
||||||
navItems={[
|
navItems={[
|
||||||
{
|
{ name: "Home", id: "#hero" },
|
||||||
name: "Home",
|
{ name: "Sobre", id: "#about" },
|
||||||
id: "/",
|
{ name: "Personagens", id: "#characters" },
|
||||||
},
|
{ name: "Quizzes", id: "/quizzes" },
|
||||||
{
|
|
||||||
name: "Quizzes",
|
|
||||||
id: "/quizzes",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
brandName="Beacon Hills Hub"
|
brandName="Beacon Hills Hub"
|
||||||
/>
|
/>
|
||||||
@@ -46,40 +42,16 @@ export default function LandingPage() {
|
|||||||
logoText="Teen Wolf"
|
logoText="Teen Wolf"
|
||||||
description="Bem-vindo ao centro oficial de fãs de Beacon Hills. Explore a história, os segredos e teste seus conhecimentos."
|
description="Bem-vindo ao centro oficial de fãs de Beacon Hills. Explore a história, os segredos e teste seus conhecimentos."
|
||||||
buttons={[
|
buttons={[
|
||||||
{
|
{ text: "Explorar Agora", href: "#about" },
|
||||||
text: "Explorar Agora",
|
{ text: "Ver Quizzes", href: "/quizzes" },
|
||||||
href: "#about",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
text: "Ver Quizzes",
|
|
||||||
href: "/quizzes",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
slides={[
|
slides={[
|
||||||
{
|
{ imageSrc: "http://img.b2bpic.net/free-photo/school-scene-with-queer-teens_23-2150379384.jpg", imageAlt: "Scott McCall" },
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/school-scene-with-queer-teens_23-2150379384.jpg",
|
{ imageSrc: "http://img.b2bpic.net/free-photo/emo-girl-home-side-view_23-2149645109.jpg", imageAlt: "Stiles Stilinski" },
|
||||||
imageAlt: "Scott McCall",
|
{ imageSrc: "http://img.b2bpic.net/free-photo/woman-wearing-brown-hijab_155996-40.jpg", imageAlt: "Lydia Martin" },
|
||||||
},
|
{ imageSrc: "http://img.b2bpic.net/free-photo/cute-dog-with-nature-background_23-2150687279.jpg", imageAlt: "Derek Hale" },
|
||||||
{
|
{ imageSrc: "http://img.b2bpic.net/free-photo/beautiful-view-white-building-middle-trees-forest-cloudy-sky_181624-27439.jpg", imageAlt: "Beacon Hills" },
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/emo-girl-home-side-view_23-2149645109.jpg",
|
{ imageSrc: "http://img.b2bpic.net/free-photo/woman-posing-with-plastic-foil_23-2148864922.jpg", imageAlt: "Werewolf transformation" },
|
||||||
imageAlt: "Stiles Stilinski",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-wearing-brown-hijab_155996-40.jpg",
|
|
||||||
imageAlt: "Lydia Martin",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/cute-dog-with-nature-background_23-2150687279.jpg",
|
|
||||||
imageAlt: "Derek Hale",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-view-white-building-middle-trees-forest-cloudy-sky_181624-27439.jpg",
|
|
||||||
imageAlt: "Beacon Hills",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-posing-with-plastic-foil_23-2148864922.jpg",
|
|
||||||
imageAlt: "Werewolf transformation",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -88,15 +60,8 @@ export default function LandingPage() {
|
|||||||
<InlineImageSplitTextAbout
|
<InlineImageSplitTextAbout
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
heading={[
|
heading={[
|
||||||
{
|
{ type: "text", content: "A Lenda de Beacon Hills" },
|
||||||
type: "text",
|
{ type: "image", src: "http://img.b2bpic.net/free-photo/black-skulls-laid-near-blank-sheet_23-2147908667.jpg", alt: "Logo Teen Wolf" },
|
||||||
content: "A Lenda de Beacon Hills",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "image",
|
|
||||||
src: "http://img.b2bpic.net/free-photo/black-skulls-laid-near-blank-sheet_23-2147908667.jpg",
|
|
||||||
alt: "Logo Teen Wolf",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -107,30 +72,10 @@ export default function LandingPage() {
|
|||||||
textboxLayout="default"
|
textboxLayout="default"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
team={[
|
team={[
|
||||||
{
|
{ id: "1", name: "Scott McCall", role: "True Alpha", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=f7lnyu" },
|
||||||
id: "1",
|
{ id: "2", name: "Stiles Stilinski", role: "Investigator", imageSrc: "http://img.b2bpic.net/free-photo/teen-blond-male-with-hand-near-head-casual-shirt-looking-thoughtful-front-view_176474-109671.jpg" },
|
||||||
name: "Scott McCall",
|
{ id: "3", name: "Lydia Martin", role: "Banshee", imageSrc: "http://img.b2bpic.net/free-photo/sensual-blond-female-with-blue-eyes-white-clothes_613910-14966.jpg" },
|
||||||
role: "True Alpha",
|
{ id: "4", name: "Derek Hale", role: "Hale Legacy", imageSrc: "http://img.b2bpic.net/free-photo/hawaii-illustration-retro-comic-style_23-2151771099.jpg" },
|
||||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=f7lnyu",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "2",
|
|
||||||
name: "Stiles Stilinski",
|
|
||||||
role: "Investigator",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/teen-blond-male-with-hand-near-head-casual-shirt-looking-thoughtful-front-view_176474-109671.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3",
|
|
||||||
name: "Lydia Martin",
|
|
||||||
role: "Banshee",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/sensual-blond-female-with-blue-eyes-white-clothes_613910-14966.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "4",
|
|
||||||
name: "Derek Hale",
|
|
||||||
role: "Hale Legacy",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/hawaii-illustration-retro-comic-style_23-2151771099.jpg",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
title="Personagens Principais"
|
title="Personagens Principais"
|
||||||
description="Conheça os lobisomens, banshees e caçadores que moldaram a série."
|
description="Conheça os lobisomens, banshees e caçadores que moldaram a série."
|
||||||
@@ -142,21 +87,9 @@ export default function LandingPage() {
|
|||||||
textboxLayout="split"
|
textboxLayout="split"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
faqs={[
|
faqs={[
|
||||||
{
|
{ id: "1", title: "Onde foi filmado?", content: "A série foi filmada majoritariamente na Geórgia." },
|
||||||
id: "1",
|
{ id: "2", title: "Quantas temporadas?", content: "Teen Wolf teve um total de 6 temporadas." },
|
||||||
title: "Onde foi filmado?",
|
{ id: "3", title: "Quem é o criador?", content: "Jeff Davis criou a série baseada no filme de 1985." },
|
||||||
content: "A série foi filmada majoritariamente na Geórgia.",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "2",
|
|
||||||
title: "Quantas temporadas?",
|
|
||||||
content: "Teen Wolf teve um total de 6 temporadas.",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3",
|
|
||||||
title: "Quem é o criador?",
|
|
||||||
content: "Jeff Davis criou a série baseada no filme de 1985.",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
imageSrc="http://img.b2bpic.net/free-photo/haunted-house-gothic-style_23-2151626675.jpg"
|
imageSrc="http://img.b2bpic.net/free-photo/haunted-house-gothic-style_23-2151626675.jpg"
|
||||||
mediaAnimation="opacity"
|
mediaAnimation="opacity"
|
||||||
@@ -175,31 +108,11 @@ export default function LandingPage() {
|
|||||||
title="Impacto em Beacon Hills"
|
title="Impacto em Beacon Hills"
|
||||||
description="Alguns números sobre a nossa jornada sobrenatural."
|
description="Alguns números sobre a nossa jornada sobrenatural."
|
||||||
metrics={[
|
metrics={[
|
||||||
{
|
{ id: "1", value: "6", description: "Temporadas de puro suspense" },
|
||||||
id: "1",
|
{ id: "2", value: "100+", description: "Episódios inesquecíveis" },
|
||||||
value: "6",
|
{ id: "3", value: "15k+", description: "Fãs ativos na comunidade" },
|
||||||
description: "Temporadas de puro suspense",
|
{ id: "4", value: "10+", description: "Quizzes disponíveis" },
|
||||||
},
|
{ id: "5", value: "4", description: "Principais clãs sobrenaturais" },
|
||||||
{
|
|
||||||
id: "2",
|
|
||||||
value: "100+",
|
|
||||||
description: "Episódios inesquecíveis",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3",
|
|
||||||
value: "15k+",
|
|
||||||
description: "Fãs ativos na comunidade",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "4",
|
|
||||||
value: "10+",
|
|
||||||
description: "Quizzes disponíveis",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "5",
|
|
||||||
value: "4",
|
|
||||||
description: "Principais clãs sobrenaturais",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -213,4 +126,4 @@ export default function LandingPage() {
|
|||||||
</ReactLenis>
|
</ReactLenis>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
@@ -2,12 +2,10 @@
|
|||||||
|
|
||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
import ReactLenis from "lenis/react";
|
import ReactLenis from "lenis/react";
|
||||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
||||||
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
|
|
||||||
import FooterCard from '@/components/sections/footer/FooterCard';
|
|
||||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||||
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
||||||
|
|
||||||
export default function LandingPage() {
|
export default function QuizzesPage() {
|
||||||
return (
|
return (
|
||||||
<ThemeProvider
|
<ThemeProvider
|
||||||
defaultButtonVariant="expand-hover"
|
defaultButtonVariant="expand-hover"
|
||||||
@@ -22,116 +20,43 @@ export default function LandingPage() {
|
|||||||
headingFontWeight="medium"
|
headingFontWeight="medium"
|
||||||
>
|
>
|
||||||
<ReactLenis root>
|
<ReactLenis root>
|
||||||
<div id="nav" data-section="nav">
|
<NavbarLayoutFloatingOverlay
|
||||||
<NavbarLayoutFloatingOverlay
|
navItems={[
|
||||||
navItems={[
|
{ name: "Home", id: "/" },
|
||||||
{
|
{ name: "Quizzes", id: "/quizzes" },
|
||||||
name: "Home",
|
]}
|
||||||
id: "/",
|
brandName="Beacon Hills Hub"
|
||||||
},
|
/>
|
||||||
{
|
|
||||||
name: "Quizzes",
|
<main className="container mx-auto px-4 py-20 flex gap-12">
|
||||||
id: "/quizzes",
|
<aside className="w-64 hidden md:block">
|
||||||
},
|
<nav className="sticky top-24 space-y-4">
|
||||||
]}
|
<h2 className="text-xl font-bold mb-4">Categorias</h2>
|
||||||
brandName="Beacon Hills Hub"
|
<ul className="space-y-2">
|
||||||
/>
|
<li><a href="#" className="hover:text-primary">Personagens</a></li>
|
||||||
</div>
|
<li><a href="#" className="hover:text-primary">História</a></li>
|
||||||
|
<li><a href="#" className="hover:text-primary">Criaturas</a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
|
|
||||||
<div id="quiz-main" data-section="quiz-main">
|
<div className="flex-1">
|
||||||
<ContactCenter
|
<h1 className="text-4xl font-bold mb-8">Quizzes de Beacon Hills</h1>
|
||||||
useInvertedBackground={false}
|
<div className="grid gap-6">
|
||||||
background={{
|
{/* Quiz Placeholder */}
|
||||||
variant: "animated-grid",
|
<div className="p-8 border border-white/10 rounded-2xl bg-white/5">
|
||||||
}}
|
<h3 className="text-2xl font-bold mb-2">Quanto você sabe sobre o Scott?</h3>
|
||||||
tag="Modo Interativo"
|
<p className="text-muted-foreground mb-4">Teste seus conhecimentos sobre o True Alpha.</p>
|
||||||
title="Quiz: Quanto você sabe?"
|
<button className="px-6 py-2 rounded-full bg-primary text-white font-medium">Iniciar Quiz</button>
|
||||||
description="Selecione um quiz abaixo para começar sua jornada."
|
</div>
|
||||||
/>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
<div id="quiz-list" data-section="quiz-list">
|
<FooterCard
|
||||||
<FeatureCardNineteen
|
logoText="Beacon Hills Hub"
|
||||||
textboxLayout="default"
|
copyrightText="© 2025 | Fã-site não oficial"
|
||||||
useInvertedBackground={false}
|
/>
|
||||||
features={[
|
|
||||||
{
|
|
||||||
tag: "Fácil",
|
|
||||||
title: "Scott McCall",
|
|
||||||
subtitle: "Iniciantes",
|
|
||||||
description: "Teste seu conhecimento básico sobre o protagonista.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/leather-craft-tools-wooden-background-leather-craftmans-work-desk_8353-6073.jpg?_wi=1",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
tag: "Médio",
|
|
||||||
title: "Lendas de Beacon Hills",
|
|
||||||
subtitle: "Intermediário",
|
|
||||||
description: "História detalhada sobre os seres sobrenaturais.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-vector/esoteric-elements-pack_23-2148564361.jpg?_wi=1",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
tag: "Difícil",
|
|
||||||
title: "Mistérios de Stiles",
|
|
||||||
subtitle: "Avançado",
|
|
||||||
description: "Perguntas complexas sobre os casos do Stiles.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-vintage-suitcase-with-map-magnifying-glass_23-2148610432.jpg?_wi=1",
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
title="Nossos Quizzes"
|
|
||||||
description="Escolha um tema e mostre que você é um especialista."
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="contact" data-section="contact">
|
|
||||||
<ContactCenter
|
|
||||||
useInvertedBackground={false}
|
|
||||||
background={{
|
|
||||||
variant: "plain",
|
|
||||||
}}
|
|
||||||
title="Quiz: Quanto você sabe?"
|
|
||||||
description="Selecione um quiz abaixo para começar sua jornada."
|
|
||||||
tag="Modo Interativo"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="feature" data-section="feature">
|
|
||||||
<FeatureCardNineteen
|
|
||||||
textboxLayout="default"
|
|
||||||
useInvertedBackground={false}
|
|
||||||
title="Nossos Quizzes"
|
|
||||||
description="Escolha um tema e mostre que você é um especialista."
|
|
||||||
features={[
|
|
||||||
{
|
|
||||||
tag: "Fácil",
|
|
||||||
title: "Scott McCall",
|
|
||||||
subtitle: "Iniciantes",
|
|
||||||
description: "Teste seu conhecimento básico sobre o protagonista.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/leather-craft-tools-wooden-background-leather-craftmans-work-desk_8353-6073.jpg?_wi=2",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
tag: "Médio",
|
|
||||||
title: "Lendas de Beacon Hills",
|
|
||||||
subtitle: "Intermediário",
|
|
||||||
description: "História detalhada sobre os seres sobrenaturais.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-vector/esoteric-elements-pack_23-2148564361.jpg?_wi=2",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
tag: "Difícil",
|
|
||||||
title: "Mistérios de Stiles",
|
|
||||||
subtitle: "Avançado",
|
|
||||||
description: "Perguntas complexas sobre os casos do Stiles.",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-vintage-suitcase-with-map-magnifying-glass_23-2148610432.jpg?_wi=2",
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="footer" data-section="footer">
|
|
||||||
<FooterCard
|
|
||||||
logoText="Beacon Hills Hub"
|
|
||||||
copyrightText="© 2025 | Fã-site não oficial"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</ReactLenis>
|
</ReactLenis>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user