Compare commits

...
Author SHA1 Message Date
nmemmert e236609e94 Add /login page and fix public home page links
- Create dedicated /login page for sign up/sign in
- Replace all /settings links with /login in public home
- Get Started button now takes users to login page
- Redirects authenticated users back to main app
2026-01-19 15:23:21 -05:00
nmemmert 149cfa5790 Add public landing page and privacy policy for Google OAuth verification
- Create public home page accessible without login
- Add comprehensive privacy policy page at /privacy
- Add privacy policy link to home page and footer
- Clearly explain app purpose: prayer journal and tracker
- Show app name 'Haver' prominently on home page
- Addresses Google OAuth verification requirements:
  - Home page not behind login
  - Separate privacy policy URL
  - App purpose clearly explained
  - Privacy policy link visible
2026-01-19 15:20:34 -05:00
nmemmert b7c9593c13 readme 2026-01-19 12:45:51 -05:00
5 changed files with 614 additions and 83 deletions

No files matched your search

+271 -82
View File
@@ -1,128 +1,317 @@
# Haver — Prayer App
A minimalist PWA for journaling prayers and tracking answered prayers. Built with Next.js, Firebase, and Tailwind.
> A beautiful, minimalist PWA for journaling prayers, tracking prayer requests, and celebrating answered prayers.
Current Version: 0.2.0
Built with Next.js, Firebase, and Tailwind CSS.
## What's New (0.2.0)
- Redesign: unified dark theme and gradients
- Icons: lucide-react across headings and nav
- Cleanup: removed legacy email routes and pages
- UX: Pray For suggestions in compose tab
**Current Version: 0.4.0**
## Features
- Firebase auth (login)
- Compose daily prayer with date and optional "Pray For"
- Suggested "Pray For" names via dropdown (type to add new)
- Mark prayers as answered with details
- Calendar view of entries
- Reflections list with search and filters
- Answered prayers gallery
- Reminder banner + notification time settings
- PWA installable; dark theme by default
[![PWA](https://img.shields.io/badge/PWA-Enabled-blue)](https://github.com/nmemmert/prayer-app)
[![Firebase](https://img.shields.io/badge/Firebase-Ready-orange)](https://firebase.google.com)
[![License](https://img.shields.io/badge/License-MIT-green)](LICENSE)
## Versioning Policy
- Uses semantic versioning: major.minor
- Minor: UI/UX tweaks, non-breaking features
- Major: structural changes or breaking updates
---
## Setup
1. Create a Firebase project (Authentication + Firestore)
2. Add your Firebase config to [src/lib/firebase.ts](src/lib/firebase.ts)
3. Start the dev server
## 📸 Screenshots
## Notes
- Email sending routes have been removed in the redesign.
- Email verification remains available via Firebase.
<!-- Add screenshots here after taking them -->
> *Dashboard showing Today's Prayers and quick stats*
## Firestore Rules
Deploy [firestore.rules](firestore.rules) to secure user data.
> *Compose tab for creating new prayer entries*
## Development
- `npm run dev` — start dev server
- `npm run build` — production build
- `npm run lint` — lint code
- `npm test` — run tests
> *Calendar view of prayer activity*
## Troubleshooting
> *Things to Pray For - active requests*
### Common Issues
---
1. **Firebase Configuration**: Ensure all Firebase config values are correctly set in `src/lib/firebase.ts`.
## ✨ What's New (0.4.0)
- **Dashboard Navigation**: Tap stat cards to jump to relevant sections
- **Today's Prayers**: Shows unique prayers + total taps with details
- **Fresh Compose**: No draft persistence, clean slate every time
- **Quick Access**: Things to Pray For card now tappable
2. **SMTP Settings**: Verify SMTP credentials in the Admin panel. Use app passwords for Gmail.
---
3. **PWA Installation**: Clear browser cache if PWA doesn't install properly.
## 🎯 Features
4. **Email Reminders**: Check Firestore security rules and ensure SMTP is configured.
### Core Prayer Tracking
- ✍️ **Daily Prayer Composer** — Write prayers with date and optional "Pray For" categories
- 📊 **Today's Prayers Dashboard** — See unique prayers and total taps for the day
- 🙏 **Things to Pray For** — Track active prayer requests with tap-to-mark functionality
- ✅ **Answered Prayers** — Mark prayers as answered with celebration details
- 📅 **Calendar View** — Visual timeline of your prayer journey
- 📖 **Reflections List** — Search and filter all past prayers
### Development
### Smart Features
- 🎯 **Quick Navigation** — Tap stat cards to jump to relevant sections
- 💾 **Cross-Device Sync** — All data stored in Firebase, accessible anywhere
- 📱 **Offline Support** — IndexedDB persistence for reliable offline use
- 🔔 **Reminder Notifications** — Set custom reminder times
- 🌙 **Dark Theme** — Beautiful gradient design optimized for focus
- 📲 **PWA Installable** — Install as standalone app on any device
- Run `npm run dev` for development server
- Run `npm run build` for production build
- Run `npm run lint` for code linting
- Run `npm test` for running tests
### Analytics & Insights
- 📈 **Prayer Statistics** — Track total prayers, days prayed, answered percentage
- 🔥 **Prayer Streak** — See consecutive days of prayer activity
- 📊 **Most Prayed For** — Identify your top prayer focus areas
- 📏 **Average Prayer Length** — Monitor your prayer depth
## Usage
- Compose: write your prayer, pick a date, and optionally select or type a "Pray For" name.
- Praying: mark prayers as prayed today.
- Calendar: click a day to view/edit its entry.
- Reflections: search and filter past prayers.
- Answered: review answered prayers with details.
- About: set reminder time, test notifications, and read "What's New".
---
## Getting Started
## 🚀 Getting Started
## Build & Deploy
### Prerequisites
- Node.js 20+
- Firebase account
- npm or yarn
### Installation
1. **Clone the repository**
```bash
npm run build
git clone https://github.com/nmemmert/prayer-app.git
cd prayer-app
```
Deploy to Vercel or your preferred platform.
## Getting Started
First, install dependencies:
2. **Install dependencies**
```bash
npm install
```
Then, run the development server:
3. **Configure Firebase**
- Create a Firebase project at [console.firebase.google.com](https://console.firebase.google.com)
- Enable Authentication (Email/Password)
- Enable Firestore Database
- Copy your Firebase config to `src/lib/firebase.ts`
4. **Deploy Firestore Rules**
```bash
firebase deploy --only firestore:rules
```
5. **Start development server**
```bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
6. **Open** [http://localhost:3000](http://localhost:3000)
You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
---
This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
## 📖 How to Use
## Configuration
### 1. **Dashboard (Home)**
The dashboard is your prayer command center:
- **Today's Prayers** card shows:
- Unique prayers you've marked today
- Total taps/prayer sessions today
- List of top 3 prayed items
- **Tap any stat card** to navigate:
- Total Prayers → Reflections
- Days Prayed → Calendar
- Answered → Answered Prayers
- **Things to Pray For** shows active requests (tap to view all)
For email reminders, configure SMTP settings in `src/app/api/send-email/route.ts`.
### 2. **Compose a Prayer**
Create new prayer entries:
1. Tap the **"Start New Prayer"** button or compose tab
2. Select a date (defaults to today)
3. Write your prayer in the text area
4. (Optional) Add a "Pray For" category (person/topic)
5. Tap **"Save Prayer"**
## Build
*Pro tip: Use "Pray For" categories to organize requests by person or topic*
### 3. **Things to Pray For**
Manage active prayer requests:
- View all non-answered prayers
- Tap **"Mark as Prayed"** when you pray for an item
- Multiple taps per day are tracked for Today's Prayers stats
- Tap any prayer to edit or mark as answered
### 4. **Calendar View**
Visual timeline of your prayer journey:
- See which days you created prayers (blue indicators)
- See which days you prayed for requests (dot intensity)
- Tap any date to view/edit that day's prayers
### 5. **Answered Prayers**
Celebrate God's faithfulness:
- View all prayers marked as answered
- Add answer details to remember how prayers were answered
- Review past testimonies to boost your faith
### 6. **Reflections**
Search and review your prayer history:
- Browse all prayers chronologically
- Search by text or "Pray For" category
- Filter by answered/unanswered
- Edit or update any prayer
### 7. **Settings (About)**
Customize your experience:
- Set reminder notification time
- Test notifications
- View app version and changelog
- Manage account settings
---
## 🏗️ Development
### Available Scripts
```bash
npm run build
npm run dev # Start development server
npm run build # Production build
npm run start # Start production server
npm run lint # Lint code
npm run version:minor # Bump minor version
npm run version:major # Bump major version
```
## Deploy
### Project Structure
```
prayer-app/
├── src/
│ ├── app/ # Next.js app directory
│ │ ├── page.tsx # Main app logic
│ │ ├── layout.tsx # Root layout
│ │ └── globals.css # Global styles
│ ├── components/ # React components
│ │ ├── HomePage.tsx # Dashboard
│ │ ├── DailyEntry.tsx # Compose form
│ │ ├── CalendarView.tsx # Calendar
│ │ ├── ThingsToPrayFor.tsx
│ │ ├── AnsweredPrayers.tsx
│ │ ├── ReflectionsList.tsx
│ │ ├── AboutPage.tsx
│ │ └── ...
│ ├── context/
│ │ └── AuthContext.tsx # Firebase auth
│ └── lib/
│ ├── firebase.ts # Firebase config
│ └── version.ts # App version
├── public/ # Static assets
├── firestore.rules # Firestore security rules
└── Dockerfile # Docker container
```
Deploy to Vercel or any platform supporting Next.js PWAs.
---
## Docker (optional)
Basic containerization is available. Remove or adapt scripts as needed.
## 🐳 Docker Deployment
## Learn More
- [Next.js Documentation](https://nextjs.org/docs)
- [Tailwind CSS](https://tailwindcss.com/docs)
### Build Image
```bash
docker build -t prayer-app:latest .
```
### Run Container
```bash
docker run -p 3000:3000 prayer-app:latest
```
### Deploy to GitHub Container Registry
```bash
docker tag prayer-app:latest ghcr.io/YOUR_USERNAME/prayer-app:latest
docker push ghcr.io/YOUR_USERNAME/prayer-app:latest
```
---
## 🔒 Firebase Security
The app uses Firestore security rules to protect user data. Key rules:
- Users can only read/write their own prayers
- Authentication required for all operations
- Subcollections for statistics, settings, and drafts
Deploy rules:
```bash
firebase deploy --only firestore:rules
```
---
## 🎨 Customization
### Theme Colors
Edit `tailwind.config.ts` to customize the color palette.
### Components
All components use Tailwind CSS utility classes for easy styling modifications.
---
## 📱 PWA Features
- **Offline Support**: Works without internet after first load
- **Install Prompt**: Add to home screen on mobile/desktop
- **Push Notifications**: Daily prayer reminders (requires permission)
- **Fast Loading**: Optimized for performance
---
## 🗺️ Roadmap
### Phase 1: Calendar Integration (Q1 2026)
- 📅 **Google Calendar Sync** — Automatically add prayer reminders to Google Calendar
- 📅 **Outlook Calendar Sync** — Sync with Microsoft Outlook
- 🔔 **Smart Reminders** — Calendar events trigger app notifications
- ⏰ **Recurring Prayers** — Set prayers to repeat daily/weekly on calendar
### Phase 2: Prayer Sharing & Community (Q2 2026)
- 🤝 **Share Prayer Requests** — Generate shareable links for prayer requests
- 👥 **Prayer Partners** — Invite friends to pray for specific requests
- 📧 **Email Sharing** — Send prayer requests via email to contacts
- 🔐 **Private Groups** — Create closed prayer groups with invite-only access
- 💬 **Prayer Updates** — Notify prayer partners when requests are answered
---
## 🐛 Troubleshooting
### Common Issues
**Firebase Connection Errors**
- Verify Firebase config in `src/lib/firebase.ts`
- Check Firestore security rules are deployed
- Ensure Authentication is enabled in Firebase Console
**Offline Warnings**
- "Could not reach backend" warnings are normal with offline persistence enabled
- Data will sync when connection is restored
**Notifications Not Working**
- Grant notification permission in browser settings
- Test using the "Test Notification" button in About tab
**PWA Not Installing**
- Clear browser cache
- Ensure you're using HTTPS (or localhost)
- Check browser supports PWA
---
## 📄 License
MIT License - feel free to use this project for personal or commercial purposes.
---
## 🙏 Acknowledgments
- Built with [Next.js](https://nextjs.org)
- Powered by [Firebase](https://firebase.google.com)
- Styled with [Tailwind CSS](https://tailwindcss.com)
- Icons by [Lucide React](https://lucide.dev)
---
## 📞 Support
Having issues? Check the [Troubleshooting](#-troubleshooting) section or open an issue on GitHub.
---
**Made with ❤️ and ✝️ for daily prayer practice**
```
+36
View File
@@ -0,0 +1,36 @@
'use client';
import { useAuth } from '@/context/AuthContext';
import { useEffect } from 'react';
import { useRouter } from 'next/navigation';
import Login from '@/components/Login';
import { Loader2 } from 'lucide-react';
export default function LoginPage() {
const { user, loading } = useAuth();
const router = useRouter();
useEffect(() => {
if (!loading && user) {
router.push('/');
}
}, [user, loading, router]);
if (loading) {
return (
<div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-slate-900 via-purple-900 to-slate-900">
<Loader2 className="w-8 h-8 animate-spin text-blue-400" />
</div>
);
}
if (user) {
return null;
}
return (
<div className="min-h-screen bg-gradient-to-br from-slate-900 via-purple-900 to-slate-900">
<Login />
</div>
);
}
+2 -1
View File
@@ -12,6 +12,7 @@ import ThingsToPrayFor from '@/components/ThingsToPrayFor';
import AboutPage from '@/components/AboutPage';
import HomePage from '@/components/HomePage';
import AnsweredPrayers from '@/components/AnsweredPrayers';
import PublicHome from './public-home';
import { db } from '@/lib/firebase';
import { collection, addDoc, getDocs, updateDoc, query, where, doc, setDoc, getDoc } from 'firebase/firestore';
import { Loader2 } from 'lucide-react';
@@ -319,7 +320,7 @@ export default function Home() {
}
if (!user) {
return <Login />;
return <PublicHome />;
}
return (
+161
View File
@@ -0,0 +1,161 @@
import Link from 'next/link';
export default function PrivacyPolicy() {
return (
<div className="min-h-screen bg-gradient-to-br from-slate-900 via-purple-900 to-slate-900">
{/* Header */}
<header className="border-b border-slate-700/50 sticky top-0 z-50 backdrop-blur-xl bg-slate-900/80">
<div className="max-w-6xl mx-auto px-4 py-4 flex justify-between items-center">
<Link href="/" className="flex items-center gap-2 hover:opacity-80 transition-opacity">
<span className="text-3xl">🙏</span>
<h1 className="text-2xl font-bold text-white">Haver</h1>
</Link>
<Link href="/" className="text-slate-300 hover:text-white transition-colors">Back to Home</Link>
</div>
</header>
{/* Content */}
<div className="max-w-4xl mx-auto px-4 py-12">
<h1 className="text-4xl font-bold text-white mb-8">Privacy Policy</h1>
<div className="prose prose-invert max-w-none space-y-6">
<section>
<h2 className="text-2xl font-bold text-white mb-4">1. Introduction</h2>
<p className="text-slate-300">
Haver ("we", "our", or "us") is committed to protecting your privacy. This Privacy Policy explains
how we collect, use, disclose, and safeguard your information when you use our prayer journal application
and website.
</p>
</section>
<section>
<h2 className="text-2xl font-bold text-white mb-4">2. Information We Collect</h2>
<h3 className="text-xl font-semibold text-slate-200 mb-2">2.1 Account Information</h3>
<p className="text-slate-300">
When you create an account, we collect your email address and authentication information to maintain
your account and provide services.
</p>
<h3 className="text-xl font-semibold text-slate-200 mb-2 mt-4">2.2 Prayer Data</h3>
<p className="text-slate-300">
All prayers, prayer requests, and related entries you create in Haver are stored in your account.
This data is essential to the functionality of the application.
</p>
<h3 className="text-xl font-semibold text-slate-200 mb-2 mt-4">2.3 Calendar Integration Data</h3>
<p className="text-slate-300">
If you connect your Google Calendar, we store your Google authentication token to sync recurring
prayer reminders. We do not store your Google password.
</p>
<h3 className="text-xl font-semibold text-slate-200 mb-2 mt-4">2.4 Device Information</h3>
<p className="text-slate-300">
We may collect information about your device, including device type, operating system, and browser
type for analytics and debugging purposes.
</p>
</section>
<section>
<h2 className="text-2xl font-bold text-white mb-4">3. How We Use Your Information</h2>
<ul className="list-disc list-inside text-slate-300 space-y-2">
<li>To provide and maintain the Haver service</li>
<li>To sync your prayers and prayer requests across devices</li>
<li>To sync recurring prayer reminders to your Google Calendar</li>
<li>To send notifications and reminders (if enabled)</li>
<li>To improve and optimize the application</li>
<li>To comply with legal obligations</li>
</ul>
</section>
<section>
<h2 className="text-2xl font-bold text-white mb-4">4. Data Security</h2>
<p className="text-slate-300 mb-4">
Haver uses Firebase, a Google Cloud service, to securely store all your data. We implement industry-standard
security measures including:
</p>
<ul className="list-disc list-inside text-slate-300 space-y-2">
<li>Encryption of data in transit (HTTPS)</li>
<li>Secure authentication (Firebase Authentication)</li>
<li>Regular security updates and patches</li>
<li>Firestore security rules to control data access</li>
</ul>
</section>
<section>
<h2 className="text-2xl font-bold text-white mb-4">5. Third-Party Services</h2>
<p className="text-slate-300 mb-4">
Haver uses the following third-party services:
</p>
<ul className="list-disc list-inside text-slate-300 space-y-2">
<li><strong>Firebase:</strong> For data storage, authentication, and analytics</li>
<li><strong>Google Calendar API:</strong> For syncing recurring prayer reminders (if enabled)</li>
<li><strong>Google Analytics:</strong> For anonymous usage statistics</li>
</ul>
<p className="text-slate-300 mt-4">
Please review the privacy policies of these services for more information about their data practices.
</p>
</section>
<section>
<h2 className="text-2xl font-bold text-white mb-4">6. Your Rights and Choices</h2>
<h3 className="text-xl font-semibold text-slate-200 mb-2">6.1 Access and Portability</h3>
<p className="text-slate-300">
You can access, download, or export your prayer data from your account at any time.
</p>
<h3 className="text-xl font-semibold text-slate-200 mb-2 mt-4">6.2 Deletion</h3>
<p className="text-slate-300">
You can delete individual prayers or your entire account. When you delete your account, all associated
data is permanently removed.
</p>
<h3 className="text-xl font-semibold text-slate-200 mb-2 mt-4">6.3 Notifications</h3>
<p className="text-slate-300">
You can control reminder notifications and calendar sync settings within the application.
</p>
</section>
<section>
<h2 className="text-2xl font-bold text-white mb-4">7. Children's Privacy</h2>
<p className="text-slate-300">
Haver is not intended for children under 13. We do not knowingly collect personal information from
children under 13. If we become aware that we have collected such information, we will delete it promptly.
</p>
</section>
<section>
<h2 className="text-2xl font-bold text-white mb-4">8. Changes to This Privacy Policy</h2>
<p className="text-slate-300">
We may update this Privacy Policy from time to time. We will notify you of any changes by updating
the "Last Updated" date below. Your continued use of Haver after such modifications constitutes your
acceptance of the updated Privacy Policy.
</p>
</section>
<section>
<h2 className="text-2xl font-bold text-white mb-4">9. Contact Us</h2>
<p className="text-slate-300">
If you have any questions about this Privacy Policy or our privacy practices, please contact us at
privacy@haverprayerapp.com or visit our website at https://prayer.necloud.us.
</p>
</section>
<section className="bg-slate-800/50 backdrop-blur rounded-lg p-6 border border-slate-700/50">
<p className="text-slate-400 text-sm">
<strong>Last Updated:</strong> January 19, 2026
</p>
</section>
</div>
</div>
{/* Footer */}
<footer className="border-t border-slate-700/50 bg-slate-900/50 mt-20 py-12">
<div className="max-w-6xl mx-auto px-4 text-center">
<Link href="/" className="text-slate-400 hover:text-white transition-colors">
Back to Haver
</Link>
</div>
</footer>
</div>
);
}
+144
View File
@@ -0,0 +1,144 @@
import Link from 'next/link';
export default function PublicHome() {
return (
<div className="min-h-screen bg-gradient-to-br from-slate-900 via-purple-900 to-slate-900">
{/* Header */}
<header className="border-b border-slate-700/50 sticky top-0 z-50 backdrop-blur-xl bg-slate-900/80">
<div className="max-w-6xl mx-auto px-4 py-4 flex justify-between items-center">
<div className="flex items-center gap-2">
<span className="text-3xl">🙏</span>
<h1 className="text-2xl font-bold text-white">Haver</h1>
</div>
<Link
href="/login"
className="px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-lg font-semibold transition-colors"
>
Sign In
</Link>
</div>
</header>
{/* Hero Section */}
<section className="max-w-6xl mx-auto px-4 py-20 text-center">
<h2 className="text-5xl md:text-6xl font-bold text-white mb-6">
A Prayer Journal for Your Daily Practice
</h2>
<p className="text-xl text-slate-300 mb-8 max-w-2xl mx-auto">
Haver is a beautiful, minimalist app designed to help you journal your prayers, track prayer requests,
and celebrate when God answers. Stay connected to your prayer life, anytime, anywhere.
</p>
<Link
href="/login"
className="inline-block px-8 py-3 bg-blue-600 hover:bg-blue-700 text-white rounded-lg font-semibold transition-colors text-lg"
>
Get Started
</Link>
</section>
{/* Features Section */}
<section className="max-w-6xl mx-auto px-4 py-20">
<h3 className="text-3xl font-bold text-white mb-12 text-center">Why Use Haver?</h3>
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
<div className="bg-slate-800/50 backdrop-blur rounded-xl p-6 border border-slate-700/50">
<div className="text-4xl mb-4">✍️</div>
<h4 className="text-xl font-semibold text-white mb-2">Daily Prayer Composer</h4>
<p className="text-slate-300">Write prayers with dates and prayer request categories to organize your spiritual life.</p>
</div>
<div className="bg-slate-800/50 backdrop-blur rounded-xl p-6 border border-slate-700/50">
<div className="text-4xl mb-4">📊</div>
<h4 className="text-xl font-semibold text-white mb-2">Prayer Dashboard</h4>
<p className="text-slate-300">See your unique prayers and total prayer taps for each day at a glance.</p>
</div>
<div className="bg-slate-800/50 backdrop-blur rounded-xl p-6 border border-slate-700/50">
<div className="text-4xl mb-4">🙏</div>
<h4 className="text-xl font-semibold text-white mb-2">Prayer Requests</h4>
<p className="text-slate-300">Track active prayer requests and mark them as you pray for them throughout the week.</p>
</div>
<div className="bg-slate-800/50 backdrop-blur rounded-xl p-6 border border-slate-700/50">
<div className="text-4xl mb-4">✅</div>
<h4 className="text-xl font-semibold text-white mb-2">Answered Prayers</h4>
<p className="text-slate-300">Celebrate God's faithfulness by recording and reflecting on answered prayers.</p>
</div>
<div className="bg-slate-800/50 backdrop-blur rounded-xl p-6 border border-slate-700/50">
<div className="text-4xl mb-4">📅</div>
<h4 className="text-xl font-semibold text-white mb-2">Prayer Calendar</h4>
<p className="text-slate-300">Visualize your prayer journey with a beautiful calendar view of your activity.</p>
</div>
<div className="bg-slate-800/50 backdrop-blur rounded-xl p-6 border border-slate-700/50">
<div className="text-4xl mb-4">📱</div>
<h4 className="text-xl font-semibold text-white mb-2">Works Offline</h4>
<p className="text-slate-300">Access your prayers anywhere with offline support and cross-device sync via Firebase.</p>
</div>
</div>
</section>
{/* Calendar Sync Section */}
<section className="max-w-6xl mx-auto px-4 py-20">
<div className="bg-slate-800/50 backdrop-blur rounded-xl p-8 border border-slate-700/50">
<h3 className="text-2xl font-bold text-white mb-4">📅 Calendar Integration</h3>
<p className="text-slate-300 mb-4">
Create recurring prayer reminders and automatically sync them to your Google Calendar.
Never forget to pray for what matters most.
</p>
<ul className="text-slate-300 space-y-2">
<li>✓ Sync recurring prayers to Google Calendar</li>
<li>✓ Automatic reminders at your preferred time</li>
<li>✓ Set daily, weekly, biweekly, or monthly reminders</li>
</ul>
</div>
</section>
{/* CTA Section */}
<section className="max-w-6xl mx-auto px-4 py-20 text-center">
<h3 className="text-3xl font-bold text-white mb-6">Ready to Start Your Prayer Journey?</h3>
<Link
href="/login"
className="inline-block px-8 py-3 bg-blue-600 hover:bg-blue-700 text-white rounded-lg font-semibold transition-colors text-lg"
>
Sign In Now
</Link>
</section>
{/* Footer */}
<footer className="border-t border-slate-700/50 bg-slate-900/50 mt-20 py-12">
<div className="max-w-6xl mx-auto px-4">
<div className="grid md:grid-cols-4 gap-8 mb-8">
<div>
<h4 className="text-white font-semibold mb-4">Haver</h4>
<p className="text-slate-400 text-sm">A prayer app for your daily practice.</p>
</div>
<div>
<h4 className="text-white font-semibold mb-4">Quick Links</h4>
<ul className="space-y-2">
<li><Link href="/privacy" className="text-slate-400 hover:text-white transition-colors">Privacy Policy</Link></li>
<li><Link href="#" className="text-slate-400 hover:text-white transition-colors">Terms of Service</Link></li>
<li><Link href="/login" className="text-slate-400 hover:text-white transition-colors">Sign In</Link></li>
</ul>
</div>
<div>
<h4 className="text-white font-semibold mb-4">Contact</h4>
<p className="text-slate-400 text-sm">Questions? We'd love to hear from you.</p>
</div>
<div>
<h4 className="text-white font-semibold mb-4">Version</h4>
<p className="text-slate-400 text-sm">v0.4.0</p>
</div>
</div>
<div className="border-t border-slate-700/50 pt-8 flex flex-col md:flex-row justify-between items-center">
<p className="text-slate-400 text-sm mb-4 md:mb-0">© 2026 Haver. All rights reserved.</p>
<div className="flex gap-4">
<Link href="/privacy" className="text-slate-400 hover:text-white text-sm transition-colors">Privacy</Link>
<Link href="#" className="text-slate-400 hover:text-white text-sm transition-colors">Terms</Link>
</div>
</div>
</div>
</footer>
</div>
);
}