diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 1ff10cd..24108f0 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,25 +1,18 @@ import type { Metadata } from "next"; -import { Inter_Tight } from "next/font/google"; -import { Halant } from "next/font/google"; import { Inter } from "next/font/google"; +import { Open_Sans } 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 inter = Inter({ variable: "--font-inter", subsets: ["latin"], }); +const openSans = Open_Sans({ + variable: "--font-open-sans", subsets: ["latin"], +}); + export const metadata: Metadata = { title: "Native Line - Build Native Apps Just Talk", description: "Create production-ready iOS, iPad, and Mac apps with conversational AI. No code, no compromise. Native Line turns your ideas into native Swift apps instantly.", keywords: "native app builder, iOS development, app generator, no-code, Swift, indie developers, app creation, AI, macOS", metadataBase: new URL("https://nativeline.app"), alternates: { @@ -50,7 +43,7 @@ export default function RootLayout({ {children} diff --git a/src/app/page.tsx b/src/app/page.tsx index 03132a0..935b6f4 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -10,9 +10,36 @@ 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'; +import { useState, useEffect, useCallback } from 'react'; export default function LandingPage() { + const [isDarkMode, setIsDarkMode] = useState(false); + const [mounted, setMounted] = useState(false); + + useEffect(() => { + const saved = localStorage.getItem('native-line-dark-mode'); + if (saved !== null) { + setIsDarkMode(JSON.parse(saved)); + } else { + const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches; + setIsDarkMode(prefersDark); + } + setMounted(true); + }, []); + + const toggleDarkMode = useCallback(() => { + setIsDarkMode((prevMode) => { + const newMode = !prevMode; + localStorage.setItem('native-line-dark-mode', JSON.stringify(newMode)); + return newMode; + }); + }, []); + + if (!mounted) { + return null; + } + return (
@@ -123,8 +159,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, entrepreneurs, and creators to build production-quality native apps without weeks of development or expensive engineer teams." + subdescription="We believe anyone with an idea deserves the ability to ship—fast, beautifully, and natively." 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 +171,8 @@ export default function LandingPage() {
@@ -162,7 +198,7 @@ export default function LandingPage() {
@@ -209,7 +245,7 @@ export default function LandingPage() {
@@ -253,8 +289,8 @@ export default function LandingPage() {
diff --git a/src/app/styles/variables.css b/src/app/styles/variables.css index 0af5aa1..a6505af 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: #fffbf8;;; + --foreground: #2a2520;;; + --primary-cta: #c97d5c;;; + --secondary-cta: #f5f3f0;;; + --accent: #e8ddd3;;; + --background-accent: #d4c4b0;;; */ - --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: #fffbf8;;; + --foreground: #2a2520;;; + --primary-cta: #c97d5c;;; + --primary-cta-text: #ffffff;;; + --secondary-cta: #f5f3f0;;; + --secondary-cta-text: #2a2520;;; + --accent: #e8ddd3;;; + --background-accent: #d4c4b0;;; /* text sizing - set by ThemeProvider */ /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);