Add src/app/pricing/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -32,22 +32,10 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleCentered
       navItems={[
-        {
+        { name: "O nas", id: "about" },
-          name: "O nas",
+        { name: "Storitve", id: "features" },
-          id: "about",
+        { name: "Cenik", id: "/pricing" },
-        },
+        { name: "Kontakt", id: "contact" },
-        {
-          name: "Storitve",
-          id: "features",
-        },
-        {
-          name: "Cenik",
-          id: "pricing",
-        },
-        {
-          name: "Kontakt",
-          id: "contact",
-        },
       ]}
       brandName="ART Kozmetika"
     />
@@ -55,56 +43,28 @@ export default function LandingPage() {
 
   <div id="hero" data-section="hero">
       <HeroBillboardCarousel
-      background={{
+      background={{ variant: "gradient-bars" }}
-        variant: "gradient-bars",
-      }}
       title="ART Kozmetika"
       description="Profesionalne kozmetične storitve in permanentno ličenje, kjer se popolnost sreča z naravno lepoto."
-      buttons={[
+      buttons={[{ text: "Rezerviraj termin", href: "#contact" }]}
-        {
-          text: "Rezerviraj termin",
-          href: "#contact",
-        },
-      ]}
       mediaItems={[
-        {
+        { imageSrc: "http://img.b2bpic.net/free-photo/set-make-up-brushes-lies-table_8353-8869.jpg" },
-          imageSrc: "http://img.b2bpic.net/free-photo/set-make-up-brushes-lies-table_8353-8869.jpg",
+        { imageSrc: "http://img.b2bpic.net/free-photo/fuzzy-room-with-armchairs_1203-958.jpg" },
-          imageAlt: "Salon Interior 1",
+        { imageSrc: "http://img.b2bpic.net/free-photo/interior-latino-hair-salon_23-2150555185.jpg" },
-        },
+        { imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-spa-massage-wellness-hotel-suite-with-bathtub_105762-2027.jpg" },
-        {
+        { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DXItXdNqqYf1i0QSIrPqpBHCSx/uploaded-1778517079654-6o88l8rw.jpg" },
-          imageSrc: "http://img.b2bpic.net/free-photo/fuzzy-room-with-armchairs_1203-958.jpg",
+        { imageSrc: "http://img.b2bpic.net/free-photo/vanity-case-products-arrangement_23-2149879908.jpg" },
-          imageAlt: "Salon Interior 2",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/interior-latino-hair-salon_23-2150555185.jpg",
-          imageAlt: "Salon Interior 3",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-spa-massage-wellness-hotel-suite-with-bathtub_105762-2027.jpg",
-          imageAlt: "Salon Interior 4",
-        },
-        {
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DXItXdNqqYf1i0QSIrPqpBHCSx/uploaded-1778517079654-6o88l8rw.jpg",
-          imageAlt: "Salon Interior 5",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/vanity-case-products-arrangement_23-2149879908.jpg",
-          imageAlt: "Salon Interior 6",
-        },
       ]}
     />
   </div>
 
   <div id="about" data-section="about">
       <TestimonialAboutCard
-      useInvertedBackground={false}
       tag="O nas"
       title="Maja Vulić s.p."
       description="Z večletnimi izkušnjami v kozmetiki in permanentnem ličenju ustvarjam podobe, ki poudarjajo vašo unikatnost."
       subdescription="Moje poslanstvo je zagotoviti vrhunske rezultate s pomočjo najboljših tehnik in materialov."
       imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DXItXdNqqYf1i0QSIrPqpBHCSx/uploaded-1778514622359-ftevbar0.jpg"
-      imageAlt="Maja Vulić"
-      mediaAnimation="slide-up"
       icon={User}
     />
   </div>
@@ -115,98 +75,24 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={true}
       features={[
-        {
+        { title: "Permanentno ličenje", description: "Microblading in senčenje obrvi, ustnic in oči.", icon: Sparkles },
-          title: "Permanentno ličenje",
+        { title: "Nega obraza", description: "Globinsko čiščenje in revitalizacija kože.", icon: Smile },
-          description: "Microblading in senčenje obrvi, ustnic in oči.",
+        { title: "Oblikovanje obrvi", description: "Natančno oblikovanje z nitko ali voskom.", icon: Scissors },
-          icon: Sparkles,
-        },
-        {
-          title: "Nega obraza",
-          description: "Globinsko čiščenje in revitalizacija kože.",
-          icon: Smile,
-        },
-        {
-          title: "Oblikovanje obrvi",
-          description: "Natančno oblikovanje z nitko ali voskom.",
-          icon: Scissors,
-        },
       ]}
       title="Naše storitve"
       description="Nudimo širok spekter tretmajev prilagojenih vašim potrebam."
     />
   </div>
 
-  <div id="pricing" data-section="pricing">
-      <PricingCardOne
-      animationType="slide-up"
-      textboxLayout="default"
-      useInvertedBackground={false}
-      plans={[
-        {
-          id: "p1",
-          badge: "Popularno",
-          price: "od 150 €",
-          subtitle: "Permanentno ličenje",
-          features: [
-            "Posvet",
-            "Izris",
-            "Tretma",
-          ],
-        },
-        {
-          id: "p2",
-          badge: "Osnovno",
-          price: "od 50 €",
-          subtitle: "Nega obraza",
-          features: [
-            "Čiščenje",
-            "Maska",
-            "Serum",
-          ],
-        },
-        {
-          id: "p3",
-          badge: "Hitro",
-          price: "od 20 €",
-          subtitle: "Oblikovanje obrvi",
-          features: [
-            "Oblikovanje",
-            "Barvanje",
-          ],
-        },
-      ]}
-      title="Cenik storitev"
-      description="Pregled naših najpopularnejših tretmajev."
-    />
-  </div>
-
   <div id="metrics" data-section="metrics">
       <MetricCardEleven
       animationType="slide-up"
       textboxLayout="default"
       useInvertedBackground={true}
       metrics={[
-        {
+        { id: "m1", value: "500+", title: "Zadovoljnih strank", description: "Uspešno opravljenih tretmajev.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-female-visagiste-holding-cosmetic-brushes_23-2148113083.jpg" },
-          id: "m1",
+        { id: "m2", value: "10+", title: "Let izkušenj", description: "Vrhunska znanja in tehnike.", imageSrc: "http://img.b2bpic.net/free-photo/crop-woman-taking-makeup-brushes_23-2147783911.jpg" },
-          value: "500+",
+        { id: "m3", value: "100%", title: "Kakovost", description: "Uporaba varnih materialov.", imageSrc: "http://img.b2bpic.net/free-photo/cosmetic-brushes-bag_23-2147710668.jpg" },
-          title: "Zadovoljnih strank",
-          description: "Uspešno opravljenih tretmajev.",
-          imageSrc: "http://img.b2bpic.net/free-photo/smiling-female-visagiste-holding-cosmetic-brushes_23-2148113083.jpg",
-        },
-        {
-          id: "m2",
-          value: "10+",
-          title: "Let izkušenj",
-          description: "Vrhunska znanja in tehnike.",
-          imageSrc: "http://img.b2bpic.net/free-photo/crop-woman-taking-makeup-brushes_23-2147783911.jpg",
-        },
-        {
-          id: "m3",
-          value: "100%",
-          title: "Kakovost",
-          description: "Uporaba varnih materialov.",
-          imageSrc: "http://img.b2bpic.net/free-photo/cosmetic-brushes-bag_23-2147710668.jpg",
-        },
       ]}
       title="Zakaj ART Kozmetika?"
       description="Številke, ki govorijo o naši predanosti lepoti."
@@ -215,33 +101,12 @@ export default function LandingPage() {
 
   <div id="testimonials" data-section="testimonials">
       <TestimonialCardTwelve
-      useInvertedBackground={false}
       testimonials={[
-        {
+        { id: "1", name: "Ana K.", imageSrc: "http://img.b2bpic.net/free-photo/front-view-cute-girl-looking-away_23-2148436134.jpg" },
-          id: "1",
+        { id: "2", name: "Maja L.", imageSrc: "http://img.b2bpic.net/free-photo/happy-serene-young-woman-with-beautiful-olive-skin-curly-hair-ideal-skin-brown-eyes-studio_633478-1001.jpg" },
-          name: "Ana K.",
+        { id: "3", name: "Petra S.", imageSrc: "http://img.b2bpic.net/free-photo/image-working-woman-office-digital-nomad-with-laptop-programmer-designing-web-page-computer_1258-195373.jpg" },
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-cute-girl-looking-away_23-2148436134.jpg",
+        { id: "4", name: "Tina B.", imageSrc: "http://img.b2bpic.net/free-photo/hands-applying-makeup-by-brush_23-2148398604.jpg" },
-        },
+        { id: "5", name: "Kaja V.", imageSrc: "http://img.b2bpic.net/free-photo/person-eating-seaweed-snacks_23-2150519985.jpg" },
-        {
-          id: "2",
-          name: "Maja L.",
-          imageSrc: "http://img.b2bpic.net/free-photo/happy-serene-young-woman-with-beautiful-olive-skin-curly-hair-ideal-skin-brown-eyes-studio_633478-1001.jpg",
-        },
-        {
-          id: "3",
-          name: "Petra S.",
-          imageSrc: "http://img.b2bpic.net/free-photo/image-working-woman-office-digital-nomad-with-laptop-programmer-designing-web-page-computer_1258-195373.jpg",
-        },
-        {
-          id: "4",
-          name: "Tina B.",
-          imageSrc: "http://img.b2bpic.net/free-photo/hands-applying-makeup-by-brush_23-2148398604.jpg",
-        },
-        {
-          id: "5",
-          name: "Kaja V.",
-          imageSrc: "http://img.b2bpic.net/free-photo/person-eating-seaweed-snacks_23-2150519985.jpg",
-        },
       ]}
       cardTitle="Mnenja strank"
       cardTag="Zadovoljstvo"
@@ -253,21 +118,9 @@ export default function LandingPage() {
       <FaqSplitText
       useInvertedBackground={true}
       faqs={[
-        {
+        { id: "f1", title: "Ali je permanentno ličenje boleče?", content: "Tretma je skoraj neboleč, saj uporabljamo lokalne anestetike." },
-          id: "f1",
+        { id: "f2", title: "Kako dolgo trajajo rezultati?", content: "Rezultati običajno trajajo od 1 do 3 let, odvisno od kože." },
-          title: "Ali je permanentno ličenje boleče?",
+        { id: "f3", title: "Kako se naročim?", content: "Naročite se lahko preko kontaktnega obrazca ali telefona." },
-          content: "Tretma je skoraj neboleč, saj uporabljamo lokalne anestetike.",
-        },
-        {
-          id: "f2",
-          title: "Kako dolgo trajajo rezultati?",
-          content: "Rezultati običajno trajajo od 1 do 3 let, odvisno od kože.",
-        },
-        {
-          id: "f3",
-          title: "Kako se naročim?",
-          content: "Naročite se lahko preko kontaktnega obrazca ali telefona.",
-        },
       ]}
       sideTitle="Pogosta vprašanja"
       sideDescription="Odgovori na vprašanja pred obiskom salona."
@@ -278,9 +131,7 @@ export default function LandingPage() {
   <div id="contact" data-section="contact">
       <ContactSplit
       useInvertedBackground={false}
-      background={{
+      background={{ variant: "plain" }}
-        variant: "plain",
-      }}
       tag="Kontakt"
       title="Naročite se na termin"
       description="Spremenite svojo podobo danes."
@@ -293,32 +144,8 @@ export default function LandingPage() {
       <FooterBaseCard
       logoText="ART Kozmetika"
       columns={[
-        {
+        { title: "Storitve", items: [{ label: "Permanentno ličenje", href: "#features" }, { label: "Nega obraza", href: "#features" }] },
-          title: "Storitve",
+        { title: "Kontakt", items: [{ label: "Email", href: "#contact" }, { label: "Telefon", href: "#contact" }] },
-          items: [
-            {
-              label: "Permanentno ličenje",
-              href: "#features",
-            },
-            {
-              label: "Nega obraza",
-              href: "#features",
-            },
-          ],
-        },
-        {
-          title: "Kontakt",
-          items: [
-            {
-              label: "Email",
-              href: "#contact",
-            },
-            {
-              label: "Telefon",
-              href: "#contact",
-            },
-          ],
-        },
       ]}
       copyrightText="© 2025 ART Kozmetika, Maja Vulić s.p."
     />

src/app/pricing/page.tsx

@@ -0,0 +1,58 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+
+export default function PricingPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="hover-magnetic"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="rounded"
+        contentWidth="medium"
+        sizing="largeSmall"
+        background="fluid"
+        cardStyle="gradient-bordered"
+        primaryButtonStyle="diagonal-gradient"
+        secondaryButtonStyle="glass"
+        headingFontWeight="light"
+    >
+      <ReactLenis root>
+        <NavbarStyleCentered
+          navItems={[
+            { name: "Domov", id: "/" },
+            { name: "Storitve", id: "/#features" },
+            { name: "Cenik", id: "/pricing" },
+            { name: "Kontakt", id: "/#contact" },
+          ]}
+          brandName="ART Kozmetika"
+        />
+        <div className="pt-20">
+            <PricingCardOne
+              animationType="slide-up"
+              textboxLayout="default"
+              title="Naš cenik"
+              description="Pregled vseh storitev za vašo popolno nego."
+              plans={[
+                { id: "facial", badge: "Obraz", price: "od 40 €", subtitle: "Facial Care", features: ["Globinsko čiščenje", "Piling", "Hidratacija", "Masaža obraza"] },
+                { id: "waxing", badge: "Depilacija", price: "od 15 €", subtitle: "Waxing", features: ["Noge", "Roke", "Obraz", "Hrbet"] },
+                { id: "lifting", badge: "Lifting", price: "od 80 €", subtitle: "Specialized Lifting", features: ["Radiofrekvenca", "Ultrazvočni lifting", "Kavitacija"] },
+                { id: "nails", badge: "Nohti", price: "od 25 €", subtitle: "Manicure", features: ["Klasična manikura", "Geliranje", "Poslikave"] },
+                { id: "exclusive", badge: "Ekskluzivno", price: "od 200 €", subtitle: "Exclusive Programs", features: ["Celostna prenova", "Premium paketi", "VIP svetovanje"] },
+              ]}
+            />
+        </div>
+        <FooterBaseCard
+          logoText="ART Kozmetika"
+          columns={[
+            { title: "Storitve", items: [{ label: "Facial Care", href: "#" }, { label: "Waxing", href: "#" }] },
+            { title: "Kontakt", items: [{ label: "Email", href: "/#contact" }, { label: "Telefon", href: "/#contact" }] },
+          ]}
+        />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}