Update src/app/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -3,16 +3,16 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import BlogCardThree from '@/components/sections/blog/BlogCardThree';
-import ContactCenter from '@/components/sections/contact/ContactCenter';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import FaqBase from '@/components/sections/faq/FaqBase';
 import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
-import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
+import FooterCard from '@/components/sections/footer/FooterCard';
 import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
 import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
 import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
-import { Award, TrendingUp, Users } from "lucide-react";
+import { Award, TrendingUp, Users, Mail, Phone, MapPin } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -32,14 +32,10 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleCentered
       navItems={[
-        {
+        { name: "Start", id: "hero" },
-          name: "Start",          id: "hero"},
+        { name: "Om oss", id: "about" },
-        {
+        { name: "Tjänster", id: "features" },
-          name: "Om oss",          id: "about"},
+        { name: "Kontakt", id: "contact" },
-        {
-          name: "Tjänster",          id: "features"},
-        {
-          name: "Kontakt",          id: "contact"},
       ]}
       brandName="CorpDesign"
     />
@@ -47,28 +43,20 @@ export default function LandingPage() {
 
   <div id="hero" data-section="hero">
       <HeroBillboardCarousel
-      background={{
+      background={{ variant: "gradient-bars" }}
-        variant: "gradient-bars"}}
       title="Framtidens företagslösningar"
       description="Vi hjälper företag att växa genom moderna digitala strategier och innovativa lösningar som skapar långsiktigt värde."
       tag="Innovationspartner"
       buttons={[
-        {
+        { text: "Läs mer", href: "#about" },
-          text: "Läs mer",          href: "#about"},
       ]}
       mediaItems={[
-        {
+        { imageSrc: "http://img.b2bpic.net/free-photo/business-meeting-working-room-office-building_105762-1712.jpg", imageAlt: "Modern kontorsmiljö" },
-          imageSrc: "http://img.b2bpic.net/free-photo/business-meeting-working-room-office-building_105762-1712.jpg",          imageAlt: "Modern kontorsmiljö"},
+        { imageSrc: "http://img.b2bpic.net/free-photo/executives-with-digital-tablet-having-meeting-office_1098-1881.jpg", imageAlt: "Teamarbete" },
-        {
+        { imageSrc: "http://img.b2bpic.net/free-photo/white-geometrical-shapes-background_23-2148811541.jpg", imageAlt: "Dataanalys" },
-          imageSrc: "http://img.b2bpic.net/free-photo/executives-with-digital-tablet-having-meeting-office_1098-1881.jpg",          imageAlt: "Teamarbete"},
+        { imageSrc: "http://img.b2bpic.net/free-photo/glass-skyscraper-against-blue-sky-view-from-bottom_93675-134753.jpg", imageAlt: "Arkitektur" },
-        {
+        { imageSrc: "http://img.b2bpic.net/free-photo/close-up-digital-tablet-with-financial-results_1098-482.jpg", imageAlt: "Affärsteknik" },
-          imageSrc: "http://img.b2bpic.net/free-photo/white-geometrical-shapes-background_23-2148811541.jpg",          imageAlt: "Dataanalys"},
+        { imageSrc: "http://img.b2bpic.net/free-photo/top-view-computer-books-blue-table-work-desk_169016-48930.jpg", imageAlt: "Arbetsflöde" },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/glass-skyscraper-against-blue-sky-view-from-bottom_93675-134753.jpg",          imageAlt: "Arkitektur"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-digital-tablet-with-financial-results_1098-482.jpg",          imageAlt: "Affärsteknik"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/top-view-computer-books-blue-table-work-desk_169016-48930.jpg",          imageAlt: "Arbetsflöde"},
       ]}
     />
   </div>
@@ -79,12 +67,9 @@ export default function LandingPage() {
       title="Erfarenhet och innovation"
       description="Med över ett decennium av erfarenhet inom branschen bygger vi broar mellan komplexa affärsbehov och effektiva tekniska lösningar."
       metrics={[
-        {
+        { value: "150+", title: "Projekt levererade" },
-          value: "150+",          title: "Projekt levererade"},
+        { value: "98%", title: "Nöjda kunder" },
-        {
+        { value: "24/7", title: "Support" },
-          value: "98%",          title: "Nöjda kunder"},
-        {
-          value: "24/7",          title: "Support"},
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/abstract-blur-hotel-lobby_74190-4475.jpg"
       imageAlt="Kontorsinteriör"
@@ -99,18 +84,9 @@ export default function LandingPage() {
       textboxLayout="split-description"
       useInvertedBackground={true}
       features={[
-        {
+        { id: "f1", title: "Strategisk rådgivning", tags: ["Strategi", "Affärsutveckling"], imageSrc: "http://img.b2bpic.net/free-photo/diverse-team-analyzing-goods-quality-control-report-tablet_482257-84290.jpg", imageAlt: "Strategi" },
-          id: "f1",          title: "Strategisk rådgivning",          tags: [
+        { id: "f2", title: "Digital transformation", tags: ["Tech", "Cloud"], imageSrc: "http://img.b2bpic.net/free-photo/executive-manager-analyzing-marketing-statistics-working-late-night-project-strategy-startup-office-businessman-planning-business-investment-help-increase-company-profit_482257-63809.jpg", imageAlt: "Digital transformation" },
-            "Strategi",            "Affärsutveckling"],
+        { id: "f3", title: "Datasäkerhet", tags: ["Security", "Data"], imageSrc: "http://img.b2bpic.net/free-photo/digital-health-security-data-protection-concept_84443-83688.jpg", imageAlt: "Säkerhet" },
-          imageSrc: "http://img.b2bpic.net/free-photo/diverse-team-analyzing-goods-quality-control-report-tablet_482257-84290.jpg",          imageAlt: "Strategi"},
-        {
-          id: "f2",          title: "Digital transformation",          tags: [
-            "Tech",            "Cloud"],
-          imageSrc: "http://img.b2bpic.net/free-photo/executive-manager-analyzing-marketing-statistics-working-late-night-project-strategy-startup-office-businessman-planning-business-investment-help-increase-company-profit_482257-63809.jpg",          imageAlt: "Digital transformation"},
-        {
-          id: "f3",          title: "Datasäkerhet",          tags: [
-            "Security",            "Data"],
-          imageSrc: "http://img.b2bpic.net/free-photo/digital-health-security-data-protection-concept_84443-83688.jpg",          imageAlt: "Säkerhet"},
       ]}
       title="Våra tjänster"
       description="Vi erbjuder ett brett spektrum av tjänster för att stötta er digitala transformation."
@@ -124,15 +100,9 @@ export default function LandingPage() {
       gridVariant="bento-grid"
       useInvertedBackground={false}
       metrics={[
-        {
+        { id: "m1", value: "25%", title: "Ökad lönsamhet", description: "Genomsnittlig ökning för våra kunder.", icon: TrendingUp },
-          id: "m1",          value: "25%",          title: "Ökad lönsamhet",          description: "Genomsnittlig ökning för våra kunder.",          icon: TrendingUp,
+        { id: "m2", value: "100k", title: "Användare", description: "Aktiva användare i våra system.", icon: Users },
-        },
+        { id: "m3", value: "50+", title: "Partners", description: "Starka samarbetspartners globalt.", icon: Award },
-        {
-          id: "m2",          value: "100k",          title: "Användare",          description: "Aktiva användare i våra system.",          icon: Users,
-        },
-        {
-          id: "m3",          value: "50+",          title: "Partners",          description: "Starka samarbetspartners globalt.",          icon: Award,
-        },
       ]}
       title="Resultat som räknas"
       description="Våra siffror speglar vår dedikation till att leverera högsta kvalitet i varje projekt."
@@ -146,16 +116,11 @@ export default function LandingPage() {
       rating={5}
       author="Anna Larsson, VD på TechGroup"
       avatars={[
-        {
+        { src: "http://img.b2bpic.net/free-photo/close-up-serious-worker-with-glasses_1098-4076.jpg", alt: "Anna" },
-          src: "http://img.b2bpic.net/free-photo/close-up-serious-worker-with-glasses_1098-4076.jpg",          alt: "Anna"},
+        { src: "http://img.b2bpic.net/free-photo/female-entrepreneur-reading-business-reports-drinking-coffee-while-sitting-her-desk-office-there-are-people-background_637285-52.jpg", alt: "Michael" },
-        {
+        { src: "http://img.b2bpic.net/free-photo/african-american-male-professional-works-desk-corporation_482257-122689.jpg", alt: "David" },
-          src: "http://img.b2bpic.net/free-photo/female-entrepreneur-reading-business-reports-drinking-coffee-while-sitting-her-desk-office-there-are-people-background_637285-52.jpg",          alt: "Michael"},
+        { src: "http://img.b2bpic.net/free-photo/column-business-working-mobile-tie_1157-3667.jpg", alt: "Emily" },
-        {
+        { src: "http://img.b2bpic.net/free-photo/serious-senior-businessman-with-clipboards_1262-1934.jpg", alt: "Marcus" },
-          src: "http://img.b2bpic.net/free-photo/african-american-male-professional-works-desk-corporation_482257-122689.jpg",          alt: "David"},
-        {
-          src: "http://img.b2bpic.net/free-photo/column-business-working-mobile-tie_1157-3667.jpg",          alt: "Emily"},
-        {
-          src: "http://img.b2bpic.net/free-photo/serious-senior-businessman-with-clipboards_1262-1934.jpg",          alt: "Marcus"},
       ]}
       ratingAnimation="slide-up"
       avatarsAnimation="slide-up"
@@ -167,12 +132,9 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       faqs={[
-        {
+        { id: "q1", title: "Hur kommer vi igång?", content: "Kontakta oss för en första konsultation." },
-          id: "q1",          title: "Hur kommer vi igång?",          content: "Kontakta oss för en första konsultation."},
+        { id: "q2", title: "Vad kostar det?", content: "Priset varierar baserat på projektets omfattning." },
-        {
+        { id: "q3", title: "Hur lång tid tar ett projekt?", content: "Tidsramen beror på komplexiteten i uppdraget." },
-          id: "q2",          title: "Vad kostar det?",          content: "Priset varierar baserat på projektets omfattning."},
-        {
-          id: "q3",          title: "Hur lång tid tar ett projekt?",          content: "Tidsramen beror på komplexiteten i uppdraget."},
       ]}
       title="Vanliga frågor"
       description="Här har vi samlat svar på de vanligaste frågorna vi får från våra kunder."
@@ -188,49 +150,32 @@ export default function LandingPage() {
       title="Insikter & Nyheter"
       description="Håll dig uppdaterad med de senaste trenderna inom branschen."
       blogs={[
-        {
+        { id: "b1", category: "Tech", title: "Framtidens AI", excerpt: "Hur AI förändrar företagsstrukturer.", imageSrc: "http://img.b2bpic.net/free-photo/student-boy-using-laptop-learning-online-education_1150-16898.jpg", authorName: "Erik", authorAvatar: "http://img.b2bpic.net/free-photo/smiling-beautiful-middle-aged-business-woman_1262-3085.jpg", date: "2023-10-01" },
-          id: "b1",          category: "Tech",          title: "Framtidens AI",          excerpt: "Hur AI förändrar företagsstrukturer.",          imageSrc: "http://img.b2bpic.net/free-photo/student-boy-using-laptop-learning-online-education_1150-16898.jpg",          authorName: "Erik",          authorAvatar: "http://img.b2bpic.net/free-photo/smiling-beautiful-middle-aged-business-woman_1262-3085.jpg",          date: "2023-10-01"},
+        { id: "b2", category: "Business", title: "Digital tillväxt", excerpt: "Att växa digitalt är avgörande.", imageSrc: "http://img.b2bpic.net/free-photo/industrial-designers-working-office-with-computers_23-2149307806.jpg", authorName: "Lisa", authorAvatar: "http://img.b2bpic.net/free-photo/cheerful-man-with-diagram_23-2147669294.jpg", date: "2023-10-05" },
-        {
+        { id: "b3", category: "Security", title: "Säkra nätverk", excerpt: "Säkerhet i molnet är prio.", imageSrc: "http://img.b2bpic.net/free-photo/informational-agency-multiracial-tech-engineers-programming-application-while-using-computer-cyber-security-company-developers-encrypting-cloud-processing-data-system-using-blockchain-technology_482257-40527.jpg", authorName: "Johan", authorAvatar: "http://img.b2bpic.net/free-photo/closeup-confident-asian-man-with-arms-crossed_1262-884.jpg", date: "2023-10-10" },
-          id: "b2",          category: "Business",          title: "Digital tillväxt",          excerpt: "Att växa digitalt är avgörande.",          imageSrc: "http://img.b2bpic.net/free-photo/industrial-designers-working-office-with-computers_23-2149307806.jpg",          authorName: "Lisa",          authorAvatar: "http://img.b2bpic.net/free-photo/cheerful-man-with-diagram_23-2147669294.jpg",          date: "2023-10-05"},
-        {
-          id: "b3",          category: "Security",          title: "Säkra nätverk",          excerpt: "Säkerhet i molnet är prio.",          imageSrc: "http://img.b2bpic.net/free-photo/informational-agency-multiracial-tech-engineers-programming-application-while-using-computer-cyber-security-company-developers-encrypting-cloud-processing-data-system-using-blockchain-technology_482257-40527.jpg",          authorName: "Johan",          authorAvatar: "http://img.b2bpic.net/free-photo/closeup-confident-asian-man-with-arms-crossed_1262-884.jpg",          date: "2023-10-10"},
       ]}
     />
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactCenter
+      <ContactSplitForm
-      useInvertedBackground={false}
+      title="Kontakta oss"
-      background={{
+      description="Vi är redo att hjälpa ditt företag. Skicka en förfrågan så återkommer vi så snart som möjligt."
-        variant: "rotated-rays-static"}}
+      inputs={[
-      tag="Kontakta oss"
+        { name: "namn", type: "text", placeholder: "Namn", required: true },
-      title="Börja din resa idag"
+        { name: "email", type: "email", placeholder: "E-post", required: true }
-      description="Vi ser fram emot att höra från dig och diskutera hur vi kan hjälpa ditt företag att nå nya höjder."
+      ]}
+      textarea={{ name: "meddelande", placeholder: "Ditt meddelande", rows: 4, required: true }}
       buttonText="Skicka förfrågan"
+      useInvertedBackground={true}
+      imageSrc="http://img.b2bpic.net/free-photo/office-desk-with-coffee-cup-tablet-laptop_23-2147746765.jpg"
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterLogoEmphasis
+      <FooterCard
-      columns={[
-        {
-          items: [
-            {
-              label: "Om oss",              href: "#about"},
-            {
-              label: "Tjänster",              href: "#features"},
-          ],
-        },
-        {
-          items: [
-            {
-              label: "Kontakt",              href: "#contact"},
-            {
-              label: "Integritetspolicy",              href: "#"},
-          ],
-        },
-      ]}
       logoText="CorpDesign"
+      copyrightText="© 2024 CorpDesign AB | Alla rättigheter förbehållna"
     />
   </div>
       </ReactLenis>