299 lines
16 KiB
TypeScript
299 lines
16 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
|
|
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
|
|
import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
|
|
import ProductCardOne from "@/components/sections/product/ProductCardOne";
|
|
import TestimonialAboutCard from "@/components/sections/about/TestimonialAboutCard";
|
|
import MetricCardSeven from "@/components/sections/metrics/MetricCardSeven";
|
|
import TestimonialCardFive from "@/components/sections/testimonial/TestimonialCardFive";
|
|
import FooterCard from "@/components/sections/footer/FooterCard";
|
|
import {
|
|
BookOpen,
|
|
Brain,
|
|
Heart,
|
|
Target,
|
|
Shield,
|
|
Sparkles,
|
|
Zap,
|
|
Library,
|
|
MessageCircle,
|
|
Smile,
|
|
TrendingUp,
|
|
Star,
|
|
Twitter,
|
|
Instagram,
|
|
Linkedin,
|
|
Globe,
|
|
} from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="shift-hover"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="rounded"
|
|
contentWidth="medium"
|
|
sizing="mediumSizeLargeTitles"
|
|
background="circleGradient"
|
|
cardStyle="layered-gradient"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="light"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
brandName="IslamiqApp"
|
|
navItems={[
|
|
{ name: "Features", id: "features" },
|
|
{ name: "Islamic Tools", id: "islamic-tools" },
|
|
{ name: "Library", id: "library" },
|
|
{ name: "AI Assistant", id: "ai-assistant" },
|
|
{ name: "Wellness", id: "wellness" },
|
|
]}
|
|
button={{
|
|
text: "Download Now", href: "https://example.com/download"
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitKpi
|
|
title="The Ultimate Islamic Educational & Wellness Companion"
|
|
description="1100+ integrated features combining Islamic tools, AI-powered learning, digital library, mental wellness tracking, productivity gamification, and secure encrypted protection—all in one lightweight, offline-capable super app designed for spiritual growth and personal development."
|
|
background={{ variant: "glowing-orb" }}
|
|
kpis={[
|
|
{ value: "1100+", label: "Integrated Features" },
|
|
{ value: "Fully Encrypted", label: "Data Security" },
|
|
{ value: "<1 Second", label: "Load Time" },
|
|
]}
|
|
enableKpiAnimation={true}
|
|
tag="All-in-One Super App"
|
|
tagIcon={Sparkles}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "Download App", href: "https://example.com/download" },
|
|
{ text: "Learn More", href: "#features" },
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
imageSrc="http://img.b2bpic.net/free-vector/workout-tracker-app_23-2148639323.jpg?_wi=1"
|
|
imageAlt="IslamiqApp Dashboard"
|
|
mediaAnimation="opacity"
|
|
imagePosition="right"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureHoverPattern
|
|
title="Powerful Core Features"
|
|
description="Experience a comprehensive ecosystem designed for Islamic education, mental wellness, productivity, and secure digital life."
|
|
tag="Core Features"
|
|
tagIcon={Zap}
|
|
tagAnimation="slide-up"
|
|
features={[
|
|
{
|
|
icon: BookOpen,
|
|
title: "Smart Knowledge Library", description: "1000+ Islamic, educational, and cultural books in PDF, ePub, DOC formats with audio books, video lessons, highlighting, notes, and bookmarks."
|
|
},
|
|
{
|
|
icon: Brain,
|
|
title: "AI-Powered Ask Me Anything", description: "Intelligent assistant answering questions on religion, science, history, technology, mental health with voice support and offline access."
|
|
},
|
|
{
|
|
icon: Library,
|
|
title: "Islamic Tools Hub", description: "Advanced Tasbeeh counter, prayer time reminders, Qibla direction, daily Adhkar, Quran with translations, tafsir, and multiple recitations."
|
|
},
|
|
{
|
|
icon: Heart,
|
|
title: "Mental Wellness Companion", description: "Daily journaling, mood tracking, breathing exercises, sleep sessions, motivational quotes, and encrypted private journals."
|
|
},
|
|
{
|
|
icon: Target,
|
|
title: "Learning & Productivity System", description: "Gamified challenges, achievement tracking, task timer, focus mode, study reminders, and comprehensive progress dashboards."
|
|
},
|
|
{
|
|
icon: Shield,
|
|
title: "Kids Safe Mode", description: "Protected environment with Islamic stories, animations, educational games, safe content filtering, and parental controls."
|
|
},
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="islamic-tools" data-section="islamic-tools">
|
|
<ProductCardOne
|
|
title="Islamic Tools Hub"
|
|
description="Comprehensive Islamic utilities for daily practice, prayer, Quran study, and spiritual development."
|
|
tag="Essential Tools"
|
|
tagIcon={Library}
|
|
tagAnimation="slide-up"
|
|
products={[
|
|
{
|
|
id: "1", name: "Smart Tasbeeh Counter", price: "Multi-Profile Tracking", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-is-holding-ancient-shell-while-sitting-her-workplace_613910-17306.jpg", imageAlt: "Digital Tasbeeh Counter Interface"
|
|
},
|
|
{
|
|
id: "2", name: "Prayer Time Reminders", price: "GPS-Enabled", imageSrc: "http://img.b2bpic.net/free-psd/gradient-islamic-new-year-instagram-stories-template_23-2149427597.jpg", imageAlt: "Prayer Times Interface"
|
|
},
|
|
{
|
|
id: "3", name: "Quran & Tafsir", price: "Multiple Reciters", imageSrc: "http://img.b2bpic.net/free-vector/library-online-cocept-layout-chart-print_1284-6709.jpg?_wi=1", imageAlt: "Quran Reading Interface"
|
|
},
|
|
{
|
|
id: "4", name: "Daily Adhkar System", price: "Customizable Reminders", imageSrc: "http://img.b2bpic.net/free-vector/workout-tracker-app_23-2148639323.jpg?_wi=2", imageAlt: "Adhkar Tracking"
|
|
},
|
|
{
|
|
id: "5", name: "Qibla Direction", price: "Compass-Based", imageSrc: "http://img.b2bpic.net/free-vector/workout-tracker-app_23-2148639323.jpg?_wi=3", imageAlt: "Qibla Direction Finder"
|
|
},
|
|
]}
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="library" data-section="library">
|
|
<TestimonialAboutCard
|
|
tag="Knowledge Library"
|
|
tagIcon={BookOpen}
|
|
tagAnimation="slide-up"
|
|
title="Access 1000+ Books Instantly"
|
|
description="Comprehensive Digital Library"
|
|
subdescription="Islamic, Educational & Cultural Content"
|
|
icon={Library}
|
|
imageSrc="http://img.b2bpic.net/free-vector/library-online-cocept-layout-chart-print_1284-6709.jpg?_wi=2"
|
|
imageAlt="Digital Book Library Interface"
|
|
mediaAnimation="slide-up"
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="ai-assistant" data-section="ai-assistant">
|
|
<TestimonialAboutCard
|
|
tag="AI Intelligence"
|
|
tagIcon={Brain}
|
|
tagAnimation="slide-up"
|
|
title="Ask Anything & Get Instant Answers"
|
|
description="Multi-Domain AI Assistant"
|
|
subdescription="Religion, Science, History, Technology & Mental Health"
|
|
icon={MessageCircle}
|
|
imageSrc="http://img.b2bpic.net/free-photo/grand-parent-learning-use-digital-divice_23-2149214581.jpg?_wi=1"
|
|
imageAlt="AI Assistant Voice Interface"
|
|
mediaAnimation="opacity"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="wellness" data-section="wellness">
|
|
<TestimonialAboutCard
|
|
tag="Mental Wellness"
|
|
tagIcon={Heart}
|
|
tagAnimation="slide-up"
|
|
title="Your Personal Wellness Companion"
|
|
description="Daily Journaling & Mental Health"
|
|
subdescription="Mood Tracking, Breathing Exercises & Relaxation"
|
|
icon={Smile}
|
|
imageSrc="http://img.b2bpic.net/free-photo/positive-woman-holding-book-with-copy-space-cover_158595-5685.jpg?_wi=1"
|
|
imageAlt="Mental Wellness Dashboard"
|
|
mediaAnimation="blur-reveal"
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardSeven
|
|
title="Performance & Security Metrics"
|
|
description="Built for speed, security, and reliability at every level."
|
|
tag="Statistics"
|
|
tagIcon={TrendingUp}
|
|
tagAnimation="slide-up"
|
|
metrics={[
|
|
{
|
|
id: "1", value: "<1s", title: "Ultra-Fast Load Times", items: [
|
|
"Optimized caching system", "Minimal RAM footprint", "Battery-friendly architecture"
|
|
],
|
|
},
|
|
{
|
|
id: "2", value: "256-bit AES", title: "Military-Grade Encryption", items: [
|
|
"End-to-end data protection", "Secure cloud backup", "Privacy-first design"
|
|
],
|
|
},
|
|
{
|
|
id: "3", value: "100%", title: "Offline Capability", items: [
|
|
"Access saved content anywhere", "Sync when connected", "No internet required"
|
|
],
|
|
},
|
|
{
|
|
id: "4", value: "Multi-Device", title: "Seamless Synchronization", items: [
|
|
"Cross-device cloud sync", "Real-time updates", "Unified experience"
|
|
],
|
|
},
|
|
]}
|
|
animationType="scale-rotate"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardFive
|
|
title="Trusted by Users Worldwide"
|
|
description="Join thousands who are transforming their Islamic practice and personal wellness."
|
|
tag="Testimonials"
|
|
tagIcon={Star}
|
|
tagAnimation="slide-up"
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Fatima Al-Rashid, Islamic Scholar", date: "Date: 15 January 2025", title: "Revolutionary for Islamic Learning", quote: "IslamiqApp has transformed how I teach Islamic studies. The comprehensive Quran section with multiple translations and tafsir resources is invaluable. My students love the interactive features and the app's commitment to accuracy and authenticity.", tag: "Scholar", avatarSrc: "http://img.b2bpic.net/free-photo/smiling-millennial-man-looking-camera-cafe-headshot-portrait_1163-5163.jpg", imageSrc: "http://img.b2bpic.net/free-vector/workout-tracker-app_23-2148639323.jpg?_wi=4"
|
|
},
|
|
{
|
|
id: "2", name: "Ahmed Hassan, Tech Professional", date: "Date: 12 January 2025", title: "Perfect Balance of Features", quote: "The encryption and offline capabilities are exceptional. I can access all my Islamic content and learning materials without internet, and I trust that my personal journal and data are completely secure. The app is incredibly lightweight but feature-rich.", tag: "Professional", avatarSrc: "http://img.b2bpic.net/free-photo/smiling-millennial-man-looking-camera-cafe-headshot-portrait_1163-5163.jpg", imageSrc: "http://img.b2bpic.net/free-photo/padlock-computer-circuit-board_93675-129557.jpg"
|
|
},
|
|
{
|
|
id: "3", name: "Aisha Mohammed, Parent", date: "Date: 10 January 2025", title: "Safe & Educational for My Kids", quote: "The Kids Safe Mode is brilliant. My children enjoy Islamic stories and educational games without access to any inappropriate content. The parental controls give me complete peace of mind, and they're learning while having fun.", tag: "Parent", avatarSrc: "http://img.b2bpic.net/free-photo/outdoor-shot-young-caucasian-man-with-beard-relaxing-open-air-surrounded-by-beautiful-mountain-setting-rainforest_273609-1855.jpg", imageSrc: "http://img.b2bpic.net/free-photo/father-son-looking-smartphone-home_23-2149126673.jpg"
|
|
},
|
|
{
|
|
id: "4", name: "Omar Khalil, Mental Health Advocate", date: "Date: 8 January 2025", title: "Wellness Support Combined with Faith", quote: "The mental wellness companion feature combined with Islamic guidance is unique and powerful. The journaling system, breathing exercises, and motivational quotes based on Islamic principles have genuinely improved my mental health and spiritual practice.", tag: "Advocate", avatarSrc: "http://img.b2bpic.net/free-photo/smiling-millennial-man-looking-camera-cafe-headshot-portrait_1163-5163.jpg", imageSrc: "http://img.b2bpic.net/free-photo/positive-woman-holding-book-with-copy-space-cover_158595-5685.jpg?_wi=2"
|
|
},
|
|
{
|
|
id: "5", name: "Layla Ibrahim, Student", date: "Date: 5 January 2025", title: "AI Assistant is Like Having a Mentor", quote: "The AI assistant helped me understand complex Islamic concepts and also answered my questions about science and history. It's like having an expert mentor available 24/7. The voice-to-text feature is incredibly convenient for quick questions.", tag: "Student", avatarSrc: "http://img.b2bpic.net/free-photo/smiling-millennial-man-looking-camera-cafe-headshot-portrait_1163-5163.jpg", imageSrc: "http://img.b2bpic.net/free-photo/grand-parent-learning-use-digital-divice_23-2149214581.jpg?_wi=2"
|
|
},
|
|
{
|
|
id: "6", name: "Karim El-Sayed, Productivity Enthusiast", date: "Date: 2 January 2025", title: "Gamification Keeps Me Motivated", quote: "The gamified task system and achievement tracking has transformed my productivity. Combining daily challenges with Islamic practice goals has made staying disciplined and motivated incredibly easy. The progress dashboards are beautifully designed.", tag: "Enthusiast", avatarSrc: "http://img.b2bpic.net/free-photo/smiling-millennial-man-looking-camera-cafe-headshot-portrait_1163-5163.jpg", imageSrc: "http://img.b2bpic.net/free-vector/winning-online-game-concept_23-2148521161.jpg"
|
|
},
|
|
]}
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterCard
|
|
logoText="IslamiqApp"
|
|
copyrightText="© 2025 IslamiqApp. All rights reserved. Built with faith and technology."
|
|
socialLinks={[
|
|
{
|
|
icon: Twitter,
|
|
href: "https://twitter.com/islamiqapp", ariaLabel: "Twitter"
|
|
},
|
|
{
|
|
icon: Instagram,
|
|
href: "https://instagram.com/islamiqapp", ariaLabel: "Instagram"
|
|
},
|
|
{
|
|
icon: Linkedin,
|
|
href: "https://linkedin.com/company/islamiqapp", ariaLabel: "LinkedIn"
|
|
},
|
|
{
|
|
icon: Globe,
|
|
href: "https://islamiqapp.com", ariaLabel: "Website"
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|