diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 1ff10cd..d50ca7a 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,19 +1,12 @@ import type { Metadata } from "next"; -import { Inter_Tight } from "next/font/google"; -import { Halant } from "next/font/google"; +import { DM_Sans } from "next/font/google"; import { Inter } from "next/font/google"; import "./globals.css"; import { ServiceWrapper } from "@/components/ServiceWrapper"; import Tag from "@/tag/Tag"; -const interTight = Inter_Tight({ - variable: "--font-inter-tight", subsets: ["latin"], - weight: ["100", "200", "300", "400", "500", "600", "700", "800", "900"], -}); - -const halant = Halant({ - variable: "--font-halant", subsets: ["latin"], - weight: ["300", "400", "500", "600", "700"], +const dmSans = DM_Sans({ + variable: "--font-dm-sans", subsets: ["latin"], }); const inter = Inter({ @@ -50,7 +43,7 @@ export default function RootLayout({ {children} diff --git a/src/app/page.tsx b/src/app/page.tsx index 03132a0..eaf25ce 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,6 +1,7 @@ "use client"; import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import { useState } from "react"; import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered'; import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel'; import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen'; @@ -10,42 +11,64 @@ import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCa import FaqDouble from '@/components/sections/faq/FaqDouble'; import ContactFaq from '@/components/sections/contact/ContactFaq'; import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal'; -import { Sparkles, Zap, Lightbulb, Rocket, Users, Star, HelpCircle, Download } from 'lucide-react'; +import { Sparkles, Zap, Lightbulb, Rocket, Users, Star, HelpCircle, Download, Moon, Sun } from 'lucide-react'; export default function LandingPage() { + const [isDarkMode, setIsDarkMode] = useState(false); + + const themeProps = isDarkMode ? { + defaultButtonVariant: "hover-magnetic" as const, + defaultTextAnimation: "reveal-blur" as const, + borderRadius: "soft" as const, + contentWidth: "small" as const, + sizing: "mediumLargeSizeLargeTitles" as const, + background: "noise" as const, + cardStyle: "soft-shadow" as const, + primaryButtonStyle: "gradient" as const, + secondaryButtonStyle: "layered" as const, + headingFontWeight: "semibold" as const + } : { + defaultButtonVariant: "hover-magnetic" as const, + defaultTextAnimation: "reveal-blur" as const, + borderRadius: "soft" as const, + contentWidth: "small" as const, + sizing: "mediumLargeSizeLargeTitles" as const, + background: "noise" as const, + cardStyle: "soft-shadow" as const, + primaryButtonStyle: "gradient" as const, + secondaryButtonStyle: "layered" as const, + headingFontWeight: "semibold" as const + }; + return ( - +
@@ -123,8 +146,8 @@ export default function LandingPage() { tagIcon={Lightbulb} tagAnimation="slide-up" title="Democratizing App Development" - description="Native Line is built for indie developers, entrepreneurs, and creators who are frustrated with slow, expensive development processes." - subdescription="We believe anyone with an idea deserves the ability to ship production-quality native apps without hiring a team of engineers." + description="Native Line empowers indie developers and entrepreneurs who want to ship fast." + subdescription="Anyone with an idea should be able to build production-quality native apps without hiring a team of engineers." icon={Rocket} imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQRMtx5ZUGLrwvjDcVIYHeaKiH/a-lifestyle-photo-showing-an-indie-devel-1772522999346-c2d8c8e5.png" imageAlt="Developer using Native Line" @@ -135,8 +158,8 @@ export default function LandingPage() {
@@ -161,8 +184,8 @@ export default function LandingPage() {
@@ -209,7 +232,7 @@ export default function LandingPage() {
@@ -253,26 +276,26 @@ export default function LandingPage() {
@@ -283,7 +306,7 @@ export default function LandingPage() { columns={[ { title: "Product", items: [ - { label: "Download for macOS", href: "https://example.com/download" }, + { label: "Download", href: "https://example.com/download" }, { label: "Features", href: "#features" }, { label: "How It Works", href: "#process" }, { label: "Native Line Cloud", href: "#" } @@ -299,10 +322,10 @@ export default function LandingPage() { }, { title: "Company", items: [ - { label: "About Us", href: "#about" }, + { label: "About", href: "#about" }, { label: "Contact", href: "#contact" }, - { label: "Privacy Policy", href: "#" }, - { label: "Terms of Service", href: "#" } + { label: "Privacy", href: "#" }, + { label: "Terms", href: "#" } ] } ]} diff --git a/src/app/styles/variables.css b/src/app/styles/variables.css index 0af5aa1..20a1810 100644 --- a/src/app/styles/variables.css +++ b/src/app/styles/variables.css @@ -2,23 +2,23 @@ /* Base units */ /* --vw is set by ThemeProvider */ - /* --background: #ffffff;; - --card: #f9f9f9;; - --foreground: #120a00e6;; - --primary-cta: #ff8c42;; - --secondary-cta: #f9f9f9;; - --accent: #e2e2e2;; - --background-accent: #c4c4c4;; */ + /* --background: #f5f3f0;;; + --card: #fdfbf9;;; + --foreground: #2a2520;;; + --primary-cta: #c27644;;; + --secondary-cta: #fdfbf9;;; + --accent: #d4ccc3;;; + --background-accent: #e8dfd4";;; */ - --background: #ffffff;; - --card: #f9f9f9;; - --foreground: #120a00e6;; - --primary-cta: #ff8c42;; - --primary-cta-text: #ffffff;; - --secondary-cta: #f9f9f9;; - --secondary-cta-text: #120a00e6;; - --accent: #e2e2e2;; - --background-accent: #c4c4c4;; + --background: #f5f3f0;;; + --card: #fdfbf9;;; + --foreground: #2a2520;;; + --primary-cta: #c27644;;; + --primary-cta-text: #ffffff;;; + --secondary-cta: #fdfbf9;;; + --secondary-cta-text: #120a00e6;;; + --accent: #d4ccc3;;; + --background-accent: #e8dfd4";;; /* text sizing - set by ThemeProvider */ /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);