Update src/app/styles/variables.css

Merge version_1 into main

src/app/blog/page.tsx

@@ -33,10 +33,10 @@ export default function BlogPage() {
                 <NavbarStyleFullscreen
                     navItems={[
                         { name: "Home", id: "/" },
-                        { name: "About", id: "about" },
-                        { name: "Shop", id: "products" },
-                        { name: "Testimonials", id: "testimonials" },
-                        { name: "Contact", id: "contact" },
+                        { name: "About", id: "/#about" },
+                        { name: "Shop", id: "/shop" },
+                        { name: "Testimonials", id: "/#testimonials" },
+                        { name: "Contact", id: "/#contact" },
                     ]}
                     brandName="Angola"
                     bottomLeftText="Experience the Beauty"
@@ -67,16 +67,16 @@ export default function BlogPage() {
                     columns={[
                         {
                             title: "Shop",                            items: [
-                                { label: "Bouquets", href: "#products" },
-                                { label: "Arrangements", href: "#products" },
-                                { label: "Custom Orders", href: "#contact" },
+                                { label: "Bouquets", href: "/shop" },
+                                { label: "Arrangements", href: "/shop" },
+                                { label: "Custom Orders", href: "/#contact" },
                             ],
                         },
                         {
                             title: "Company",                            items: [
-                                { label: "About Us", href: "#about" },
-                                { label: "FAQ", href: "#faq" },
-                                { label: "Contact", href: "#contact" },
+                                { label: "About Us", href: "/#about" },
+                                { label: "FAQ", href: "/#faq" },
+                                { label: "Contact", href: "/#contact" },
                             ],
                         },
                         {

src/app/page.tsx

@@ -27,11 +27,11 @@ export default function LandingPage() {
       <div id="nav" data-section="nav">
         <NavbarStyleFullscreen
           navItems={[
-            { name: "Home", id: "home" },
-            { name: "About", id: "about" },
-            { name: "Shop", id: "products" },
-            { name: "Testimonials", id: "testimonials" },
-            { name: "Contact", id: "contact" },
+            { name: "Home", id: "/" },
+            { name: "About", id: "/#about" },
+            { name: "Shop", id: "/shop" },
+            { name: "Testimonials", id: "/#testimonials" },
+            { name: "Contact", id: "/#contact" },
           ]}
           brandName="Angola"
           bottomLeftText="Experience the Beauty"
@@ -44,8 +44,8 @@ export default function LandingPage() {
           logoText="Angola"
           description="Crafting exquisite floral arrangements for every occasion, bringing beauty and joy to your special moments."
           buttons={[
-            { text: "Shop Now", href: "#products" },
-            { text: "Our Story", href: "#about" },
+            { text: "Shop Now", href: "/shop" },
+            { text: "Our Story", href: "/#about" },
           ]}
           slides={[
             {
@@ -67,7 +67,7 @@ export default function LandingPage() {
             "At Angola, we believe in the power of flowers to express emotions, celebrate milestones, and create unforgettable memories. Our studio is dedicated to sourcing the freshest, most beautiful blooms and transforming them into stunning works of art.",            "Every arrangement is crafted with meticulous care and a keen eye for design, ensuring that each bouquet tells its own unique story. We pour our heart into every petal, bringing beauty and elegance to your world."]}
           buttons={[
             { text: "Meet Our Team", href: "#team" },
-            { text: "Contact Us", href: "#contact" },
+            { text: "Contact Us", href: "/#contact" },
           ]}
           useInvertedBackground={false}
           showBorder={false}
@@ -159,16 +159,16 @@ export default function LandingPage() {
           columns={[
             {
               title: "Shop",              items: [
-                { label: "Bouquets", href: "#products" },
-                { label: "Arrangements", href: "#products" },
-                { label: "Custom Orders", href: "#contact" },
+                { label: "Bouquets", href: "/shop" },
+                { label: "Arrangements", href: "/shop" },
+                { label: "Custom Orders", href: "/#contact" },
               ],
             },
             {
               title: "Company",              items: [
-                { label: "About Us", href: "#about" },
-                { label: "FAQ", href: "#faq" },
-                { label: "Contact", href: "#contact" },
+                { label: "About Us", href: "/#about" },
+                { label: "FAQ", href: "/#faq" },
+                { label: "Contact", href: "/#contact" },
               ],
             },
             {

src/app/shop/[id]/page.tsx

@@ -93,8 +93,10 @@ function ProductPageContent({ params }: ProductPageProps) {
                     <NavbarStyleFullscreen
                         navItems={[
                             { name: "Home", id: "/" },
+                            { name: "About", id: "/#about" },
                             { name: "Shop", id: "/shop" },
-                            { name: "Contact", id: "/contacts" }
+                            { name: "Testimonials", id: "/#testimonials" },
+                            { name: "Contact", id: "/#contact" },
                         ]}
                         brandName="Angola"
                         bottomLeftText="Experience the Beauty"
@@ -131,8 +133,10 @@ function ProductPageContent({ params }: ProductPageProps) {
                         <NavbarStyleFullscreen
                             navItems={[
                                 { name: "Home", id: "/" },
+                                { name: "About", id: "/#about" },
                                 { name: "Shop", id: "/shop" },
-                                { name: "Contact", id: "/contacts" }
+                                { name: "Testimonials", id: "/#testimonials" },
+                                { name: "Contact", id: "/#contact" },
                             ]}
                             brandName="Angola"
                             bottomLeftText="Experience the Beauty"
@@ -176,8 +180,10 @@ function ProductPageContent({ params }: ProductPageProps) {
                     <NavbarStyleFullscreen
                         navItems={[
                             { name: "Home", id: "/" },
+                            { name: "About", id: "/#about" },
                             { name: "Shop", id: "/shop" },
-                            { name: "Contact", id: "/contacts" }
+                            { name: "Testimonials", id: "/#testimonials" },
+                            { name: "Contact", id: "/#contact" },
                         ]}
                         brandName="Angola"
                         bottomLeftText="Experience the Beauty"
@@ -226,8 +232,12 @@ function ProductPageContent({ params }: ProductPageProps) {
                         imageSrc="http://img.b2bpic.net/free-photo/beautiful-decoration-cute-little-dried-colorful-flowers-wallpaper_343596-3238.jpg?_wi=4"
                         imageAlt="Soft, blurred pastel flowers in a tranquil setting"
                         columns={[
-                           { title: "Shop", items: [{ label: "Bouquets", href: "/shop" }, { label: "Arrangements", href: "/shop" }, { label: "Custom Orders", href: "/contacts" }] },
-                           { title: "Company", items: [{ label: "About Us", href: "/" }, { label: "FAQ", href: "/" }, { label: "Contact", href: "/contacts" }] },
+                           { title: "Shop", items: [{ label: "Bouquets", href: "/shop" }, { label: "Arrangements", href: "/shop" }, { label: "Custom Orders", href: "/#contact" }] },
+                           { title: "Company", items: [
+                            { label: "About Us", href: "/#about" },
+                            { label: "FAQ", href: "/#faq" },
+                            { label: "Contact", href: "/#contact" }
+                           ] },
                            { title: "Connect", items: [{ label: "Instagram", href: "https://instagram.com/angola_flowers" }, { label: "Facebook", href: "https://facebook.com/angola_flowers" }] }
                         ]}
                         logoText="Angola"

src/app/shop/page.tsx

@@ -36,8 +36,10 @@ function ShopPageContent() {
                     <NavbarStyleFullscreen
                         navItems={[
                             { name: "Home", id: "/" },
+                            { name: "About", id: "/#about" },
                             { name: "Shop", id: "/shop" },
-                            { name: "Contact", id: "/contacts" }
+                            { name: "Testimonials", id: "/#testimonials" },
+                            { name: "Contact", id: "/#contact" },
                         ]}
                         brandName="Angola"
                         bottomLeftText="Experience the Beauty"
@@ -73,8 +75,10 @@ function ShopPageContent() {
                     <NavbarStyleFullscreen
                         navItems={[
                             { name: "Home", id: "/" },
+                            { name: "About", id: "/#about" },
                             { name: "Shop", id: "/shop" },
-                            { name: "Contact", id: "/contacts" }
+                            { name: "Testimonials", id: "/#testimonials" },
+                            { name: "Contact", id: "/#contact" },
                         ]}
                         brandName="Angola"
                         bottomLeftText="Experience the Beauty"
@@ -98,8 +102,12 @@ function ShopPageContent() {
                         imageSrc="http://img.b2bpic.net/free-photo/beautiful-decoration-cute-little-dried-colorful-flowers-wallpaper_343596-3238.jpg?_wi=3"
                         imageAlt="Soft, blurred pastel flowers in a tranquil setting"
                         columns={[
-                           { title: "Shop", items: [{ label: "Bouquets", href: "/shop" }, { label: "Arrangements", href: "/shop" }, { label: "Custom Orders", href: "/contacts" }] },
-                           { title: "Company", items: [{ label: "About Us", href: "/" }, { label: "FAQ", href: "/" }, { label: "Contact", href: "/contacts" }] },
+                           { title: "Shop", items: [{ label: "Bouquets", href: "/shop" }, { label: "Arrangements", href: "/shop" }, { label: "Custom Orders", href: "/#contact" }] },
+                           { title: "Company", items: [
+                            { label: "About Us", href: "/#about" },
+                            { label: "FAQ", href: "/#faq" },
+                            { label: "Contact", href: "/#contact" }
+                           ] },
                            { title: "Connect", items: [{ label: "Instagram", href: "https://instagram.com/angola_flowers" }, { label: "Facebook", href: "https://facebook.com/angola_flowers" }] }
                         ]}
                         logoText="Angola"

src/app/styles/variables.css

@@ -2,23 +2,23 @@
   /* Base units */
   /* --vw is set by ThemeProvider */
 
-  /* --background: #ffffff;;
-  --card: #f9f9f9;;
-  --foreground: #120006e6;;
-  --primary-cta: #e63946;;
-  --secondary-cta: #f9f9f9;;
-  --accent: #e2e2e2;;
-  --background-accent: #c4c4c4;; */
+  /* --background: #060000;;
+  --card: #1d0d0d;;
+  --foreground: #ffe6e6;;
+  --primary-cta: #ff3d4a;;
+  --secondary-cta: #1f0a0a;;
+  --accent: #7b2d2d;;
+  --background-accent: #b8111f;; */
 
-  --background: #ffffff;;
-  --card: #f9f9f9;;
-  --foreground: #120006e6;;
-  --primary-cta: #e63946;;
-  --primary-cta-text: #ffffff;;
-  --secondary-cta: #f9f9f9;;
-  --secondary-cta-text: #120006e6;;
-  --accent: #e2e2e2;;
-  --background-accent: #c4c4c4;;
+  --background: #060000;;
+  --card: #1d0d0d;;
+  --foreground: #ffe6e6;;
+  --primary-cta: #ff3d4a;;
+  --primary-cta-text: #060000;;
+  --secondary-cta: #1f0a0a;;
+  --secondary-cta-text: #ffe6e6;;
+  --accent: #7b2d2d;;
+  --background-accent: #b8111f;;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);