Update src/app/styles/variables.css

Merge version_6 into main

src/app/page.tsx

@@ -30,69 +30,29 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleCentered
       navItems={[
-        {
+        { name: "Sobre", id: "about" },
-          name: "Sobre",
+        { name: "Cardápio", id: "menu" },
-          id: "about",
+        { name: "Experiência", id: "experience" },
-        },
+        { name: "Reservar", id: "reservation" },
-        {
-          name: "Cardápio",
-          id: "menu",
-        },
-        {
-          name: "Experiência",
-          id: "experience",
-        },
-        {
-          name: "Reservar",
-          id: "reservation",
-        },
       ]}
-      button={{
+      button={{ text: "Reservar Mesa", href: "#reservation" }}
-        text: "Reservar Mesa",
-        href: "#reservation",
-      }}
       brandName="Maria da Praia"
     />
   </div>
 
   <div id="hero" data-section="hero">
       <HeroBillboardGallery
-      background={{
+      background={{ variant: "gradient-bars" }}
-        variant: "gradient-bars",
+      title="Maria da Praia"
-      }}
-      title="Maria / da Praia"
       description="Frutos do mar frescos, vista inesquecível e a alma carioca à beira-mar."
       buttons={[
-        {
+        { text: "Reservar Mesa", href: "#reservation" },
-          text: "Reservar Mesa",
+        { text: "Ver Cardápio", href: "#menu" },
-          href: "#reservation",
-        },
-        {
-          text: "Ver Cardápio",
-          href: "#menu",
-        },
       ]}
       mediaItems={[
-        {
+        { imageSrc: "http://img.b2bpic.net/free-photo/view-island-aegean-sea-from-empty-restaurant_1268-15840.jpg", imageAlt: "Vista da praia" },
-          imageSrc: "http://img.b2bpic.net/free-photo/view-island-aegean-sea-from-empty-restaurant_1268-15840.jpg",
+        { imageSrc: "http://img.b2bpic.net/free-photo/bowl-with-black-spaghetti-mussels_23-2148461650.jpg", imageAlt: "Prato de camarão" },
-          imageAlt: "Vista da praia",
+        { imageSrc: "http://img.b2bpic.net/free-photo/seafood-mussels-salad-with-galetta-white-plate_114579-2359.jpg", imageAlt: "Ambiente noturno" },
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/bowl-with-black-spaghetti-mussels_23-2148461650.jpg",
-          imageAlt: "Prato de camarão",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/seafood-mussels-salad-with-galetta-white-plate_114579-2359.jpg",
-          imageAlt: "Ambiente noturno",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/inspired-barefooted-woman-with-pretty-smile-posing-cafe-photo-cute-blonde-female-model-with-excited-face-expression-sitting-window-sill_197531-9234.jpg",
-          imageAlt: "Terraço ao ar livre",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/refreshing-cocktail-with-lime-with-sea_181624-8259.jpg",
-          imageAlt: "Drink especial",
-        },
       ]}
       mediaAnimation="slide-up"
     />
@@ -100,22 +60,13 @@ export default function LandingPage() {
 
   <div id="about" data-section="about">
       <MetricSplitMediaAbout
-      useInvertedBackground={false}
+      useInvertedBackground={true}
       title="Pés na areia, alma na cozinha"
       description="Nossa cozinha combina o frescor do oceano com a tradição da culinária carioca, oferecendo uma experiência que vai muito além do paladar. Localizados na deslumbrante Praia de Piratininga, criamos um refúgio para quem busca sabores autênticos e o calor humano que só o Rio de Janeiro pode proporcionar."
       metrics={[
-        {
+        { value: "10+", title: "Anos de tradição" },
-          value: "10+",
+        { value: "4.5★", title: "Avaliação média" },
-          title: "Anos de tradição",
+        { value: "100+", title: "Reviews reais" },
-        },
-        {
-          value: "4.5★",
-          title: "Avaliação média",
-        },
-        {
-          value: "100+",
-          title: "Reviews reais",
-        },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/raw-trout-ready-be-cooked_23-2150353386.jpg"
       imageAlt="Ambiente do restaurante"
@@ -129,38 +80,11 @@ export default function LandingPage() {
       animationType="slide-up"
       textboxLayout="split"
       gridVariant="one-large-left-three-stacked-right"
-      useInvertedBackground={true}
+      useInvertedBackground={false}
       products={[
-        {
+        { id: "1", name: "Bobó de Camarão", price: "R$ 118 – 148", imageSrc: "http://img.b2bpic.net/free-photo/seafood-sauteed-containing-mussels-crabs_114579-2139.jpg" },
-          id: "1",
+        { id: "2", name: "Pastel de Camarão", price: "R$ 52 – 68", imageSrc: "http://img.b2bpic.net/free-photo/view-ready-eat-oysters-with-lemons-ice_52683-111695.jpg" },
-          name: "Bobó de Camarão",
+        { id: "3", name: "Ceviche da Casa", price: "R$ 62 – 78", imageSrc: "http://img.b2bpic.net/free-photo/seafood-side-dishes-with-platter-shrimp-squids-fish_140725-2576.jpg" },
-          price: "R$ 118 – 148",
-          imageSrc: "http://img.b2bpic.net/free-photo/seafood-sauteed-containing-mussels-crabs_114579-2139.jpg",
-        },
-        {
-          id: "2",
-          name: "Pastel de Camarão",
-          price: "R$ 52 – 68",
-          imageSrc: "http://img.b2bpic.net/free-photo/view-ready-eat-oysters-with-lemons-ice_52683-111695.jpg",
-        },
-        {
-          id: "3",
-          name: "Ceviche da Casa",
-          price: "R$ 62 – 78",
-          imageSrc: "http://img.b2bpic.net/free-photo/seafood-side-dishes-with-platter-shrimp-squids-fish_140725-2576.jpg",
-        },
-        {
-          id: "4",
-          name: "Camarão Tailandês",
-          price: "R$ 128 – 158",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-fresh-clams-store_23-2148263843.jpg",
-        },
-        {
-          id: "5",
-          name: "Filé de Peixe Grelhado",
-          price: "R$ 88 – 108",
-          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-delicious-sea-food_23-2149214658.jpg",
-        },
       ]}
       title="Nosso Cardápio"
       description="Seleção exclusiva de frutos do mar frescos e preparos autorais."
@@ -172,33 +96,11 @@ export default function LandingPage() {
       animationType="slide-up"
       textboxLayout="split"
       gridVariant="uniform-all-items-equal"
-      useInvertedBackground={false}
+      useInvertedBackground={true}
       features={[
-        {
+        { title: "Vista Privilegiada", description: "Debruçados sobre o mar de Piratininga.", imageSrc: "http://img.b2bpic.net/free-photo/bottle-with-letter-lies-blue-serviette-dinner-table_1304-3688.jpg" },
-          title: "Vista Privilegiada",
+        { title: "Pet-Friendly", description: "Seu melhor amigo é bem-vindo.", imageSrc: "http://img.b2bpic.net/free-photo/sharm-vacation-tropical-silhouette-light_1203-4806.jpg" },
-          description: "Debruçados sobre o mar de Piratininga.",
+        { title: "Eventos Especiais", description: "Espaço ideal para grupos e celebrações.", imageSrc: "http://img.b2bpic.net/free-photo/chair-table-terrace-restaurant-with-sea-view_1339-7119.jpg" },
-          imageSrc: "http://img.b2bpic.net/free-photo/bottle-with-letter-lies-blue-serviette-dinner-table_1304-3688.jpg",
-        },
-        {
-          title: "Pet-Friendly",
-          description: "Seu melhor amigo é bem-vindo.",
-          imageSrc: "http://img.b2bpic.net/free-photo/sharm-vacation-tropical-silhouette-light_1203-4806.jpg",
-        },
-        {
-          title: "Eventos Especiais",
-          description: "Espaço ideal para grupos e celebrações.",
-          imageSrc: "http://img.b2bpic.net/free-photo/chair-table-terrace-restaurant-with-sea-view_1339-7119.jpg",
-        },
-        {
-          title: "Pôr do Sol Mágico",
-          description: "O melhor espetáculo da cidade.",
-          imageSrc: "http://img.b2bpic.net/free-photo/glasses-fresh-blue-lemon-drink-with-straw-sliced-lime_23-2148145416.jpg",
-        },
-        {
-          title: "Atendimento VIP",
-          description: "Experiência personalizada para você.",
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-chef-with-gloves-sprinkled-salt-onto-fresh-fish-pomegranate-seeds-bowl-table_179666-44311.jpg",
-        },
       ]}
       title="Mais que uma refeição"
       description="Nossa experiência é composta por elementos que traduzem a magia do litoral carioca."
@@ -209,43 +111,10 @@ export default function LandingPage() {
       <TestimonialCardTwo
       animationType="slide-up"
       textboxLayout="split"
-      useInvertedBackground={true}
+      useInvertedBackground={false}
       testimonials={[
-        {
+        { id: "1", name: "Ana Silva", role: "Frequente", testimonial: "O bobó de camarão é insuperável, tempero perfeito!", imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-sitting-cafe_176420-5900.jpg" },
-          id: "1",
+        { id: "2", name: "Carlos Mendes", role: "Visitante", testimonial: "Vista maravilhosa e o pôr do sol é um evento à parte.", imageSrc: "http://img.b2bpic.net/free-photo/man-drinking-coffee-cafe_1262-17855.jpg" },
-          name: "Ana Silva",
-          role: "Frequente",
-          testimonial: "O bobó de camarão é insuperável, tempero perfeito!",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-sitting-cafe_176420-5900.jpg",
-        },
-        {
-          id: "2",
-          name: "Carlos Mendes",
-          role: "Visitante",
-          testimonial: "Vista maravilhosa e o pôr do sol é um evento à parte.",
-          imageSrc: "http://img.b2bpic.net/free-photo/european-woman-using-mobile-phone-cafe_273443-677.jpg",
-        },
-        {
-          id: "3",
-          name: "Beatriz Rocha",
-          role: "Frequente",
-          testimonial: "Atendimento impecável e porções muito generosas.",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-people-enjoying-christmas-dinner_23-2149144969.jpg",
-        },
-        {
-          id: "4",
-          name: "Felipe Souza",
-          role: "Aniversariante",
-          testimonial: "Celebrar meu aniversário aqui foi a melhor escolha.",
-          imageSrc: "http://img.b2bpic.net/free-photo/three-friends-enjoying-burgers-together-while-beach_23-2148666657.jpg",
-        },
-        {
-          id: "5",
-          name: "Juliana Lima",
-          role: "Frequente",
-          testimonial: "Ambiente super relaxado, pé na areia total.",
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-female-cook-wearing-white-cook-suit-holding-big-sign-green-desk-kitchen-cuisine-cooking-female-color_140725-58666.jpg",
-        },
       ]}
       title="O que nossos clientes dizem"
       description="Relatos de quem já viveu a experiência Maria da Praia."
@@ -254,17 +123,10 @@ export default function LandingPage() {
 
   <div id="reservation" data-section="reservation">
       <ContactText
-      useInvertedBackground={false}
+      useInvertedBackground={true}
-      background={{
+      background={{ variant: "gradient-bars" }}
-        variant: "gradient-bars",
-      }}
       text="Reserve sua mesa e venha saborear o melhor do litoral de Niterói."
-      buttons={[
+      buttons={[{ text: "Reservar agora", href: "#" }]}
-        {
-          text: "Reservar agora",
-          href: "#",
-        },
-      ]}
     />
   </div>
 
@@ -273,21 +135,8 @@ export default function LandingPage() {
       textboxLayout="split"
       useInvertedBackground={true}
       faqs={[
-        {
+        { id: "1", title: "Onde estamos?", content: "Praia de Piratininga, Niterói - RJ." },
-          id: "1",
+        { id: "2", title: "Horários?", content: "Terça a Domingo das 11h às 22h." },
-          title: "Onde estamos?",
-          content: "Praia de Piratininga, Niterói - RJ.",
-        },
-        {
-          id: "2",
-          title: "Horários?",
-          content: "Terça a Domingo das 11h às 22h.",
-        },
-        {
-          id: "3",
-          title: "Estacionamento?",
-          content: "Disponível na orla da praia.",
-        },
       ]}
       title="Informações Úteis"
       description="Saiba mais sobre como chegar e nossos horários."
@@ -301,42 +150,9 @@ export default function LandingPage() {
   <div id="footer" data-section="footer">
       <FooterSimple
       columns={[
-        {
+        { title: "Maria da Praia", items: [{ label: "Sobre nós", href: "#about" }] },
-          title: "Maria da Praia",
+        { title: "Cardápio", items: [{ label: "Ver opções", href: "#menu" }] },
-          items: [
+        { title: "Reservas", items: [{ label: "Agendar mesa", href: "#reservation" }] },
-            {
-              label: "Sobre nós",
-              href: "#about",
-            },
-          ],
-        },
-        {
-          title: "Cardápio",
-          items: [
-            {
-              label: "Ver opções",
-              href: "#menu",
-            },
-          ],
-        },
-        {
-          title: "Reservas",
-          items: [
-            {
-              label: "Agendar mesa",
-              href: "#reservation",
-            },
-          ],
-        },
-        {
-          title: "Contato",
-          items: [
-            {
-              label: "WhatsApp",
-              href: "#",
-            },
-          ],
-        },
       ]}
       bottomLeftText="© 2024 Maria da Praia"
       bottomRightText="Todos os direitos reservados"
@@ -345,4 +161,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #f5ede0;
+  --background: #ffffff;
-  --card: #0d1b2a;
+  --card: #f7f9f7;
-  --foreground: #0d1b2a;
+  --foreground: #001a0a;
-  --primary-cta: #c9a96e;
+  --primary-cta: #0a7039;
   --primary-cta-text: #0d1b2a;
-  --secondary-cta: #f5ede0;
+  --secondary-cta: #f7f9f7;
   --secondary-cta-text: #0d1b2a;
-  --accent: #c9a96e;
+  --accent: #fde047;
-  --background-accent: #0d1b2a;
+  --background-accent: #fde047;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);