From a6b3b6a25158b24b2a9e53cfefa06f185d9239d0 Mon Sep 17 00:00:00 2001 From: Jamie Brunton Date: Sun, 25 Jan 2026 19:30:42 +0000 Subject: [PATCH] Reposition app as relationship improvement tool Co-Authored-By: Claude Opus 4.5 --- CLAUDE.md | 2 +- apps/mobile/DESIGN.md | 240 ++++++++++++++--------------- apps/web/app/layout.tsx | 14 +- apps/web/app/privacy/page.tsx | 2 +- apps/web/app/terms/page.tsx | 2 +- apps/web/components/CTA.tsx | 64 ++++---- apps/web/components/FAQ.tsx | 7 +- apps/web/components/Features.tsx | 12 +- apps/web/components/Hero.tsx | 64 ++++---- apps/web/components/HowItWorks.tsx | 6 +- apps/web/components/Pricing.tsx | 68 ++++---- 11 files changed, 243 insertions(+), 238 deletions(-) diff --git a/CLAUDE.md b/CLAUDE.md index d2dd7ce..8b67210 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -12,7 +12,7 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co ## Project Overview -Sauci is a couples intimacy app featuring swipeable question packs with partner matching. Users swipe on questions (yes/no/maybe), and when both partners answer positively, a "match" is created that unlocks a chat thread for that question. +Sauci is a couples relationship app that helps partners communicate better and grow closer together. Users swipe on thoughtful questions (yes/no/maybe), and when both partners answer positively, a "match" is created that unlocks a chat thread for that topic. ## Commands diff --git a/apps/mobile/DESIGN.md b/apps/mobile/DESIGN.md index 365d197..f27abc0 100644 --- a/apps/mobile/DESIGN.md +++ b/apps/mobile/DESIGN.md @@ -1,24 +1,24 @@ -# Sauci Design System - -A boutique, premium design framework for the Sauci couples intimacy app. +# Sauci Design System + +A boutique, premium design framework for the Sauci couples relationship app. ## Brand Identity -**Aesthetic:** Boutique lingerie store meets modern dating app. Think Ann Summers sophistication - sensual but tasteful, premium but accessible, intimate but playful. +**Aesthetic:** Premium couples app with a warm, sophisticated feel. Think modern wellness meets connection - supportive but not clinical, premium but accessible, personal but playful. -**Mood:** Romantic, luxurious, warm, inviting, confident +**Mood:** Warm, supportive, confident, inviting, growth-oriented -**Key Principles:** - -- Dark, velvety backgrounds with subtle gradient atmosphere -- Solid, high-contrast surfaces (no glass or blur effects) -- Primary gradient (rose → purple) as the core brand signature -- Gold reserved for premium/dares features only -- Soft glows and shadows for depth, not transparency +**Key Principles:** + +- Dark, velvety backgrounds with subtle gradient atmosphere +- Solid, high-contrast surfaces (no glass or blur effects) +- Primary gradient (rose → purple) as the core brand signature +- Gold reserved for premium/dares features only +- Soft glows and shadows for depth, not transparency --- -## Color Hierarchy +## Color Hierarchy ### 1. Brand Colors (Primary Palette) @@ -26,14 +26,14 @@ The core brand identity. Used for primary actions, key UI elements, and brand re | Name | Hex | RGB | Usage | |------|-----|-----|-------| -| **Primary** | `#e1306c` | 225, 48, 108 | Primary buttons, active states, key accents | -| **Primary Dark** | `#c12055` | 193, 32, 85 | Pressed states, darker variants | -| **Secondary** | `#9b59b6` | 155, 89, 182 | Secondary accents, gradient endpoints | -| **Secondary Dark** | `#8e44ad` | 142, 68, 173 | Pressed states, darker variants | - -**Primary Gradient:** `#e1306c → #9b59b6` (Rose to Purple) -- Direction: Left to right (horizontal) or top to bottom (vertical) -- Use for: Primary buttons, match celebrations, brand moments +| **Primary** | `#e1306c` | 225, 48, 108 | Primary buttons, active states, key accents | +| **Primary Dark** | `#c12055` | 193, 32, 85 | Pressed states, darker variants | +| **Secondary** | `#9b59b6` | 155, 89, 182 | Secondary accents, gradient endpoints | +| **Secondary Dark** | `#8e44ad` | 142, 68, 173 | Pressed states, darker variants | + +**Primary Gradient:** `#e1306c → #9b59b6` (Rose to Purple) +- Direction: Left to right (horizontal) or top to bottom (vertical) +- Use for: Primary buttons, match celebrations, brand moments ### 2. Premium/Luxury Colors @@ -53,11 +53,11 @@ Each core feature has a designated accent color for consistency and recognition. | Feature | Primary Color | Hex | Gradient | |---------|---------------|-----|----------| -| **Swipe/Match** | Primary | `#e1306c` | Primary gradient (rose → purple) | -| **Quiz** | Rose | `#E8A4AE` | `#E8A4AE → #D4919B` | -| **Dares** | Gold | `#D4AF37` | `#D4AF37 → #B8860B` | -| **Chat** | Primary | `#e1306c` | Primary gradient | -| **Profile** | Secondary | `#9b59b6` | Secondary gradient | +| **Swipe/Match** | Primary | `#e1306c` | Primary gradient (rose → purple) | +| **Quiz** | Rose | `#E8A4AE` | `#E8A4AE → #D4919B` | +| **Dares** | Gold | `#D4AF37` | `#D4AF37 → #B8860B` | +| **Chat** | Primary | `#e1306c` | Primary gradient | +| **Profile** | Secondary | `#9b59b6` | Secondary gradient | **Usage Rules:** - Feature icons use their designated color @@ -71,31 +71,31 @@ Dark, rich backgrounds that make content pop. | Name | Hex | RGBA | Usage | |------|-----|------|-------| -| **Background** | `#0e0e11` | 14, 14, 17 | Primary app background | -| **Background Light** | `#17171c` | 23, 23, 28 | Cards, elevated surfaces | -| **Surface** | `#17171c` | 23, 23, 28 | Primary surface color | -| **Surface Solid** | `#17171c` | 23, 23, 28 | Opaque surfaces | -| **Border** | `#303036` | 48, 48, 54 | Dividers, outlines, input borders | - -### 5. Tile/Category Colors (Home Screen) - -Discovery/Home tiles use vibrant, solid colors for quick recognition. - -| Token | Hex | -|-------|-----| -| **teal** | `#14B8A6` | -| **purple** | `#8B5CF6` | -| **orange** | `#F97316` | -| **coral** | `#F87171` | -| **emerald** | `#10B981` | -| **indigo** | `#6366F1` | -| **rose** | `#EC4899` | -| **amber** | `#F59E0B` | - -**Usage Rules:** -- Tiles are solid fills with a subtle dark overlay for depth -- Category colors are consistent across the app -- Avoid gradients on tiles unless it is a premium moment +| **Background** | `#0e0e11` | 14, 14, 17 | Primary app background | +| **Background Light** | `#17171c` | 23, 23, 28 | Cards, elevated surfaces | +| **Surface** | `#17171c` | 23, 23, 28 | Primary surface color | +| **Surface Solid** | `#17171c` | 23, 23, 28 | Opaque surfaces | +| **Border** | `#303036` | 48, 48, 54 | Dividers, outlines, input borders | + +### 5. Tile/Category Colors (Home Screen) + +Discovery/Home tiles use vibrant, solid colors for quick recognition. + +| Token | Hex | +|-------|-----| +| **teal** | `#14B8A6` | +| **purple** | `#8B5CF6` | +| **orange** | `#F97316` | +| **coral** | `#F87171` | +| **emerald** | `#10B981` | +| **indigo** | `#6366F1` | +| **rose** | `#EC4899` | +| **amber** | `#F59E0B` | + +**Usage Rules:** +- Tiles are solid fills with a subtle dark overlay for depth +- Category colors are consistent across the app +- Avoid gradients on tiles unless it is a premium moment ### 6. Text Colors @@ -131,14 +131,14 @@ Consistent across all swipe interactions: --- -## Gradients +## Gradients ### Brand Gradients ``` -Primary: #e1306c → #9b59b6 (Rose to Purple) -Primary Subtle: rgba(225, 48, 108, 0.8) → rgba(155, 89, 182, 0.8) -Primary Reverse: #9b59b6 → #e1306c (Purple to Rose) +Primary: #e1306c → #9b59b6 (Rose to Purple) +Primary Subtle: rgba(225, 48, 108, 0.8) → rgba(155, 89, 182, 0.8) +Primary Reverse: #9b59b6 → #e1306c (Purple to Rose) ``` ### Premium Gradients @@ -151,8 +151,8 @@ Premium Rose: #E8A4AE → #D4919B ### Background Gradients ``` -Background: #0e0e11 → #1f1417 → #0e0e11 -Background Reverse: #0e0e11 → #1f1417 → #0e0e11 +Background: #0e0e11 → #1f1417 → #0e0e11 +Background Reverse: #0e0e11 → #1f1417 → #0e0e11 ``` ### Boutique Card Gradients @@ -172,44 +172,44 @@ Boutique Amethyst: rgba(142, 68, 173, 0.4) → rgba(44, 62, 80, 0.4) ## Component Patterns -### Buttons +### Buttons | Variant | Background | Text | Border | |---------|------------|------|--------| -| **Primary** | Primary gradient | White | None | -| **Secondary** | Surface | White | Border | -| **Ghost** | Transparent | Primary | None | -| **Danger** | Error gradient | White | None | -| **Feature** | Feature color gradient | White | None | +| **Primary** | Primary gradient | White | None | +| **Secondary** | Surface | White | Border | +| **Ghost** | Transparent | Primary | None | +| **Danger** | Error gradient | White | None | +| **Feature** | Feature color gradient | White | None | -### Cards +### Cards | Variant | Background | Border | Use Case | |---------|------------|--------|----------| -| **Solid** | Surface | Border | Standard content | -| **Raised** | Surface | Border | Emphasized content + shadow | -| **Tinted** | Category color | None | Home tiles, feature promos | +| **Solid** | Surface | Border | Standard content | +| **Raised** | Surface | Border | Emphasized content + shadow | +| **Tinted** | Category color | None | Home tiles, feature promos | -### Inputs +### Inputs | State | Border Color | Background | |-------|--------------|------------| -| **Default** | Border | Surface | -| **Focused** | Primary | Surface | -| **Error** | Error | Surface | -| **Disabled** | Border | Surface (opacity 0.6) | +| **Default** | Border | Surface | +| **Focused** | Primary | Surface | +| **Error** | Error | Surface | +| **Disabled** | Border | Surface (opacity 0.6) | --- -## Tab Bar +## Tab Bar | Element | Color | |---------|-------| -| **Background** | `#0e0e11` | -| **Top Border** | `rgba(225, 48, 108, 0.2)` (primary tint) | -| **Active Icon** | Primary `#e1306c` | -| **Inactive Icon** | Text secondary | -| **Badge** | Rose `#E8A4AE` | +| **Background** | `#0e0e11` | +| **Top Border** | `rgba(225, 48, 108, 0.2)` (primary tint) | +| **Active Icon** | Primary `#e1306c` | +| **Inactive Icon** | Text secondary | +| **Badge** | Rose `#E8A4AE` | ## Play Button (Center Tab) @@ -217,10 +217,10 @@ The main "play" button uses the primary brand gradient for maximum brand presenc | Element | Color | |---------|-------| -| **Glow** | Primary glow `rgba(225, 48, 108, 0.3)` | -| **Border** | `rgba(225, 48, 108, 0.4)` | -| **Highlight** | Primary → Secondary gradient | -| **Icon** | Primary `#e1306c` | +| **Glow** | Primary glow `rgba(225, 48, 108, 0.3)` | +| **Border** | `rgba(225, 48, 108, 0.4)` | +| **Highlight** | Primary → Secondary gradient | +| **Icon** | Primary `#e1306c` | ## Radial Menu @@ -228,9 +228,9 @@ Feature-specific colors for quick action items: | Item | Variant | Color | |------|---------|-------| -| **Match** | Primary | `#e1306c` (core feature) | -| **Dares** | Gold | `#D4AF37` (premium/adventure) | -| **Quiz** | Rose | `#E8A4AE` (intimacy) | +| **Match** | Primary | `#e1306c` (core feature) | +| **Dares** | Gold | `#D4AF37` (premium/adventure) | +| **Quiz** | Rose | `#E8A4AE` (connection) | --- @@ -240,7 +240,7 @@ Feature-specific colors for quick action items: | Feature | Icon Name | Ionicons | Description | |---------|-----------|----------|-------------| -| **Swipe/Match** | `flame` | 🔥 | Fire/passion - the core swiping experience | +| **Swipe/Match** | `flame` | 🔥 | Fire/energy - the core swiping experience | | **Dares** | `flash` | ⚡ | Lightning bolt - adventure, excitement, energy | | **Quiz** | `help-circle` | ❓ | Question mark - discovery, questions about each other | | **Matches** (tab) | `heart` | ❤️ | Love heart - connections made between partners | @@ -287,17 +287,17 @@ Feature-specific colors for quick action items: | Style | Size | Weight | Line Height | Usage | |-------|------|--------|-------------|-------| -| `largeTitle` | 32px | Bold | 40px | Screen titles | -| `title1` | 28px | Bold | 34px | Section headers | -| `title2` | 24px | Bold | 30px | Card titles | -| `title3` | 20px | SemiBold | 26px | Subsection headers | -| `headline` | 17px | SemiBold | 22px | Emphasized body | -| `body` | 16px | Regular | 22px | Body text | -| `callout` | 15px | Regular | 20px | Secondary body | -| `subhead` | 14px | Regular | 20px | Supporting text | -| `footnote` | 13px | Regular | 18px | Captions | -| `caption1` | 12px | Regular | 16px | Small labels | -| `caption2` | 11px | Regular | 14px | Tiny text | +| `largeTitle` | 32px | Bold | 40px | Screen titles | +| `title1` | 28px | Bold | 34px | Section headers | +| `title2` | 24px | Bold | 30px | Card titles | +| `title3` | 20px | SemiBold | 26px | Subsection headers | +| `headline` | 17px | SemiBold | 22px | Emphasized body | +| `body` | 16px | Regular | 22px | Body text | +| `callout` | 15px | Regular | 20px | Secondary body | +| `subhead` | 14px | Regular | 20px | Supporting text | +| `footnote` | 13px | Regular | 18px | Captions | +| `caption1` | 12px | Regular | 16px | Small labels | +| `caption2` | 11px | Regular | 14px | Tiny text | --- @@ -314,35 +314,35 @@ Feature-specific colors for quick action items: --- -## Platform Considerations - -### iOS -- Favor solid surfaces and shadows for depth -- Haptic feedback on interactions -- Native-feeling animations - -### Android -- Match iOS surface colors and shadows -- Avoid blur and heavy transparency for performance -- Adjust shadow rendering as needed +## Platform Considerations + +### iOS +- Favor solid surfaces and shadows for depth +- Haptic feedback on interactions +- Native-feeling animations + +### Android +- Match iOS surface colors and shadows +- Avoid blur and heavy transparency for performance +- Adjust shadow rendering as needed --- ## Do's and Don'ts -### Do -- Use the primary gradient for main CTAs -- Apply feature colors consistently within a feature -- Use solid surfaces with soft shadows for depth -- Keep text high-contrast (white on dark) -- Use gold/rose for premium moments +### Do +- Use the primary gradient for main CTAs +- Apply feature colors consistently within a feature +- Use solid surfaces with soft shadows for depth +- Keep text high-contrast (white on dark) +- Use gold/rose for premium moments -### Don't -- Mix feature colors within a single screen -- Use more than 2-3 accent colors per screen -- Apply the primary gradient to everything -- Use glass, blur, or frosted effects -- Use pure black (#000000) for backgrounds +### Don't +- Mix feature colors within a single screen +- Use more than 2-3 accent colors per screen +- Apply the primary gradient to everything +- Use glass, blur, or frosted effects +- Use pure black (#000000) for backgrounds --- diff --git a/apps/web/app/layout.tsx b/apps/web/app/layout.tsx index b2c92c3..80a4454 100644 --- a/apps/web/app/layout.tsx +++ b/apps/web/app/layout.tsx @@ -4,21 +4,21 @@ import { PostHogProvider } from './providers' import { PostHogPageView } from './PostHogPageView' export const metadata: Metadata = { - title: 'Sauci - Ignite Your Connection', - description: 'Discover what you both desire. Sauci is the couples intimacy app that helps partners explore their connection through fun, meaningful questions.', - keywords: ['couples app', 'intimacy', 'relationship', 'connection', 'dating', 'love'], + title: 'Sauci - Grow Closer Together', + description: 'Sauci helps couples communicate better and strengthen their relationship through thoughtful questions and meaningful conversations.', + keywords: ['couples app', 'relationship', 'communication', 'connection', 'couples questions', 'relationship improvement'], authors: [{ name: 'Sauci' }], openGraph: { - title: 'Sauci - Ignite Your Connection', - description: 'Discover what you both desire. The couples intimacy app for deeper connections.', + title: 'Sauci - Grow Closer Together', + description: 'The couples app for better communication and stronger relationships.', url: 'https://sauci.app', siteName: 'Sauci', type: 'website', }, twitter: { card: 'summary_large_image', - title: 'Sauci - Ignite Your Connection', - description: 'Discover what you both desire. The couples intimacy app for deeper connections.', + title: 'Sauci - Grow Closer Together', + description: 'The couples app for better communication and stronger relationships.', }, icons: { icon: '/favicon.png', diff --git a/apps/web/app/privacy/page.tsx b/apps/web/app/privacy/page.tsx index ac1c90c..4b93501 100644 --- a/apps/web/app/privacy/page.tsx +++ b/apps/web/app/privacy/page.tsx @@ -4,7 +4,7 @@ import type { Metadata } from 'next' export const metadata: Metadata = { title: 'Privacy Policy - Sauci', - description: 'Privacy Policy for Sauci - the couples intimacy app', + description: 'Privacy Policy for Sauci - the couples relationship app', } export default function PrivacyPolicy() { diff --git a/apps/web/app/terms/page.tsx b/apps/web/app/terms/page.tsx index 31df774..d9fa104 100644 --- a/apps/web/app/terms/page.tsx +++ b/apps/web/app/terms/page.tsx @@ -4,7 +4,7 @@ import type { Metadata } from 'next' export const metadata: Metadata = { title: 'Terms & Conditions - Sauci', - description: 'Terms and Conditions for Sauci - the couples intimacy app', + description: 'Terms and Conditions for Sauci - the couples relationship app', } export default function TermsAndConditions() { diff --git a/apps/web/components/CTA.tsx b/apps/web/components/CTA.tsx index c785086..6855bde 100644 --- a/apps/web/components/CTA.tsx +++ b/apps/web/components/CTA.tsx @@ -1,9 +1,9 @@ 'use client' -import Image from 'next/image' -import { motion } from 'framer-motion' -import { Play } from 'lucide-react' - +import Image from 'next/image' +import { motion } from 'framer-motion' +import { Play } from 'lucide-react' + export default function CTA() { return ( @@ -32,39 +32,39 @@ export default function CTA() {

- Ready to Discover What You{' '} - Both Desire? + Ready to Build a{' '} + Stronger Relationship?

- Join thousands of couples who have deepened their connection with Sauci. - Download now and start exploring together. + Join thousands of couples who communicate better with Sauci. + Download now and start growing together.

-
- - - - - Download for iOS - - - - - Download for Android - -
- +
+ + + + + Download for iOS + + + + + Download for Android + +
+ diff --git a/apps/web/components/FAQ.tsx b/apps/web/components/FAQ.tsx index bbdd0f6..cb8e0a1 100644 --- a/apps/web/components/FAQ.tsx +++ b/apps/web/components/FAQ.tsx @@ -18,7 +18,7 @@ const faqs = [ { question: 'What happens if my partner says no to a question?', answer: - "Nothing! They won't know you were interested, and you won't know they said no. The question simply doesn't become a match. This creates a safe space to be honest about your desires.", + "Nothing! They won't know you were interested, and you won't know they said no. The question simply doesn't become a match. This creates a safe space to be completely honest.", }, { question: 'Do both partners need Pro?', @@ -30,6 +30,11 @@ const faqs = [ answer: 'Yes. All chat messages are end-to-end encrypted, meaning only you and your partner can read them. We take your privacy seriously and never share your data with third parties.', }, + { + question: 'What kind of questions are in Sauci?', + answer: + "Sauci covers everything from daily life and communication styles to future goals, values, and relationship growth. Our question packs are designed by relationship experts to help couples understand each other better.", + }, ] function FAQItem({ diff --git a/apps/web/components/Features.tsx b/apps/web/components/Features.tsx index 1925dbc..1ce25b0 100644 --- a/apps/web/components/Features.tsx +++ b/apps/web/components/Features.tsx @@ -7,21 +7,21 @@ const features = [ { icon: Heart, title: 'Swipe to Connect', - description: 'Answer intimate questions with simple swipes. Yes, no, or maybe - your desires stay private until you match.', + description: 'Answer thoughtful questions with simple swipes. Yes, no, or maybe - your answers stay private until you match.', color: 'text-primary', bgColor: 'bg-primary/10', }, { icon: Sparkles, title: 'Discover Matches', - description: 'When both partners swipe positively on a question, a match is created. Discover what you both secretly want.', + description: 'When both partners swipe positively on a question, a match is created. Find common ground and shared interests.', color: 'text-secondary', bgColor: 'bg-secondary/10', }, { icon: MessageCircle, title: 'Unlock Conversations', - description: 'Each match opens a private chat thread. Talk about your desires in a safe, dedicated space.', + description: 'Each match opens a private chat thread. Discuss topics that matter in a safe, dedicated space.', color: 'text-green-400', bgColor: 'bg-green-400/10', }, @@ -35,7 +35,7 @@ const features = [ { icon: Flame, title: 'Curated Question Packs', - description: 'Explore themed packs from playful to passionate. New packs added regularly to keep things exciting.', + description: 'Explore themed packs covering communication, goals, values, and more. New packs added regularly.', color: 'text-orange-400', bgColor: 'bg-orange-400/10', }, @@ -63,10 +63,10 @@ export default function Features() { >

Everything You Need to{' '} - Explore Together + Grow Together

- Sauci creates a safe space for couples to discover their shared desires without fear of judgment. + Sauci creates a safe space for couples to understand each other better and strengthen their relationship.

diff --git a/apps/web/components/Hero.tsx b/apps/web/components/Hero.tsx index 615f56b..bedbb79 100644 --- a/apps/web/components/Hero.tsx +++ b/apps/web/components/Hero.tsx @@ -3,8 +3,8 @@ import { useEffect, useState } from 'react' import Image from 'next/image' import { motion } from 'framer-motion' -import { Sparkles, Play } from 'lucide-react' - +import { Sparkles, Play } from 'lucide-react' + export default function Hero() { const [hasScrolled, setHasScrolled] = useState(false) @@ -45,21 +45,21 @@ export default function Hero() {

- Discover What You{' '} - Both Desire + Grow Closer{' '} + Together

- Swipe on intimate questions with your partner. When you both say yes, - it's a match. Start conversations you've always wanted to have. + Answer thoughtful questions with your partner. When you both agree, + it's a match. Start meaningful conversations that strengthen your bond.

-
- +
+ {/* Official App Store Badge */} - - - - - - - - GET IT ON - Google Play - - - - - See How It Works - - + + + + + + + GET IT ON + Google Play + + + + + See How It Works + +
diff --git a/apps/web/components/HowItWorks.tsx b/apps/web/components/HowItWorks.tsx index 5643030..d5c0f6b 100644 --- a/apps/web/components/HowItWorks.tsx +++ b/apps/web/components/HowItWorks.tsx @@ -20,7 +20,7 @@ const steps: Array<{ { number: '02', title: 'Browse Question Packs', - description: 'Choose from curated packs ranging from romantic to adventurous. Each pack contains thoughtful questions.', + description: 'Choose from curated packs covering communication, life goals, and relationship growth.', icon: Layers, color: 'text-secondary', }, @@ -34,7 +34,7 @@ const steps: Array<{ { number: '04', title: 'Discover Your Matches', - description: 'When both partners answer positively, it\'s a match! Explore your shared desires through private chats.', + description: 'When both partners answer positively, it\'s a match! Discuss what matters most through private chats.', icon: Heart, color: 'text-pink-400', }, @@ -60,7 +60,7 @@ export default function HowItWorks() { How Sauci Works

- Four simple steps to deeper connection and discovery with your partner. + Four simple steps to better communication and a stronger relationship.

diff --git a/apps/web/components/Pricing.tsx b/apps/web/components/Pricing.tsx index a3c64a3..d7e4952 100644 --- a/apps/web/components/Pricing.tsx +++ b/apps/web/components/Pricing.tsx @@ -1,14 +1,14 @@ -'use client' - -import { useEffect, useState } from 'react' -import { motion } from 'framer-motion' -import { Check, Crown, Heart, Sparkles, Infinity } from 'lucide-react' - -const APP_STORE_URL = 'https://apps.apple.com/gb/app/sauci-couple-games-romance/id6757159885' -const PLAY_STORE_URL = 'https://play.google.com/store/apps/details?id=com.sauci.app' - -const features = [ - +'use client' + +import { useEffect, useState } from 'react' +import { motion } from 'framer-motion' +import { Check, Crown, Heart, Sparkles, Infinity } from 'lucide-react' + +const APP_STORE_URL = 'https://apps.apple.com/gb/app/sauci-couple-games-romance/id6757159885' +const PLAY_STORE_URL = 'https://play.google.com/store/apps/details?id=com.sauci.app' + +const features = [ + 'Unlock all question packs', 'Access exclusive premium content', 'New packs added regularly', @@ -16,18 +16,18 @@ const features = [ 'One-time setup, shared benefits', ] -export default function Pricing() { - const [downloadUrl, setDownloadUrl] = useState(APP_STORE_URL) - - useEffect(() => { - const userAgent = navigator.userAgent || '' - if (/Android/i.test(userAgent)) { - setDownloadUrl(PLAY_STORE_URL) - } - }, []) - - return ( - +export default function Pricing() { + const [downloadUrl, setDownloadUrl] = useState(APP_STORE_URL) + + useEffect(() => { + const userAgent = navigator.userAgent || '' + if (/Android/i.test(userAgent)) { + setDownloadUrl(PLAY_STORE_URL) + } + }, []) + + return ( +
{/* Background */}
@@ -47,7 +47,7 @@ export default function Pricing() { Upgrade to Sauci Pro

- Unlock the full experience and explore every dimension of your relationship together. + Unlock the full experience and discover new ways to connect with your partner.

@@ -128,16 +128,16 @@ export default function Pricing() { {/* CTA */}
- - - Get Sauci Pro - - + + + Get Sauci Pro + +

Upgrade anytime from within the app