Merge version_2 into main #2

Merged
bender merged 9 commits from version_2 into main 2026-03-05 20:05:08 +00:00
9 changed files with 826 additions and 53 deletions

83
src/app/history/page.tsx Normal file
View File

@@ -0,0 +1,83 @@
"use client";
import { useEffect, useState } from "react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
export default function HistoryPage() {
const [isClient, setIsClient] = useState(false);
useEffect(() => {
setIsClient(true);
}, []);
if (!isClient) {
return null;
}
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
defaultTextAnimation="background-highlight"
borderRadius="soft"
contentWidth="compact"
sizing="large"
background="none"
cardStyle="glass-depth"
primaryButtonStyle="double-inset"
secondaryButtonStyle="radial-glow"
headingFontWeight="bold"
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{ name: "Home", id: "/" },
{ name: "Map", id: "/map" },
{ name: "Profile", id: "/profile" },
{ name: "Settings", id: "/settings" },
]}
brandName="ParkSpot"
bottomLeftText="Parking History"
bottomRightText="support@parkspot.app"
/>
</div>
<main className="min-h-screen bg-background text-foreground flex flex-col items-center justify-center p-4">
<div className="w-full max-w-4xl">
<h1 className="text-4xl font-bold mb-4">Parking History</h1>
<p className="text-lg mb-8">View all your saved parking locations and history.</p>
<div className="w-full bg-card rounded-lg border border-accent p-6">
<div className="text-center">
<p className="text-foreground/60">Parking history list will display:</p>
<ul className="mt-4 text-left text-sm text-foreground/60">
<li> All saved parking locations</li>
<li> Photos attached to each spot</li>
<li> Notes and arrival times</li>
<li> Duration of stay</li>
<li> Search and filter functionality</li>
<li> Quick access to navigate back</li>
<li> Edit or delete saved locations</li>
<li> Export or share parking history</li>
</ul>
</div>
</div>
</div>
</main>
<div id="contact" data-section="contact">
<FooterLogoReveal
logoText="ParkSpot"
leftLink={{
text: "Privacy Policy", href: "/privacy"
}}
rightLink={{
text: "Terms of Service", href: "/terms"
}}
ariaLabel="Site footer"
/>
</div>
</ThemeProvider>
);
}

View File

@@ -14,13 +14,16 @@ const inter = Inter({
});
export const metadata: Metadata = {
title: "ParkSpot - Never Lose Your Car Again", description: "Save your exact parking spot with one tap and navigate back instantly via Google Maps. Manage multiple locations effortlessly.", keywords: "parking app, location tracker, GPS parking, find my car, urban commuting", metadataBase: new URL("https://parkspot.app"),
title: "ParkSpot - Mobile Parking Location Tracker", description: "Mobile-first parking app with interactive map, login/registration, photo notes, reminders, and Google Maps navigation. Save multiple parking spots with browser-based data persistence.", keywords: "parking app, location tracker, GPS parking, find my car, urban commuting, mobile app", metadataBase: new URL("https://parkspot.app"),
alternates: {
canonical: "https://parkspot.app"},
canonical: "https://parkspot.app"
},
openGraph: {
title: "ParkSpot - Parking Location Tracker App", description: "Save parking locations instantly and find your car with live navigation. Perfect for urban commuters and busy drivers.", url: "https://parkspot.app", siteName: "ParkSpot", type: "website"},
title: "ParkSpot - Mobile Parking Location Tracker", description: "Save parking locations instantly and find your car with live navigation. Features include photos, notes, arrival time, reminders, and sharing.", url: "https://parkspot.app", siteName: "ParkSpot", type: "website"
},
twitter: {
card: "summary_large_image", title: "Never Lose Your Car Again with ParkSpot", description: "One-tap parking location saving with instant Google Maps navigation"},
card: "summary_large_image", title: "Never Lose Your Car Again with ParkSpot", description: "One-tap parking location saving with instant Google Maps navigation"
},
robots: {
index: true,
follow: true,

115
src/app/login/page.tsx Normal file
View File

@@ -0,0 +1,115 @@
"use client";
import { useEffect, useState } from "react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
export default function LoginPage() {
const [isClient, setIsClient] = useState(false);
useEffect(() => {
setIsClient(true);
}, []);
if (!isClient) {
return null;
}
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
defaultTextAnimation="background-highlight"
borderRadius="soft"
contentWidth="compact"
sizing="large"
background="none"
cardStyle="glass-depth"
primaryButtonStyle="double-inset"
secondaryButtonStyle="radial-glow"
headingFontWeight="bold"
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{ name: "Home", id: "/" },
{ name: "Map", id: "/map" },
{ name: "History", id: "/history" },
{ name: "Profile", id: "/profile" },
]}
brandName="ParkSpot"
bottomLeftText="Secure Login"
bottomRightText="support@parkspot.app"
/>
</div>
<main className="min-h-screen bg-background text-foreground flex flex-col items-center justify-center p-4">
<div className="w-full max-w-md">
<h1 className="text-4xl font-bold mb-2 text-center">Welcome Back</h1>
<p className="text-lg text-foreground/60 text-center mb-8">Sign in to your ParkSpot account</p>
<div className="w-full bg-card rounded-lg border border-accent p-8 space-y-6">
<div>
<label className="block text-sm font-medium mb-2">Email Address</label>
<input
type="email"
placeholder="your@email.com"
className="w-full px-4 py-2 bg-background border border-accent rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-cta"
/>
</div>
<div>
<label className="block text-sm font-medium mb-2">Password</label>
<input
type="password"
placeholder="••••••••"
className="w-full px-4 py-2 bg-background border border-accent rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-cta"
/>
</div>
<div className="flex items-center justify-between text-sm">
<label className="flex items-center">
<input type="checkbox" className="mr-2" />
<span>Remember me</span>
</label>
<a href="#" className="text-primary-cta hover:underline">Forgot password?</a>
</div>
<button className="w-full bg-primary-cta text-primary-cta-text py-2 rounded-lg font-semibold hover:opacity-90 transition">
Sign In
</button>
<div className="text-center text-sm text-foreground/60">
Don't have an account? <a href="#" className="text-primary-cta hover:underline">Sign up here</a>
</div>
</div>
<div className="mt-8 p-4 bg-card rounded-lg border border-accent text-center text-sm text-foreground/60">
<p className="mb-2">Login & Registration Features:</p>
<ul className="text-left space-y-1">
<li> Secure authentication system</li>
<li> Email verification</li>
<li> Password reset functionality</li>
<li> Two-factor authentication</li>
<li> Session management</li>
<li> Profile synchronization</li>
</ul>
</div>
</div>
</main>
<div id="contact" data-section="contact">
<FooterLogoReveal
logoText="ParkSpot"
leftLink={{
text: "Privacy Policy", href: "/privacy"
}}
rightLink={{
text: "Terms of Service", href: "/terms"
}}
ariaLabel="Site footer"
/>
</div>
</ThemeProvider>
);
}

84
src/app/map/page.tsx Normal file
View File

@@ -0,0 +1,84 @@
"use client";
import { useEffect, useState } from "react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
export default function MapPage() {
const [isClient, setIsClient] = useState(false);
useEffect(() => {
setIsClient(true);
}, []);
if (!isClient) {
return null;
}
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
defaultTextAnimation="background-highlight"
borderRadius="soft"
contentWidth="compact"
sizing="large"
background="none"
cardStyle="glass-depth"
primaryButtonStyle="double-inset"
secondaryButtonStyle="radial-glow"
headingFontWeight="bold"
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{ name: "Home", id: "/" },
{ name: "History", id: "/history" },
{ name: "Profile", id: "/profile" },
{ name: "Settings", id: "/settings" },
]}
brandName="ParkSpot"
bottomLeftText="Interactive Map"
bottomRightText="support@parkspot.app"
/>
</div>
<main className="min-h-screen bg-background text-foreground flex flex-col items-center justify-center p-4">
<div className="w-full max-w-4xl">
<h1 className="text-4xl font-bold mb-4">Interactive Parking Map</h1>
<p className="text-lg mb-8">Tap on the map to save your parking location. Add photos, notes, and set reminders.</p>
<div className="w-full h-96 bg-card rounded-lg border border-accent flex items-center justify-center">
<div className="text-center">
<p className="text-foreground/60">Map component will be integrated here with:</p>
<ul className="mt-4 text-left text-sm text-foreground/60">
<li> Interactive map with parking pins</li>
<li> One-tap location saving</li>
<li> Photo capture and storage</li>
<li> Note-taking capability</li>
<li> Arrival time tracking</li>
<li> Smart reminders</li>
<li> Google Maps navigation integration</li>
<li> Location sharing with friends</li>
<li> Browser-based data persistence</li>
</ul>
</div>
</div>
</div>
</main>
<div id="contact" data-section="contact">
<FooterLogoReveal
logoText="ParkSpot"
leftLink={{
text: "Privacy Policy", href: "/privacy"
}}
rightLink={{
text: "Terms of Service", href: "/terms"
}}
ariaLabel="Site footer"
/>
</div>
</ThemeProvider>
);
}

View File

@@ -9,7 +9,7 @@ import MediaAbout from "@/components/sections/about/MediaAbout";
import TestimonialCardFive from "@/components/sections/testimonial/TestimonialCardFive";
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import { MapPin, Zap, CheckCircle, Lightbulb, Users, Map, Navigation } from "lucide-react";
import { MapPin, Zap, CheckCircle, Lightbulb, Users, Map, Navigation, Lock, MapPinPlus, Clock, Share2 } from "lucide-react";
export default function ParkSpotPage() {
return (
@@ -28,28 +28,27 @@ export default function ParkSpotPage() {
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{ name: "Features", id: "features" },
{ name: "How It Works", id: "how-it-works" },
{ name: "Testimonials", id: "testimonials" },
{ name: "Download", id: "cta" },
{ name: "Contact", id: "contact" },
{ name: "Map", id: "/map" },
{ name: "History", id: "/history" },
{ name: "Profile", id: "/profile" },
{ name: "Settings", id: "/settings" },
]}
brandName="ParkSpot"
bottomLeftText="Location-based parking made simple"
bottomLeftText="Mobile-First Parking Tracker"
bottomRightText="support@parkspot.app"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardTestimonial
title="Never lose your car again"
description="Save your exact parking spot in one tap. Find it instantly with live navigation whenever you need it."
tag="Location-Based Parking"
title="Never Lose Your Car Again"
description="Mobile-first app to save parking spots with photos, notes, arrival time, and instant Google Maps navigation. Share locations with friends."
tag="Mobile Parking Tracker"
tagIcon={MapPin}
tagAnimation="slide-up"
buttons={[
{ text: "Save Parking Location", href: "#features" },
{ text: "Learn More", href: "#how-it-works" },
{ text: "Login / Register", href: "/login" },
{ text: "Learn More", href: "#features" },
]}
buttonAnimation="slide-up"
imageSrc="http://img.b2bpic.net/free-vector/parking-service-mobile-map_24908-60887.jpg?_wi=1"
@@ -58,88 +57,96 @@ export default function ParkSpotPage() {
background={{ variant: "glowing-orb" }}
testimonials={[
{
name: "Sarah Johnson", handle: "Urban Commuter", testimonial: "I used to spend 15 minutes searching for my car every day. Now I find it in seconds!", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=1"},
name: "Sarah Johnson", handle: "Urban Commuter", testimonial: "I used to spend 15 minutes searching for my car every day. Now I find it in seconds with browser data saving!", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=1"
},
{
name: "Michael Chen", handle: "City Center Worker", testimonial: "Managing multiple parking spots across the city is now effortless. Highly recommended!", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=2"},
name: "Michael Chen", handle: "City Center Worker", testimonial: "Managing multiple parking spots across the city is now effortless. The photo notes feature is amazing!", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=2"
},
{
name: "Emma Rodriguez", handle: "Frequent Traveler", testimonial: "The navigation feature is seamless. Google Maps integration works perfectly.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=3"},
name: "Emma Rodriguez", handle: "Frequent Traveler", testimonial: "The reminders feature ensures I never forget about parking. Google Maps integration works perfectly.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=3"
},
{
name: "David Kim", handle: "Business Professional", testimonial: "Best parking app I've used. Simple, reliable, and exactly what I needed.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=4"},
name: "David Kim", handle: "Business Professional", testimonial: "Best parking app I've used. Simple, reliable, with all the features I need for urban commuting.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=4"
},
]}
testimonialRotationInterval={5000}
useInvertedBackground={false}
ariaLabel="Hero section with parking tracker overview and customer testimonials"
ariaLabel="Hero section with mobile parking tracker overview and customer testimonials"
/>
</div>
<div id="features" data-section="features">
<FeatureCardTwentyFour
title="Core Features"
description="Everything you need to manage your parking locations efficiently and never waste time searching for your car again."
description="Everything you need to manage parking locations efficiently with mobile-first design and browser-based data persistence."
tag="Features"
tagIcon={Zap}
tagAnimation="slide-up"
features={[
{
id: "1", title: "One-Tap Location Saving", author: "Instant Capture", description: "Save your exact parking spot with just one tap on the interactive map. Your location is pinned immediately and stored for quick access.", tags: ["Quick Save", "GPS Accurate"],
imageSrc: "http://img.b2bpic.net/free-photo/young-person-using-sustainable-mobility_23-2149290964.jpg?_wi=1", imageAlt: "One-tap location saving feature"},
id: "1", title: "Interactive Map with Pin", author: "Visual Location", description: "Save parking spots directly on an interactive map. Tap to pin your location, add photos and detailed notes for reference.", tags: ["Map View", "GPS Accurate"],
imageSrc: "http://img.b2bpic.net/free-photo/young-person-using-sustainable-mobility_23-2149290964.jpg?_wi=1", imageAlt: "Interactive map with parking pin"
},
{
id: "2", title: "Multi-Location Management", author: "Full Control", description: "Save and organize multiple parking locations across different areas. Delete old spots and keep your list clean and manageable.", tags: ["Multiple Spots", "Organization"],
imageSrc: "http://img.b2bpic.net/free-vector/public-transport-app-interface_23-2148690779.jpg?_wi=1", imageAlt: "Multiple parking locations on map"},
id: "2", title: "Login & User Profiles", author: "Secure Access", description: "Secure login/registration system. Manage your profile, view parking history, and customize app settings for your needs.", tags: ["Authentication", "User Profiles"],
imageSrc: "http://img.b2bpic.net/free-vector/public-transport-app-interface_23-2148690779.jpg?_wi=1", imageAlt: "User authentication interface"
},
{
id: "3", title: "Live Navigation", author: "Direct Route", description: "Get real-time turn-by-turn navigation directly to your saved parking spot using integrated Google Maps. See exact directions instantly.", tags: ["Google Maps", "Navigation"],
imageSrc: "http://img.b2bpic.net/free-vector/collection-modern-arrows_23-2147976916.jpg?_wi=1", imageAlt: "Live navigation to parking spot"},
id: "3", title: "Photos, Notes & Arrival Time", author: "Rich Details", description: "Attach photos of your parking spot, add detailed notes, and log arrival time. Get smart reminders before time runs out.", tags: ["Photos", "Notes", "Reminders"],
imageSrc: "http://img.b2bpic.net/free-vector/collection-modern-arrows_23-2147976916.jpg?_wi=1", imageAlt: "Photo notes and arrival tracking"
},
]}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
ariaLabel="Core parking tracker features"
ariaLabel="Core mobile parking tracker features"
/>
</div>
<div id="how-it-works" data-section="how-it-works">
<MetricCardThree
title="How It Works"
description="Three simple steps to never lose your car again. Our intuitive process takes seconds to master."
description="Four simple steps to never lose your car again. Mobile-first design that works seamlessly on any device."
tag="Simple Process"
tagIcon={CheckCircle}
tagAnimation="slide-up"
metrics={[
{ id: "1", icon: MapPin, title: "Tap to Save", value: "1 Tap" },
{ id: "2", icon: Map, title: "View on Map", value: "Instant" },
{ id: "3", icon: Navigation, title: "Navigate Back", value: "Go Button" },
{ id: "1", icon: Lock, title: "Login/Register", value: "Secure" },
{ id: "2", icon: MapPinPlus, title: "Pin Location", value: "1 Tap" },
{ id: "3", icon: Clock, title: "Add Details", value: "Photos" },
{ id: "4", icon: Navigation, title: "Navigate Back", value: "Maps" },
]}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
ariaLabel="How parking tracker works"
ariaLabel="How mobile parking tracker works"
/>
</div>
<div id="benefits" data-section="benefits">
<MediaAbout
title="Why Urban Drivers Choose ParkSpot"
description="Reduce stress and save time with a parking solution built for busy city life. Our app addresses the pain points that matter most to you."
title="Why Choose ParkSpot"
description="Mobile-first parking solution with browser-based data persistence, intelligent reminders, and seamless sharing. Never stress about parking again."
tag="Benefits"
tagIcon={Lightbulb}
tagAnimation="slide-up"
buttons={[{ text: "Download App", href: "#cta" }]}
buttons={[{ text: "Start Free", href: "/login" }]}
buttonAnimation="slide-up"
imageSrc="http://img.b2bpic.net/free-photo/creative-business-people-listening-colleague_58466-11715.jpg?_wi=1"
imageAlt="Team collaboration on parking solution"
useInvertedBackground={true}
ariaLabel="Benefits of using ParkSpot parking tracker"
ariaLabel="Benefits of using ParkSpot mobile parking app"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardFive
title="What Our Users Say"
description="Real stories from urban commuters who've transformed their parking experience with ParkSpot."
description="Real stories from urban commuters who've transformed their parking experience with ParkSpot's mobile-first design."
tag="Testimonials"
tagIcon={Users}
tagAnimation="slide-up"
@@ -147,26 +154,32 @@ export default function ParkSpotPage() {
useInvertedBackground={false}
testimonials={[
{
id: "1", name: "Sarah Johnson, Urban Commuter", date: "Date: 15 November 2024", title: "No More Parking Anxiety", quote: "I used to waste 15 minutes every day searching for my car. Now I find it in seconds. The app is intuitive and the Google Maps integration is seamless.", tag: "Daily User", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/young-person-using-sustainable-mobility_23-2149290964.jpg?_wi=2", imageAlt: "Happy commuter using parking app"},
id: "1", name: "Sarah Johnson, Urban Commuter", date: "Date: 15 November 2024", title: "No More Parking Anxiety", quote: "I used to waste 15 minutes every day searching for my car. Now I find it in seconds with photos saved on my phone.", tag: "Daily User", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/young-person-using-sustainable-mobility_23-2149290964.jpg?_wi=2", imageAlt: "Happy commuter using parking app"
},
{
id: "2", name: "Michael Chen, City Center Worker", date: "Date: 18 November 2024", title: "Manages Multiple Spots Easily", quote: "Managing parking across different areas of the city is now effortless. I can save multiple locations and switch between them instantly. Best decision ever!", tag: "Multi-Location", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-vector/public-transport-app-interface_23-2148690779.jpg?_wi=2", imageAlt: "Multiple parking locations organized"},
id: "2", name: "Michael Chen, City Center Worker", date: "Date: 18 November 2024", title: "Manages Multiple Spots Easily", quote: "Managing parking across different areas of the city is now effortless. Browser persistence means my data is always available.", tag: "Multi-Location", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-vector/public-transport-app-interface_23-2148690779.jpg?_wi=2", imageAlt: "Multiple parking locations organized"
},
{
id: "3", name: "Emma Rodriguez, Frequent Traveler", date: "Date: 12 November 2024", title: "Perfect for Travelers", quote: "Traveling to new cities and remembering where I parked used to be stressful. This app solved that problem completely. The navigation feature works flawlessly.", tag: "Traveler", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-vector/collection-modern-arrows_23-2147976916.jpg?_wi=2", imageAlt: "Seamless navigation experience"},
id: "3", name: "Emma Rodriguez, Frequent Traveler", date: "Date: 12 November 2024", title: "Perfect for Travelers", quote: "Traveling to new cities and remembering where I parked is now stress-free. The sharing feature lets me show friends where to meet me.", tag: "Traveler", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-vector/collection-modern-arrows_23-2147976916.jpg?_wi=2", imageAlt: "Seamless navigation experience"
},
{
id: "4", name: "David Kim, Business Professional", date: "Date: 22 November 2024", title: "Essential Business Tool", quote: "As someone who parks in different locations throughout the day, this app is invaluable. It's reliable, fast, and exactly what I needed for my busy schedule.", tag: "Professional", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/creative-business-people-listening-colleague_58466-11715.jpg?_wi=2", imageAlt: "Business professional using app"},
id: "4", name: "David Kim, Business Professional", date: "Date: 22 November 2024", title: "Essential Business Tool", quote: "As someone who parks in different locations throughout the day, the reminders feature keeps me on track. Invaluable for my schedule.", tag: "Professional", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/creative-business-people-listening-colleague_58466-11715.jpg?_wi=2", imageAlt: "Business professional using app"
},
{
id: "5", name: "Jessica Lee, Downtown Shopper", date: "Date: 25 November 2024", title: "Shopping Made Simple", quote: "No more panic when I return to the parking lot with my hands full of bags. I immediately know where my car is. Highly recommend to all city dwellers!", tag: "Shopper", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/young-person-using-sustainable-mobility_23-2149290964.jpg?_wi=3", imageAlt: "Satisfied customer using app"},
id: "5", name: "Jessica Lee, Downtown Shopper", date: "Date: 25 November 2024", title: "Shopping Made Simple", quote: "No more panic when I return to the parking lot with bags. My data is secure in the browser, always available. Highly recommend!", tag: "Shopper", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/young-person-using-sustainable-mobility_23-2149290964.jpg?_wi=3", imageAlt: "Satisfied customer using app"
},
{
id: "6", name: "Robert Martinez, Frequent Driver", date: "Date: 28 November 2024", title: "Game-Changing App", quote: "Five stars isn't enough. This app has changed how I approach parking in the city. Simple, effective, and it works every time. Worth every penny!", tag: "5-Star Review", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-vector/public-transport-app-interface_23-2148690779.jpg?_wi=3", imageAlt: "Enthusiastic user testimonial"},
id: "6", name: "Robert Martinez, Frequent Driver", date: "Date: 28 November 2024", title: "Game-Changing App", quote: "This app has changed how I approach parking in the city. Simple, effective, secure data storage, and it works every time!", tag: "5-Star Review", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-vector/public-transport-app-interface_23-2148690779.jpg?_wi=3", imageAlt: "Enthusiastic user testimonial"
},
]}
ariaLabel="Customer testimonials for parking tracker app"
ariaLabel="Customer testimonials for mobile parking tracker app"
/>
</div>
<div id="cta" data-section="cta">
<ContactSplitForm
title="Download ParkSpot Now"
description="Get instant access to worry-free parking. Available on iOS and Android with a one-tap location saving feature that works everywhere."
description="Get instant access to mobile-first parking management. Available on iOS and Android with full feature support including photos, notes, reminders, and sharing."
inputs={[
{
name: "email", type: "email", placeholder: "Enter your email", required: true,
@@ -193,9 +206,11 @@ export default function ParkSpotPage() {
<FooterLogoReveal
logoText="ParkSpot"
leftLink={{
text: "Privacy Policy", href: "#"}}
text: "Privacy Policy", href: "/privacy"
}}
rightLink={{
text: "Terms of Service", href: "#"}}
text: "Terms of Service", href: "/terms"
}}
ariaLabel="Site footer"
/>
</div>

114
src/app/privacy/page.tsx Normal file
View File

@@ -0,0 +1,114 @@
"use client";
import { useEffect, useState } from "react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
export default function PrivacyPage() {
const [isClient, setIsClient] = useState(false);
useEffect(() => {
setIsClient(true);
}, []);
if (!isClient) {
return null;
}
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
defaultTextAnimation="background-highlight"
borderRadius="soft"
contentWidth="compact"
sizing="large"
background="none"
cardStyle="glass-depth"
primaryButtonStyle="double-inset"
secondaryButtonStyle="radial-glow"
headingFontWeight="bold"
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{ name: "Home", id: "/" },
{ name: "Map", id: "/map" },
{ name: "History", id: "/history" },
{ name: "Profile", id: "/profile" },
]}
brandName="ParkSpot"
bottomLeftText="Privacy Policy"
bottomRightText="support@parkspot.app"
/>
</div>
<main className="min-h-screen bg-background text-foreground flex flex-col items-center justify-start p-4 pt-24">
<div className="w-full max-w-2xl">
<h1 className="text-4xl font-bold mb-2">Privacy Policy</h1>
<p className="text-sm text-foreground/60 mb-8">Last updated: January 2025</p>
<div className="space-y-8">
<section>
<h2 className="text-2xl font-semibold mb-3">1. Introduction</h2>
<p className="text-foreground/80 leading-relaxed">ParkSpot ("we", "us", "our", or "Company") operates the ParkSpot mobile application ("Service"). This page informs you of our policies regarding the collection, use, and disclosure of personal data when you use our Service and the choices you have associated with that data.</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-3">2. Information Collection and Use</h2>
<p className="text-foreground/80 leading-relaxed mb-3">We collect several different types of information for various purposes to provide and improve our Service to you.</p>
<ul className="space-y-2 text-foreground/80">
<li><strong>Personal Data:</strong> While using our Service, we may ask you to provide us with certain personally identifiable information including but not limited to email address, name, phone number, and profile information.</li>
<li><strong>Location Data:</strong> We collect precise location information through your mobile device's GPS when you save parking locations.</li>
<li><strong>Photo Data:</strong> Photos you attach to parking locations are stored in our secure database.</li>
<li><strong>Usage Data:</strong> We automatically collect information about your interactions with our Service including access times, features used, and general usage patterns.</li>
</ul>
</section>
<section>
<h2 className="text-2xl font-semibold mb-3">3. Use of Data</h2>
<p className="text-foreground/80 leading-relaxed mb-3">ParkSpot uses the collected data for various purposes:</p>
<ul className="space-y-2 text-foreground/80">
<li>To provide and maintain our Service</li>
<li>To notify you about changes to our Service</li>
<li>To send administrative information and updates</li>
<li>To enable you to participate in interactive features</li>
<li>To gather analysis or valuable information for service improvement</li>
<li>To monitor the usage of our Service</li>
<li>To detect, prevent, and address technical and security issues</li>
</ul>
</section>
<section>
<h2 className="text-2xl font-semibold mb-3">4. Data Security</h2>
<p className="text-foreground/80 leading-relaxed">The security of your data is important to us but remember that no method of transmission over the Internet or method of electronic storage is 100% secure. We implement industry-standard encryption and security measures to protect your personal information, including browser-based local storage of parking data with optional cloud backup.</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-3">5. Changes to This Privacy Policy</h2>
<p className="text-foreground/80 leading-relaxed">We may update our Privacy Policy from time to time. We will notify you of any changes by posting the new Privacy Policy on this page and updating the "Last updated" date at the top.</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-3">6. Contact Us</h2>
<p className="text-foreground/80 leading-relaxed">If you have any questions about this Privacy Policy, please contact us at privacy@parkspot.app</p>
</section>
</div>
</div>
</main>
<div id="contact" data-section="contact" className="mt-12">
<FooterLogoReveal
logoText="ParkSpot"
leftLink={{
text: "Privacy Policy", href: "/privacy"
}}
rightLink={{
text: "Terms of Service", href: "/terms"
}}
ariaLabel="Site footer"
/>
</div>
</ThemeProvider>
);
}

105
src/app/profile/page.tsx Normal file
View File

@@ -0,0 +1,105 @@
"use client";
import { useEffect, useState } from "react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
export default function ProfilePage() {
const [isClient, setIsClient] = useState(false);
useEffect(() => {
setIsClient(true);
}, []);
if (!isClient) {
return null;
}
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
defaultTextAnimation="background-highlight"
borderRadius="soft"
contentWidth="compact"
sizing="large"
background="none"
cardStyle="glass-depth"
primaryButtonStyle="double-inset"
secondaryButtonStyle="radial-glow"
headingFontWeight="bold"
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{ name: "Home", id: "/" },
{ name: "Map", id: "/map" },
{ name: "History", id: "/history" },
{ name: "Settings", id: "/settings" },
]}
brandName="ParkSpot"
bottomLeftText="User Profile"
bottomRightText="support@parkspot.app"
/>
</div>
<main className="min-h-screen bg-background text-foreground flex flex-col items-center justify-center p-4">
<div className="w-full max-w-4xl">
<h1 className="text-4xl font-bold mb-4">User Profile</h1>
<p className="text-lg mb-8">Manage your account and preferences.</p>
<div className="w-full bg-card rounded-lg border border-accent p-6 space-y-6">
<div className="border-b border-accent pb-6">
<h2 className="text-2xl font-semibold mb-4">Account Information</h2>
<p className="text-foreground/60">Profile management will include:</p>
<ul className="mt-4 text-left text-sm text-foreground/60">
<li> User avatar and profile picture</li>
<li> Name and email address</li>
<li> Phone number</li>
<li> Account creation date</li>
<li> Account verification status</li>
</ul>
</div>
<div className="border-b border-accent pb-6">
<h2 className="text-2xl font-semibold mb-4">Preferences</h2>
<p className="text-foreground/60">Customize your experience:</p>
<ul className="mt-4 text-left text-sm text-foreground/60">
<li> Notification preferences</li>
<li> Reminder settings</li>
<li> Privacy settings</li>
<li> Language and locale</li>
<li> Theme preferences (light/dark mode)</li>
</ul>
</div>
<div>
<h2 className="text-2xl font-semibold mb-4">Account Actions</h2>
<p className="text-foreground/60">Manage your account:</p>
<ul className="mt-4 text-left text-sm text-foreground/60">
<li> Change password</li>
<li> Two-factor authentication</li>
<li> Download account data</li>
<li> Delete account</li>
<li> Logout</li>
</ul>
</div>
</div>
</div>
</main>
<div id="contact" data-section="contact">
<FooterLogoReveal
logoText="ParkSpot"
leftLink={{
text: "Privacy Policy", href: "/privacy"
}}
rightLink={{
text: "Terms of Service", href: "/terms"
}}
ariaLabel="Site footer"
/>
</div>
</ThemeProvider>
);
}

127
src/app/settings/page.tsx Normal file
View File

@@ -0,0 +1,127 @@
"use client";
import { useEffect, useState } from "react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
export default function SettingsPage() {
const [isClient, setIsClient] = useState(false);
useEffect(() => {
setIsClient(true);
}, []);
if (!isClient) {
return null;
}
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
defaultTextAnimation="background-highlight"
borderRadius="soft"
contentWidth="compact"
sizing="large"
background="none"
cardStyle="glass-depth"
primaryButtonStyle="double-inset"
secondaryButtonStyle="radial-glow"
headingFontWeight="bold"
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{ name: "Home", id: "/" },
{ name: "Map", id: "/map" },
{ name: "History", id: "/history" },
{ name: "Profile", id: "/profile" },
]}
brandName="ParkSpot"
bottomLeftText="App Settings"
bottomRightText="support@parkspot.app"
/>
</div>
<main className="min-h-screen bg-background text-foreground flex flex-col items-center justify-center p-4">
<div className="w-full max-w-4xl">
<h1 className="text-4xl font-bold mb-4">App Settings</h1>
<p className="text-lg mb-8">Configure your ParkSpot experience.</p>
<div className="w-full bg-card rounded-lg border border-accent p-6 space-y-6">
<div className="border-b border-accent pb-6">
<h2 className="text-2xl font-semibold mb-4">Notifications & Reminders</h2>
<p className="text-foreground/60">Control your alerts:</p>
<ul className="mt-4 text-left text-sm text-foreground/60">
<li> Enable/disable push notifications</li>
<li> Reminder frequency settings</li>
<li> Notification sound preferences</li>
<li> Silent hours configuration</li>
</ul>
</div>
<div className="border-b border-accent pb-6">
<h2 className="text-2xl font-semibold mb-4">Data & Privacy</h2>
<p className="text-foreground/60">Manage your data:</p>
<ul className="mt-4 text-left text-sm text-foreground/60">
<li> Browser-based data persistence options</li>
<li> Cloud backup settings</li>
<li> Privacy mode</li>
<li> Location history retention</li>
<li> Data export options</li>
</ul>
</div>
<div className="border-b border-accent pb-6">
<h2 className="text-2xl font-semibold mb-4">Display & Performance</h2>
<p className="text-foreground/60">Customize your interface:</p>
<ul className="mt-4 text-left text-sm text-foreground/60">
<li> Light/dark mode toggle</li>
<li> Language selection</li>
<li> Map display options</li>
<li> Cache management</li>
</ul>
</div>
<div className="border-b border-accent pb-6">
<h2 className="text-2xl font-semibold mb-4">Integration Settings</h2>
<p className="text-foreground/60">Connect with other services:</p>
<ul className="mt-4 text-left text-sm text-foreground/60">
<li> Google Maps API configuration</li>
<li> Camera and photo permissions</li>
<li> GPS accuracy settings</li>
<li> Sharing preferences</li>
</ul>
</div>
<div>
<h2 className="text-2xl font-semibold mb-4">About & Support</h2>
<p className="text-foreground/60">App information:</p>
<ul className="mt-4 text-left text-sm text-foreground/60">
<li> App version and build number</li>
<li> Check for updates</li>
<li> Contact support</li>
<li> View privacy policy</li>
<li> View terms of service</li>
<li> License information</li>
</ul>
</div>
</div>
</div>
</main>
<div id="contact" data-section="contact">
<FooterLogoReveal
logoText="ParkSpot"
leftLink={{
text: "Privacy Policy", href: "/privacy"
}}
rightLink={{
text: "Terms of Service", href: "/terms"
}}
ariaLabel="Site footer"
/>
</div>
</ThemeProvider>
);
}

127
src/app/terms/page.tsx Normal file
View File

@@ -0,0 +1,127 @@
"use client";
import { useEffect, useState } from "react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
export default function TermsPage() {
const [isClient, setIsClient] = useState(false);
useEffect(() => {
setIsClient(true);
}, []);
if (!isClient) {
return null;
}
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
defaultTextAnimation="background-highlight"
borderRadius="soft"
contentWidth="compact"
sizing="large"
background="none"
cardStyle="glass-depth"
primaryButtonStyle="double-inset"
secondaryButtonStyle="radial-glow"
headingFontWeight="bold"
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{ name: "Home", id: "/" },
{ name: "Map", id: "/map" },
{ name: "History", id: "/history" },
{ name: "Profile", id: "/profile" },
]}
brandName="ParkSpot"
bottomLeftText="Terms of Service"
bottomRightText="support@parkspot.app"
/>
</div>
<main className="min-h-screen bg-background text-foreground flex flex-col items-center justify-start p-4 pt-24">
<div className="w-full max-w-2xl">
<h1 className="text-4xl font-bold mb-2">Terms of Service</h1>
<p className="text-sm text-foreground/60 mb-8">Last updated: January 2025</p>
<div className="space-y-8">
<section>
<h2 className="text-2xl font-semibold mb-3">1. Acceptance of Terms</h2>
<p className="text-foreground/80 leading-relaxed">By accessing and using the ParkSpot mobile application ("Service"), you accept and agree to be bound by the terms and provision of this agreement. If you do not agree to abide by the above, please do not use this service.</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-3">2. Use License</h2>
<p className="text-foreground/80 leading-relaxed mb-3">Permission is granted to temporarily download one copy of the materials (information or software) on ParkSpot's Service for personal, non-commercial transitory viewing only. This is the grant of a license, not a transfer of title, and under this license you may not:</p>
<ul className="space-y-2 text-foreground/80">
<li>Modifying or copying the materials</li>
<li>Using the materials for any commercial purpose or for any public display</li>
<li>Attempting to decompile or reverse engineer any software contained on the Service</li>
<li>Removing any copyright or other proprietary notations from the materials</li>
<li>Transferring the materials to another person or "mirroring" the materials on any other server</li>
</ul>
</section>
<section>
<h2 className="text-2xl font-semibold mb-3">3. User Accounts</h2>
<p className="text-foreground/80 leading-relaxed mb-3">When you create an account on our Service, you must provide information that is accurate, complete, and current at all times. You are responsible for safeguarding the password and for all activities that occur under your account.</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-3">4. Limitation of Liability</h2>
<p className="text-foreground/80 leading-relaxed">In no event shall ParkSpot or its suppliers be liable for any damages (including, without limitation, damages for loss of data or profit, or due to business interruption) arising out of the use or inability to use the materials on ParkSpot's Service.</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-3">5. Accuracy of Materials</h2>
<p className="text-foreground/80 leading-relaxed">The materials appearing on ParkSpot's Service could include technical, typographical, or photographic errors. ParkSpot does not warrant that any of the materials on the Service are accurate, complete, or current.</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-3">6. Modifications</h2>
<p className="text-foreground/80 leading-relaxed">ParkSpot may revise these terms of service for the Service at any time without notice. By using this Service, you are agreeing to be bound by the then current version of these terms of service.</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-3">7. Data Persistence and Storage</h2>
<p className="text-foreground/80 leading-relaxed mb-3">ParkSpot uses browser-based data persistence to store your parking locations, photos, notes, and arrival times. You understand and agree that:</p>
<ul className="space-y-2 text-foreground/80">
<li>Your data is stored locally on your device and synced to secure cloud servers</li>
<li>You are responsible for maintaining backups of your data</li>
<li>We implement reasonable security measures to protect your data</li>
<li>Data retention and deletion policies are outlined in our Privacy Policy</li>
</ul>
</section>
<section>
<h2 className="text-2xl font-semibold mb-3">8. Location Services</h2>
<p className="text-foreground/80 leading-relaxed">ParkSpot collects and uses GPS location data to provide parking tracking services. You consent to the collection and use of location data as described in our Privacy Policy.</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-3">9. Contact Information</h2>
<p className="text-foreground/80 leading-relaxed">If you have any questions about these Terms of Service, please contact us at support@parkspot.app</p>
</section>
</div>
</div>
</main>
<div id="contact" data-section="contact" className="mt-12">
<FooterLogoReveal
logoText="ParkSpot"
leftLink={{
text: "Privacy Policy", href: "/privacy"
}}
rightLink={{
text: "Terms of Service", href: "/terms"
}}
ariaLabel="Site footer"
/>
</div>
</ThemeProvider>
);
}