From a0e53325f7f520c8e33ed10069742838c11ce5cb Mon Sep 17 00:00:00 2001 From: kbe Date: Fri, 5 Sep 2025 00:15:59 +0200 Subject: [PATCH] Translate links and buttons in hardcoded french --- .../design_iterations/dashboard_1.html | 398 ----- .../design_iterations/dashboard_4.html | 529 ------ .../design_iterations/dashboard_5.html | 556 ------ .../design_iterations/dashboard_6.html | 642 ------- .../enhanced_aperonight_components.html | 1524 ----------------- .../enhanced_aperonight_home_with_finder.html | 1189 ------------- .../enhanced_aperonight_theme.css | 618 ------- .../design_iterations/neo_brutalist_home.html | 627 ------- .../design_iterations/neo_brutalist_theme.css | 417 ----- app/helpers/lucide_helper.rb | 82 + .../controllers/lucide_controller.js | 68 + app/views/devise/passwords/new.html.erb | 10 +- app/views/devise/registrations/new.html.erb | 21 +- app/views/devise/sessions/new.html.erb | 20 +- app/views/devise/shared/_links.html.erb | 12 +- 15 files changed, 179 insertions(+), 6534 deletions(-) delete mode 100644 .superdesign/design_iterations/dashboard_1.html delete mode 100644 .superdesign/design_iterations/dashboard_4.html delete mode 100644 .superdesign/design_iterations/dashboard_5.html delete mode 100644 .superdesign/design_iterations/dashboard_6.html delete mode 100755 .superdesign/design_iterations/enhanced_aperonight_components.html delete mode 100755 .superdesign/design_iterations/enhanced_aperonight_home_with_finder.html delete mode 100755 .superdesign/design_iterations/enhanced_aperonight_theme.css delete mode 100755 .superdesign/design_iterations/neo_brutalist_home.html delete mode 100755 .superdesign/design_iterations/neo_brutalist_theme.css create mode 100644 app/helpers/lucide_helper.rb create mode 100644 app/javascript/controllers/lucide_controller.js diff --git a/.superdesign/design_iterations/dashboard_1.html b/.superdesign/design_iterations/dashboard_1.html deleted file mode 100644 index 14e285f..0000000 --- a/.superdesign/design_iterations/dashboard_1.html +++ /dev/null @@ -1,398 +0,0 @@ - - - - - - Dashboard - Modern Card-Based Design - - - - - - - -
-
- - -
-
-
-

Tableau de bord

-

Gérez vos événements et réservations

-
-
- - -
-
- - -
- -
-
-
-

Mes réservations

-

5

-
- +12% - ce mois -
-
-
- -
-
-
- - -
-
-
-

Événements aujourd'hui

-

3

-
- 2 nouveaux -
-
-
- -
-
-
- - -
-
-
-

Événements demain

-

7

-
- Populaire -
-
-
- -
-
-
- - -
-
-
-

À venir

-

15

-
- Cette semaine -
-
-
- -
-
-
-
-
- - -
-
-
- -
-
-

Billets en attente de paiement

-

Vous avez des billets qui nécessitent un paiement

- - -
-
-
-

Soirée Jazz au Sunset

-

- - 15 Septembre 2024 à 20:00 -

-
- - 2 billets - -
- -
-
- Standard - Marie Dubois -
- Expire dans 25min - €35 -
-
-
- Standard - Pierre Martin -
- Expire dans 25min - €35 -
-
-
- -
-
- Tentatives: 1/3 - ⚠️ Expire bientôt -
- -
-
-
-
-
- - -
- - -
-
-

Mes événements réservés

- -
- -
- -
-
- -
-
-

Concert Rock Alternative

-

Aujourd'hui 21:00 • Salle Pleyel

-
-
- Confirmé -
-
- -
-
- -
-
-

Networking Tech

-

Demain 19:00 • WeWork République

-
-
- À venir -
-
- -
-
- -
-
-

Brunch du Dimanche

-

Dimanche 11:00 • Café de Flore

-
-
- En attente -
-
-
- -
- -
-
- - -
-
-

Événements du jour

- -
- -
- -
-
- -
-
-

Festival de Cinéma

-

MK2 Bibliothèque • 20:30

-
- Populaire - €25 -
-
- -
- -
-
- -
-
-

Cours de Cuisine

-

École Ducasse • 14:00

-
- Limité - €85 -
-
- -
- -
-
- -
-
-

Exposition Photo

-

Galerie Perrotin • 10:00

-
- Gratuit -
-
- -
-
-
-
- - -
-
-
-

Autres événements à venir

-
- - -
-
- -
- -
-
- -
-

Concert Électro

-

Samedi 21 Sept • Berghain

-
- €45 - -
-
- -
-
- -
-

Marché Bio

-

Dimanche 22 Sept • Place des Vosges

-
- Gratuit - -
-
- -
-
- -
-

Salon du Livre

-

Lundi 23 Sept • Grand Palais

-
- €15 - -
-
-
- - -
- - - - - -
-
-
- -
-
- - - - \ No newline at end of file diff --git a/.superdesign/design_iterations/dashboard_4.html b/.superdesign/design_iterations/dashboard_4.html deleted file mode 100644 index f38e6f8..0000000 --- a/.superdesign/design_iterations/dashboard_4.html +++ /dev/null @@ -1,529 +0,0 @@ - - - - - - Dashboard - Mobile-First Responsive - - - - - - - -
-
-
-

Dashboard

-

Bonjour Marie 👋

-
-
- - -
-
- - -
-
-
- -
-
-

Action urgente

-

Billets expirent dans 25min

- -
-
-
- - -
-
-
- - Réservations -
-

5

-

+2 ce mois

-
- -
-
- - Aujourd'hui -
-

3

-

événements

-
- -
-
- - Demain -
-

7

-

événements

-
- -
-
- - À venir -
-

15

-

cette semaine

-
-
-
- - -
- - -
-
-

Mes événements

- -
- - -
-
-
- -
-
-

Concert Rock Alternative

-

Aujourd'hui 21:00

-
-
- Confirmé -
-
- -
-
- -
-
-

Networking Tech

-

Demain 19:00

-
-
- À venir -
-
- -
-
- -
-
-

Brunch du Dimanche

-

Dimanche 11:00

-
-
- En attente -
-
-
-
- - -
-
-

Aujourd'hui

- -
- - -
-
-
-
-
- -
-
-

Festival de Cinéma

-

20:30 • MK2

-
-
- €25 -
- -
- -
-
-
-
- -
-
-

Cours de Cuisine

-

14:00 • École Ducasse

-
-
- €85 -
- -
- -
-
-
-
- -
-
-

Exposition Photo

-

10:00 • Galerie

-
-
- Gratuit -
- -
-
-
- - -
- - - -
- - -
-
-

Prochains événements

- -
- -
- -
-
- -
-
-
-

Concert Électro

- €45 -
-

Samedi 21 Sept • Berghain

-
- 12 places - -
-
-
- -
-
- -
-
-
-

Marché Bio

- Gratuit -
-

Dimanche 22 Sept • Place des Vosges

-
- Accès libre - -
-
-
- -
-
- -
-
-
-

Salon du Livre

- €15 -
-

Lundi 23 Sept • Grand Palais

-
- Populaire - -
-
-
-
-
- - - - -
- - - - - -
-
- - - - - -
-
- - - - - - - - - - \ No newline at end of file diff --git a/.superdesign/design_iterations/dashboard_5.html b/.superdesign/design_iterations/dashboard_5.html deleted file mode 100644 index bec8cc5..0000000 --- a/.superdesign/design_iterations/dashboard_5.html +++ /dev/null @@ -1,556 +0,0 @@ - - - - - - Dashboard - Neo-Brutalism Style - - - - - - - - -
-
-
-
-
-

DASHBOARD

-

USER CONTROL PANEL v2.1

-
-
- - -
-
-
-
- -
- - -
-
-
-
- -
-
-

PAYMENT ALERT!

-

2 TICKETS EXPIRE IN 25 MINUTES

- -
-
-
- SOIRÉE JAZZ AU SUNSET -

2 TICKETS • ATTEMPT 1/3

-
- €70 -
-
-
-
- -
-
- - -
-
-
- - BOOKINGS -
-
05
-
+2 THIS MONTH
-
- -
-
- - TODAY -
-
03
-
EVENTS
-
- -
-
- - TOMORROW -
-
07
-
EVENTS
-
- -
-
- - UPCOMING -
-
15
-
THIS WEEK
-
-
- - -
- - -
-
-

MY EVENTS

- -
- -
-
-
-
-

CONCERT ROCK ALTERNATIVE

-

TODAY 21:00 • SALLE PLEYEL

-
- CONFIRMED -
-
-
- - 156 -
-
- - 4.7 -
-
-
- -
-
-
-

NETWORKING TECH

-

TOMORROW 19:00 • WEWORK

-
- TOMORROW -
-
-
-
- 42/50 PARTICIPANTS -
- -
-
-
-

BRUNCH DU DIMANCHE

-

SUNDAY 11:00 • CAFÉ DE FLORE

-
- PENDING -
-
-
-
- - -
-
-

TODAY'S EVENTS

- -
- -
-
-
-
-
-
-
- -
-
-

FESTIVAL CINÉMA

-

20:30 • MK2 BIBLIO

-
-
- €25 -
- -
-
- -
- -
-
-
-
- -
-
-

COOKING CLASS

-

14:00 • ÉCOLE DUCASSE

-
-
- €85 -
- -
-
- -
- -
-
-
-
- -
-
-

PHOTO EXPO

-

10:00 • GALERIE PERROTIN

-
-
- FREE -
- -
-
-
-
-
- - -
-

USER STATISTICS

- -
- -
-

PERFORMANCE METRICS

-
-
- SUCCESS RATE -
-
-
-
- 94% -
-
- -
- ENGAGEMENT -
-
-
-
- 78% -
-
- -
- SATISFACTION -
-
-
-
- 89% -
-
-
-
- - -
-

QUICK STATS

-
-
-
- TOTAL EVENTS - 127 -
-
- -
-
- PARTICIPANTS - 2,456 -
-
- -
-
- RATING - 4.8/5 -
-
- -
-
- REVENUE - €12,340 -
-
-
-
-
-
- - -
-
-

UPCOMING EVENTS

-
- - -
-
- -
- -
-
- -
HOT!
-
-
-

CONCERT ÉLECTRO

-

SAT 21 SEPT • BERGHAIN

-
- €45 - -
-
-
- - -
-
- -
ECO
-
-
-

MARCHÉ BIO

-

SUN 22 SEPT • PLACE VOSGES

-
- FREE - -
-
-
- - -
-
- -
NEW
-
-
-

SALON DU LIVRE

-

MON 23 SEPT • GRAND PALAIS

-
- €15 - -
-
-
-
-
- - -
- - - - - -
- -
- - - - - - - \ No newline at end of file diff --git a/.superdesign/design_iterations/dashboard_6.html b/.superdesign/design_iterations/dashboard_6.html deleted file mode 100644 index 251e20d..0000000 --- a/.superdesign/design_iterations/dashboard_6.html +++ /dev/null @@ -1,642 +0,0 @@ - - - - - - Dashboard - Hybrid Minimalist + Data Visualization - - - - - - - -
- - - - -
- - -
-

Bonjour, Marie

-

Voici un aperçu de vos activités et événements

-
- - -
-
-
-
- -
-
-

Action requise

-

2 billets en attente de paiement expirent dans 25 minutes

- - -
-
-
- Soirée Jazz au Sunset - 2 billets • €70 -
- 1/3 tentatives -
-
-
-
- -
-
- - -
-
-
- Réservations - -
-
05
-
+2 ce mois
-
- -
-
- Aujourd'hui - -
-
03
-
événements
-
- -
-
- Demain - -
-
07
-
événements
-
- -
-
- À venir - -
-
15
-
cette semaine
-
-
- - -
- -
-
-
-

Taux de participation

-

87%

-
-
- - - - -
- -
-
-
-
- +5% - vs. mois dernier -
-
- - -
-
-
-

Événements créés

-

12

-
-
- - - - -
- -
-
-
-
- +3 - ce mois -
-
- - -
-
-
-

Revenus

-

€2,340

-
-
- - - - -
- -
-
-
-
- +18% - vs. mois dernier -
-
- - -
-
-
-

Satisfaction

-

4.8

-
-
- - - - -
- -
-
-
-
- +0.2 - vs. mois dernier -
-
-
- - -
- - -
-
-

Participation aux événements

-
- - - -
-
-
- -
-
- - -
-

Catégories d'événements

-
- -
-
-
-
- Concert (40%) -
-
-
- Cuisine (25%) -
-
-
- Tech (20%) -
-
-
- Art (15%) -
-
-
-
- - -
- - -
-
-
-

Timeline des événements

- -
- -
-
- -
- -
-
-
-
-

Concert Rock Alternative

-

Aujourd'hui 21:00 • Salle Pleyel

-
-
- - 156 participants -
-
- - 4.7/5 -
-
-
- CONFIRMÉ -
-
-
- -
-
-
-
-

Networking Tech

-

Demain 19:00 • WeWork République

-
-
- - 42/50 participants -
-
-
-
-
-
- DEMAIN -
-
-
- -
-
-
-
-

Brunch du Dimanche

-

Dimanche 11:00 • Café de Flore

-
-
- - 8/12 participants -
-
-
-
-
-
- EN COURS -
-
-
- -
-
-
-
-

Cours de Photographie

-

Mercredi 18:00 • Studio Martin

-
-
- - Dans 3 jours -
-
-
- PLANIFIÉ -
-
-
-
-
-
-
- - -
- -
-

Performance

-
-
- Taux de réussite -
-
-
-
- 94% -
-
- -
- Engagement -
-
-
-
- 78% -
-
- -
- Recommandations -
-
-
-
- 89% -
-
-
-
- - -
-

Top catégories

-
-
-
- -
-
-
- Concert - 40% -
-
-
-
-
-
- -
-
- -
-
-
- Cuisine - 25% -
-
-
-
-
-
- -
-
- -
-
-
- Tech - 20% -
-
-
-
-
-
- -
-
- -
-
-
- Art - 15% -
-
-
-
-
-
-
-
- - -
-

Statistiques rapides

-
-
- Événements créés - 127 -
-
- Participants totaux - 2,456 -
-
- Note moyenne - 4.8/5 -
-
- Revenus - €12,340 -
-
-
-
-
-
-
- - - - \ No newline at end of file diff --git a/.superdesign/design_iterations/enhanced_aperonight_components.html b/.superdesign/design_iterations/enhanced_aperonight_components.html deleted file mode 100755 index 4b7332b..0000000 --- a/.superdesign/design_iterations/enhanced_aperonight_components.html +++ /dev/null @@ -1,1524 +0,0 @@ - - - - - - Aperonight Design System - Component Library - - - - - - - - - - - - -
-
-
-

Aperonight Design System

-

A comprehensive collection of reusable components for premium event booking experiences.

- - -
- Home - / - Design System - / - Components -
-
-
-
- -
- -
-

Color Palette

-
-
Brand Colors
-
-
-
-
Primary
-
-
-
-
Accent
-
-
-
-
Success
-
-
-
-
Warning
-
-
-
-
Danger
-
-
-
-
- - -
-

Typography

-
-
-

Heading 1 - Hero Title

-

Heading 2 - Section Title

-

Heading 3 - Subsection

-

Heading 4 - Component Title

-

Bold text and regular paragraph text with good readability and proper line spacing for optimal user experience.

-

Small text for captions and metadata information.

-
-
-
- - -
-

Buttons

-
-
-
Primary Buttons
-
- - - -
-
- -
-
Secondary Buttons
-
- - - -
-
- -
-
Outline Buttons
-
- - - -
-
- -
-
Icon Buttons
-
- - - -
-
-
-
- - -
-

Badges & Status Indicators

-
-
-
Event Status Badges
-
- Available - Limited - Sold Out - ★ Featured - VIP -
-
- -
-
Notification Badges
-
-
- - 3 -
-
- - -
-
-
-
-
- - -
-

Cards

-
-
-
-

Basic Card

-

Simple card with header and content

-
-
-

This is a basic card component that can be used for various content types. It includes proper spacing and hover effects.

- -
-
- -
- Event -
-
- ★ Featured - Available -
-

Networking Event

-

Join professionals for an evening of networking and insights.

-
- €35 - -
-
-
- -
-
User Profile Card
-
-
- User -
-
-
-

Alex Johnson

-

Senior Developer

-
- - - - - - 4.2 -
-
-
-
- - -
-
-
-
- - -
-

Form Elements

-
-
-
Input Fields
-
-
- - -
- -
- - -
- -
- - -
- -
- -
- -
-
- - -
-
-
-
- -
-
Form Validation
-
-
- - -
- - Email is valid -
-
- -
- - -
- - Password must be at least 8 characters -
-
- -
- - -
- - Please complete phone number -
-
-
-
-
-
- - -
-

Notifications & Alerts

-
-
-
- - Event successfully created! Your attendees will receive confirmation emails. -
- -
- - Only 5 spots remaining for this event. Book quickly to secure your place. -
- -
- - Payment failed. Please check your card details and try again. -
- -
- - New features available! Check out our improved event discovery tools. -
-
-
-
- - -
-

Navigation & Tabs

-
-
Tab Navigation
-
-
- - - - -
-
- -
-
- -
-

You have 3 upcoming events

-

Next event starts in 2 days

-
-
-
- -
-
- -
-

12 events attended

-

Great networking history!

-
-
-
- -
-
- -
-

5 saved events

-

Events you're interested in

-
-
-
- -
-
- -
-

2 events hosting

-

Active event host

-
-
-
-
-
- - -
-

Interactive Elements

-
-
-
Tooltips
-
-
- -
This is a helpful tooltip
-
-
- -
Configure your preferences
-
-
-
- -
-
Progress Indicators
-
-
-
- Event Setup - 75% -
-
-
-
-
- -
-
- Registrations - 45/60 -
-
-
-
-
-
-
- -
-
Loading States
-
- -
-
-
-
-
- -
-
- -
-
Avatar Groups
-
-
-
Event Attendees
-
-
- User 1 -
-
-
- User 2 -
-
-
JD
-
+5
-
-
- -
-
Small Avatars
-
-
AB
-
CD
-
EF
-
-
-
-
-
-
- - -
-

Data Display

-
-
-
Price Tags
-
-
€15
-
€35
-
€55
-
- €60 - €45 -
-
-
- -
-
Ratings
-
-
- - - - - - 5.0 - (24 reviews) -
- -
- - - - - - 4.2 -
- -
- - - - - - 3.5 -
-
-
- -
-
Statistics
-
-
-
42
-
Events
-
-
-
1.2K
-
Attendees
-
-
-
- -
-
Key-Value Lists
-
-
- Date - March 15, 2024 -
-
- Duration - 3 hours -
-
- Capacity - 50 people -
-
- Price - €35 -
-
-
-
-
- - -
-

Spacing System

-
-
-
- --space-1 (4px) -
-
-
- --space-2 (8px) -
-
-
- --space-4 (16px) -
-
-
- --space-8 (32px) -
-
-
- --space-12 (48px) -
-
-
- --space-16 (64px) -
-
-
-
-
-
- - - - - - - - - - \ No newline at end of file diff --git a/.superdesign/design_iterations/enhanced_aperonight_home_with_finder.html b/.superdesign/design_iterations/enhanced_aperonight_home_with_finder.html deleted file mode 100755 index 30abdb4..0000000 --- a/.superdesign/design_iterations/enhanced_aperonight_home_with_finder.html +++ /dev/null @@ -1,1189 +0,0 @@ - - - - - - Aperonight - Discover Premium Afterwork Events - - - - - - - - - - - - -
-
-
-

Discover Premium Afterwork Events

-

Connect with professionals, explore unique venues, and create memorable experiences at carefully curated afterwork events in your city.

- -
- - -
- -
-
- 150+ - Events Monthly -
-
- 5.2K - Active Members -
-
- 200+ - Partner Venues -
-
- 98% - Satisfaction -
-
-
-
-
- - -
-
-
-
-

Find Your Perfect Event

-

Discover afterwork parties tailored to your preferences

-
- -
-
- - -
- -
- - -
- -
- - -
- -
- -
- - to - -
-
- - -
-
-
-
- - - - - -
-
-
-

Why Choose Aperonight?

-

We curate premium experiences that connect professionals and create lasting relationships.

-
- -
-
-
- -
-

Premium Curation

-

Every event is carefully selected and designed to provide exceptional value and networking opportunities.

-
- -
-
- -
-

Secure & Trusted

-

Safe payments, verified venues, and trusted community with comprehensive insurance coverage.

-
- -
-
- -
-

Quality Networking

-

Connect with verified professionals, entrepreneurs, and industry leaders in intimate settings.

-
- -
-
- -
-

Instant Booking

-

Seamless reservation process with instant confirmation and easy event management.

-
-
-
-
- - -
-
-
-
- 150+ -
Monthly Events
-
-
- 5.2K -
Active Members
-
-
- 200+ -
Partner Venues
-
-
- 98% -
Satisfaction Rate
-
-
-
-
- - -
-
-
-

Ready to Join the Community?

-

Start discovering amazing events and connect with like-minded professionals in your city.

-
- - -
-
-
-
- - - - - - - \ No newline at end of file diff --git a/.superdesign/design_iterations/enhanced_aperonight_theme.css b/.superdesign/design_iterations/enhanced_aperonight_theme.css deleted file mode 100755 index 6ea2303..0000000 --- a/.superdesign/design_iterations/enhanced_aperonight_theme.css +++ /dev/null @@ -1,618 +0,0 @@ -/* Enhanced Aperonight Design System - Event Booking Optimized */ -:root { - /* Enhanced Purple gradient system with more depth */ - --color-primary-50: #faf5ff; - --color-primary-100: #f3e8ff; - --color-primary-200: #e9d5ff; - --color-primary-300: #d8b4fe; - --color-primary-400: #c084fc; - --color-primary-500: #a855f7; - --color-primary-600: #9333ea; - --color-primary-700: #7e22ce; - --color-primary-800: #6b21a8; - --color-primary-900: #581c87; - --color-primary-950: #3b0764; /* Added for deeper contrast */ - - /* Enhanced Pink gradient for event highlights */ - --color-accent-300: #f9a8d4; - --color-accent-400: #f472b6; - --color-accent-500: #ec4899; - --color-accent-600: #db2777; - --color-accent-700: #be185d; /* Added for better hierarchy */ - - /* Enhanced Neutral system with warmer tones */ - --color-neutral-50: #f8fafc; - --color-neutral-100: #f1f5f9; - --color-neutral-200: #e2e8f0; - --color-neutral-300: #cbd5e1; - --color-neutral-400: #94a3b8; - --color-neutral-500: #64748b; - --color-neutral-600: #475569; - --color-neutral-700: #334155; - --color-neutral-800: #1e293b; - --color-neutral-900: #0f172a; - --color-neutral-950: #020617; /* Added for deeper backgrounds */ - - /* Event-specific semantic colors */ - --color-success-light: #dcfce7; - --color-success: #16a34a; - --color-success-dark: #15803d; - --color-warning-light: #fef3c7; - --color-warning: #f59e0b; - --color-warning-dark: #d97706; - --color-danger-light: #fee2e2; - --color-danger: #dc2626; - --color-danger-dark: #b91c1c; - - /* Event status colors */ - --color-event-featured: linear-gradient(135deg, var(--color-primary-600) 0%, var(--color-accent-500) 100%); - --color-event-available: var(--color-success); - --color-event-limited: var(--color-warning); - --color-event-sold-out: var(--color-danger); - --color-event-vip: linear-gradient(135deg, #ffd700 0%, #ffb347 100%); - - /* Enhanced Typography with better hierarchy */ - --font-sans: 'Plus Jakarta Sans', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; - --font-display: 'Outfit', var(--font-sans); /* For headings and key content */ - --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, 'SF Mono', monospace; - - /* Enhanced font sizes with golden ratio scaling */ - --text-xs: 0.75rem; /* 12px */ - --text-sm: 0.875rem; /* 14px */ - --text-base: 1rem; /* 16px */ - --text-lg: 1.125rem; /* 18px */ - --text-xl: 1.25rem; /* 20px */ - --text-2xl: 1.5rem; /* 24px */ - --text-3xl: 1.875rem; /* 30px */ - --text-4xl: 2.25rem; /* 36px */ - --text-5xl: 3rem; /* 48px - for hero sections */ - --text-6xl: 3.75rem; /* 60px - for major headings */ - - /* Enhanced spacing system */ - --space-px: 1px; - --space-0-5: 0.125rem; /* 2px */ - --space-1: 0.25rem; /* 4px */ - --space-1-5: 0.375rem; /* 6px */ - --space-2: 0.5rem; /* 8px */ - --space-2-5: 0.625rem; /* 10px */ - --space-3: 0.75rem; /* 12px */ - --space-3-5: 0.875rem; /* 14px */ - --space-4: 1rem; /* 16px */ - --space-5: 1.25rem; /* 20px */ - --space-6: 1.5rem; /* 24px */ - --space-7: 1.75rem; /* 28px */ - --space-8: 2rem; /* 32px */ - --space-9: 2.25rem; /* 36px */ - --space-10: 2.5rem; /* 40px */ - --space-11: 2.75rem; /* 44px */ - --space-12: 3rem; /* 48px */ - --space-14: 3.5rem; /* 56px */ - --space-16: 4rem; /* 64px */ - --space-20: 5rem; /* 80px */ - --space-24: 6rem; /* 96px */ - - /* Enhanced border radius system */ - --radius-none: 0px; - --radius-sm: 0.25rem; /* 4px */ - --radius-md: 0.375rem; /* 6px */ - --radius: 0.5rem; /* 8px */ - --radius-lg: 0.75rem; /* 12px */ - --radius-xl: 1rem; /* 16px */ - --radius-2xl: 1.5rem; /* 24px */ - --radius-3xl: 2rem; /* 32px */ - --radius-full: 9999px; - - /* Enhanced shadow system with color variations */ - --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05); - --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); - --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); - --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); - --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); - --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); - --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25); - --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05); - - /* Purple-tinted shadows for premium feel */ - --shadow-purple-sm: 0 1px 3px 0 rgb(147 51 234 / 0.1), 0 1px 2px -1px rgb(147 51 234 / 0.1); - --shadow-purple-md: 0 4px 6px -1px rgb(147 51 234 / 0.1), 0 2px 4px -2px rgb(147 51 234 / 0.1); - --shadow-purple-lg: 0 10px 15px -3px rgb(147 51 234 / 0.15), 0 4px 6px -4px rgb(147 51 234 / 0.1); - - /* Pink-tinted shadows for event highlights */ - --shadow-pink-sm: 0 1px 3px 0 rgb(236 72 153 / 0.1), 0 1px 2px -1px rgb(236 72 153 / 0.1); - --shadow-pink-md: 0 4px 6px -1px rgb(236 72 153 / 0.1), 0 2px 4px -2px rgb(236 72 153 / 0.1); - - /* Animation durations */ - --duration-fast: 0.15s; - --duration-normal: 0.2s; - --duration-slow: 0.3s; - --duration-slower: 0.5s; - - /* Easing functions */ - --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1); - --ease-out: cubic-bezier(0, 0, 0.2, 1); - --ease-in: cubic-bezier(0.4, 0, 1, 1); - --ease-bounce: cubic-bezier(0.68, -0.55, 0.265, 1.55); -} - -/* Enhanced Component Styles */ - -/* Buttons with improved hierarchy */ -.btn { - display: inline-flex; - align-items: center; - justify-content: center; - gap: var(--space-2); - font-family: var(--font-display); - font-weight: 600; - white-space: nowrap; - transition: all var(--duration-normal) var(--ease-in-out); - cursor: pointer; - border: none; - text-decoration: none; -} - -.btn:disabled { - opacity: 0.5; - cursor: not-allowed; - pointer-events: none; -} - -.btn-sm { - padding: var(--space-2) var(--space-3); - font-size: var(--text-sm); - border-radius: var(--radius-md); -} - -.btn-md { - padding: var(--space-3) var(--space-4); - font-size: var(--text-base); - border-radius: var(--radius); -} - -.btn-lg { - padding: var(--space-4) var(--space-6); - font-size: var(--text-lg); - border-radius: var(--radius-lg); -} - -.btn-primary { - background: linear-gradient(135deg, var(--color-primary-600) 0%, var(--color-accent-500) 100%); - color: white; - box-shadow: var(--shadow-purple-sm); -} - -.btn-primary:hover { - background: linear-gradient(135deg, var(--color-primary-700) 0%, var(--color-accent-600) 100%); - box-shadow: var(--shadow-purple-md); - transform: translateY(-1px); -} - -.btn-primary:active { - transform: translateY(0); - box-shadow: var(--shadow-purple-sm); -} - -.btn-secondary { - background: white; - color: var(--color-primary-600); - border: 1px solid var(--color-neutral-200); - box-shadow: var(--shadow-sm); -} - -.btn-secondary:hover { - background: var(--color-primary-50); - border-color: var(--color-primary-300); - box-shadow: var(--shadow-md); -} - -.btn-outline { - background: transparent; - color: var(--color-primary-600); - border: 2px solid var(--color-primary-600); -} - -.btn-outline:hover { - background: var(--color-primary-600); - color: white; - box-shadow: var(--shadow-purple-sm); -} - -.btn-ghost { - background: transparent; - color: var(--color-neutral-600); - border: none; -} - -.btn-ghost:hover { - background: var(--color-neutral-100); - color: var(--color-primary-600); -} - -/* Enhanced Cards */ -.card { - background: white; - border-radius: var(--radius-xl); - box-shadow: var(--shadow-sm); - border: 1px solid var(--color-neutral-200); - overflow: hidden; - transition: all var(--duration-normal) var(--ease-in-out); -} - -.card:hover { - box-shadow: var(--shadow-lg); - transform: translateY(-2px); -} - -.card-interactive { - cursor: pointer; -} - -.card-interactive:hover { - box-shadow: var(--shadow-xl); - transform: translateY(-4px); - border-color: var(--color-primary-200); -} - -.card-header { - padding: var(--space-6); - border-bottom: 1px solid var(--color-neutral-200); -} - -.card-body { - padding: var(--space-6); -} - -.card-footer { - padding: var(--space-4) var(--space-6); - background: var(--color-neutral-50); - border-top: 1px solid var(--color-neutral-200); -} - -/* Event-specific cards */ -.event-card { - position: relative; - background: white; - border-radius: var(--radius-xl); - box-shadow: var(--shadow-md); - overflow: hidden; - transition: all var(--duration-slow) var(--ease-out); - border: 1px solid var(--color-neutral-200); -} - -.event-card:hover { - box-shadow: var(--shadow-2xl); - transform: translateY(-6px) scale(1.02); -} - -.event-card-featured { - border: 2px solid transparent; - background: linear-gradient(white, white) padding-box, - linear-gradient(135deg, var(--color-primary-600), var(--color-accent-500)) border-box; - box-shadow: var(--shadow-purple-lg); -} - -.event-card-featured::before { - content: ''; - position: absolute; - top: 0; - left: 0; - right: 0; - height: 4px; - background: var(--color-event-featured); -} - -.event-card-image { - aspect-ratio: 16/9; - overflow: hidden; - position: relative; -} - -.event-card-image img { - width: 100%; - height: 100%; - object-fit: cover; - transition: transform var(--duration-slow) var(--ease-out); -} - -.event-card:hover .event-card-image img { - transform: scale(1.05); -} - -/* Enhanced Forms */ -.form-group { - margin-bottom: var(--space-6); -} - -.form-label { - display: block; - font-size: var(--text-sm); - font-weight: 600; - color: var(--color-neutral-700); - margin-bottom: var(--space-2); - font-family: var(--font-display); -} - -.form-input, -.form-select, -.form-textarea { - width: 100%; - padding: var(--space-3) var(--space-4); - font-size: var(--text-base); - color: var(--color-neutral-900); - background: white; - border: 1px solid var(--color-neutral-300); - border-radius: var(--radius-lg); - transition: all var(--duration-normal) var(--ease-in-out); - font-family: var(--font-sans); -} - -.form-input:focus, -.form-select:focus, -.form-textarea:focus { - outline: none; - border-color: var(--color-primary-500); - box-shadow: 0 0 0 3px rgb(168 85 247 / 0.1); - background: var(--color-primary-50); -} - -.form-error { - color: var(--color-danger); - font-size: var(--text-sm); - margin-top: var(--space-1); - display: flex; - align-items: center; - gap: var(--space-1); -} - -/* Enhanced Badges */ -.badge { - display: inline-flex; - align-items: center; - gap: var(--space-1); - padding: var(--space-1-5) var(--space-3); - font-size: var(--text-xs); - font-weight: 700; - text-transform: uppercase; - letter-spacing: 0.05em; - border-radius: var(--radius-full); - font-family: var(--font-display); -} - -.badge-available { - background: var(--color-success-light); - color: var(--color-success-dark); -} - -.badge-limited { - background: var(--color-warning-light); - color: var(--color-warning-dark); - animation: pulse 2s infinite; -} - -.badge-sold-out { - background: var(--color-danger-light); - color: var(--color-danger-dark); -} - -.badge-featured { - background: linear-gradient(135deg, var(--color-primary-100), var(--color-accent-100)); - color: var(--color-primary-800); - border: 1px solid var(--color-primary-200); -} - -.badge-vip { - background: linear-gradient(135deg, #fef3c7, #fde68a); - color: #92400e; - border: 1px solid #fbbf24; - box-shadow: var(--shadow-xs); -} - -/* Enhanced Navigation */ -.nav { - background: rgba(255, 255, 255, 0.95); - backdrop-filter: blur(20px); - border-bottom: 1px solid var(--color-neutral-200); - box-shadow: var(--shadow-sm); - position: sticky; - top: 0; - z-index: 50; -} - -.nav-link { - display: inline-flex; - align-items: center; - gap: var(--space-2); - padding: var(--space-3) var(--space-4); - font-weight: 500; - color: var(--color-neutral-600); - text-decoration: none; - border-radius: var(--radius-lg); - transition: all var(--duration-normal) var(--ease-in-out); - font-family: var(--font-display); -} - -.nav-link:hover, -.nav-link.active { - color: var(--color-primary-600); - background: var(--color-primary-50); - box-shadow: var(--shadow-sm); -} - -/* Enhanced Layout */ -.container { - max-width: 1280px; - margin: 0 auto; - padding: 0 var(--space-4); -} - -@media (min-width: 640px) { - .container { padding: 0 var(--space-6); } -} - -@media (min-width: 1024px) { - .container { padding: 0 var(--space-8); } -} - -.grid-responsive { - display: grid; - gap: var(--space-6); - grid-template-columns: 1fr; -} - -@media (min-width: 640px) { - .grid-responsive { grid-template-columns: repeat(2, 1fr); } -} - -@media (min-width: 1024px) { - .grid-responsive { grid-template-columns: repeat(3, 1fr); } -} - -.grid-events { - display: grid; - gap: var(--space-8); - grid-template-columns: 1fr; -} - -@media (min-width: 640px) { - .grid-events { grid-template-columns: repeat(2, 1fr); } -} - -@media (min-width: 1024px) { - .grid-events { grid-template-columns: repeat(3, 1fr); } -} - -@media (min-width: 1280px) { - .grid-events { grid-template-columns: repeat(4, 1fr); } -} - -/* Enhanced animations */ -@keyframes fadeInUp { - from { - opacity: 0; - transform: translateY(20px); - } - to { - opacity: 1; - transform: translateY(0); - } -} - -@keyframes slideInRight { - from { - opacity: 0; - transform: translateX(20px); - } - to { - opacity: 1; - transform: translateX(0); - } -} - -@keyframes pulse { - 0%, 100% { - opacity: 1; - } - 50% { - opacity: 0.7; - } -} - -@keyframes shimmer { - 0% { - background-position: -200% 0; - } - 100% { - background-position: 200% 0; - } -} - -.animate-fadeInUp { - animation: fadeInUp 0.6s var(--ease-out); -} - -.animate-slideInRight { - animation: slideInRight 0.4s var(--ease-out); -} - -.animate-pulse { - animation: pulse 2s infinite; -} - -.loading-shimmer { - background: linear-gradient(90deg, var(--color-neutral-100) 25%, var(--color-neutral-200) 50%, var(--color-neutral-100) 75%); - background-size: 200% 100%; - animation: shimmer 2s infinite; -} - -/* Enhanced hover effects */ -.hover-lift { - transition: transform var(--duration-normal) var(--ease-out); -} - -.hover-lift:hover { - transform: translateY(-2px); -} - -.hover-glow { - transition: all var(--duration-normal) var(--ease-out); -} - -.hover-glow:hover { - box-shadow: var(--shadow-purple-lg); - filter: brightness(1.05); -} - -/* Focus states with better accessibility */ -.focus-ring { - transition: all var(--duration-fast) var(--ease-out); -} - -.focus-ring:focus { - outline: none; - box-shadow: 0 0 0 3px rgb(168 85 247 / 0.2); -} - -/* Dark mode enhancements */ -@media (prefers-color-scheme: dark) { - :root { - --color-background: var(--color-neutral-900); - --color-surface: var(--color-neutral-800); - --color-border: var(--color-neutral-700); - --color-text-primary: var(--color-neutral-50); - --color-text-secondary: var(--color-neutral-300); - --color-text-muted: var(--color-neutral-500); - } - - .card { - background: var(--color-neutral-800); - border-color: var(--color-neutral-700); - } - - .form-input, - .form-select, - .form-textarea { - background: var(--color-neutral-700); - border-color: var(--color-neutral-600); - color: var(--color-neutral-100); - } - - .nav { - background: rgba(30, 41, 59, 0.95); - border-bottom-color: var(--color-neutral-700); - } -} - -/* Print styles */ -@media print { - .btn, - .nav, - .card:hover { - box-shadow: none !important; - transform: none !important; - } - - .event-card { - break-inside: avoid; - margin-bottom: var(--space-4); - } -} \ No newline at end of file diff --git a/.superdesign/design_iterations/neo_brutalist_home.html b/.superdesign/design_iterations/neo_brutalist_home.html deleted file mode 100755 index 380f8b5..0000000 --- a/.superdesign/design_iterations/neo_brutalist_home.html +++ /dev/null @@ -1,627 +0,0 @@ - - - - - - APERONIGHT - RADICAL EVENT BOOKING - - - - - - - - -
- - - - - -
-
-

RADICAL EVENTS

-

BREAK THE BORING. JOIN THE REVOLUTION. EXPERIENCE EVENTS THAT MATTER.

-
- -
- -
-
-
- - -
-
-

FEATURED CHAOS

-
-
- TECH CHAOS -
-

TECH CHAOS NIGHT

-
- - THU MAR 15 • 6PM -
-

SMASH NETWORKING BARRIERS. CODE. DRINKS. CHAOS. REPEAT.

-
- €25 -
- LIVE - -
-
-
-
- -
- SOUND ASSAULT -
-

SOUND ASSAULT

-
- - SAT MAR 18 • 8PM -
-

UNDERGROUND BEATS. ROOF ACCESS. CITY DOMINATION.

-
- €35 -
- ★ HOT - -
-
-
-
- -
- ART REBELLION -
-

ART REBELLION

-
- - FRI MAR 22 • 7PM -
-

DESTROY CONVENTIONS. CREATE CHAOS. WINE INCLUDED.

-
- €20 -
- DANGER - -
-
-
-
-
-
- -
-
-
- - -
-
-

WHY WE RULE

-
-
-
- -
-

CURATED MADNESS

-

HANDPICKED EVENTS THAT DESTROY BORING AND CREATE LEGENDS.

-
-
-
- -
-

BULLETPROOF BOOKING

-

SECURE PAYMENTS. INSTANT TICKETS. NO BULLSHIT REFUNDS.

-
-
-
- -
-

ZERO FRICTION

-

FIND EVENT. BOOK TICKET. DESTROY EXPECTATIONS. REPEAT.

-
-
-
- -
-

TRIBE BUILDING

-

CONNECT WITH REBELS WHO GET IT. BUILD YOUR EMPIRE.

-
-
-
-
- - -
-
-
-
- 50+ -
EVENTS MONTHLY
-
-
- 2.5K -
REBELS JOINED
-
-
- 100+ -
VENUES CONQUERED
-
-
- 95% -
MINDS BLOWN
-
-
-
-
- - - - - - - \ No newline at end of file diff --git a/.superdesign/design_iterations/neo_brutalist_theme.css b/.superdesign/design_iterations/neo_brutalist_theme.css deleted file mode 100755 index 0603d72..0000000 --- a/.superdesign/design_iterations/neo_brutalist_theme.css +++ /dev/null @@ -1,417 +0,0 @@ -/* Neo-Brutalist Design System for Event Booking */ -:root { - /* Colors - Bold and high contrast */ - --background: #ffffff; - --foreground: #000000; - --card: #ffffff; - --card-foreground: #000000; - --popover: #ffffff; - --popover-foreground: #000000; - --primary: #ff6b35; - --primary-foreground: #ffffff; - --secondary: #00f5ff; - --secondary-foreground: #000000; - --muted: #f0f0f0; - --muted-foreground: #333333; - --accent: #ff1744; - --accent-foreground: #ffffff; - --destructive: #000000; - --destructive-foreground: #ffffff; - --border: #000000; - --input: #ffffff; - --ring: #ff6b35; - - /* Event-specific colors - Bold and vibrant */ - --event-featured: #7c4dff; - --event-sold-out: #000000; - --event-available: #00c853; - --ticket-premium: #ffc107; - --ticket-standard: #9e9e9e; - - /* Typography - Bold and impactful */ - --font-sans: 'Space Grotesk', 'Arial Black', sans-serif; - --font-mono: 'Space Mono', 'Courier New', monospace; - - /* Font sizes - Exaggerated scale */ - --text-xs: 0.75rem; - --text-sm: 0.875rem; - --text-base: 1rem; - --text-lg: 1.25rem; - --text-xl: 1.5rem; - --text-2xl: 2rem; - --text-3xl: 2.5rem; - --text-4xl: 3.5rem; - - /* Spacing - Generous */ - --space-1: 0.25rem; - --space-2: 0.5rem; - --space-3: 0.75rem; - --space-4: 1rem; - --space-6: 1.5rem; - --space-8: 2rem; - --space-12: 3rem; - --space-16: 4rem; - --space-20: 5rem; - - /* Border radius - Sharp edges */ - --radius: 0px; - --radius-sm: 0px; - --radius-md: 0px; - --radius-lg: 0px; - --radius-xl: 0px; - - /* Shadows - Bold and offset */ - --shadow-brutal: 8px 8px 0px 0px #000000; - --shadow-brutal-lg: 12px 12px 0px 0px #000000; - --shadow-brutal-xl: 16px 16px 0px 0px #000000; - --shadow-brutal-color: 8px 8px 0px 0px var(--accent); - --shadow-inset: inset 4px 4px 0px 0px rgba(0,0,0,0.2); -} - -/* Typography overrides */ -h1, h2, h3, h4, h5, h6 { - font-family: var(--font-sans) !important; - font-weight: 900 !important; - text-transform: uppercase !important; - letter-spacing: -0.02em !important; -} - -h1 { font-size: var(--text-4xl) !important; } -h2 { font-size: var(--text-3xl) !important; } -h3 { font-size: var(--text-2xl) !important; } - -/* Component styles */ -.btn-primary { - background: var(--primary); - color: var(--primary-foreground); - padding: 16px 32px; - border-radius: var(--radius); - font-weight: 900; - border: 3px solid var(--border); - cursor: pointer; - transition: all 0.1s ease; - box-shadow: var(--shadow-brutal); - font-family: var(--font-sans); - text-transform: uppercase; - letter-spacing: 0.05em; -} - -.btn-primary:hover { - transform: translate(4px, 4px); - box-shadow: 4px 4px 0px 0px #000000; -} - -.btn-primary:active { - transform: translate(8px, 8px); - box-shadow: none; -} - -.btn-secondary { - background: var(--secondary); - color: var(--secondary-foreground); - padding: 16px 32px; - border-radius: var(--radius); - font-weight: 900; - border: 3px solid var(--border); - cursor: pointer; - transition: all 0.1s ease; - box-shadow: var(--shadow-brutal); - font-family: var(--font-sans); - text-transform: uppercase; - letter-spacing: 0.05em; -} - -.btn-secondary:hover { - transform: translate(4px, 4px); - box-shadow: 4px 4px 0px 0px #000000; -} - -.btn-destructive { - background: var(--destructive); - color: var(--destructive-foreground); - padding: 16px 32px; - border-radius: var(--radius); - font-weight: 900; - border: 3px solid var(--border); - cursor: pointer; - transition: all 0.1s ease; - box-shadow: var(--shadow-brutal-color); - font-family: var(--font-sans); - text-transform: uppercase; - letter-spacing: 0.05em; -} - -.card { - background: var(--card); - border-radius: var(--radius); - box-shadow: var(--shadow-brutal-lg); - padding: var(--space-8); - border: 4px solid var(--border); - transition: all 0.1s ease; - position: relative; -} - -.card::before { - content: ''; - position: absolute; - top: -4px; - left: -4px; - right: -16px; - bottom: -16px; - background: var(--accent); - z-index: -1; -} - -.card:hover { - transform: translate(4px, 4px); - box-shadow: 8px 8px 0px 0px #000000; -} - -.event-card { - background: var(--card); - border-radius: var(--radius); - overflow: visible; - box-shadow: var(--shadow-brutal-xl); - transition: all 0.1s ease; - border: 4px solid var(--border); - position: relative; -} - -.event-card::after { - content: ''; - position: absolute; - top: -8px; - left: -8px; - right: -24px; - bottom: -24px; - background: repeating-linear-gradient( - 45deg, - transparent, - transparent 10px, - var(--secondary) 10px, - var(--secondary) 20px - ); - z-index: -1; - opacity: 0; - transition: opacity 0.2s ease; -} - -.event-card:hover::after { - opacity: 1; -} - -.event-card:hover { - transform: translate(8px, 8px); - box-shadow: 8px 8px 0px 0px #000000; -} - -.ticket-card { - background: var(--muted); - border-radius: var(--radius); - padding: var(--space-6); - border: 3px solid var(--border); - transition: all 0.1s ease; - box-shadow: var(--shadow-brutal); - position: relative; -} - -.ticket-card.selected { - background: var(--primary); - color: var(--primary-foreground); - transform: translate(4px, 4px); - box-shadow: 4px 4px 0px 0px #000000; -} - -.ticket-card.selected::before { - content: '✓'; - position: absolute; - top: -10px; - right: -10px; - background: var(--accent); - color: white; - width: 30px; - height: 30px; - display: flex; - align-items: center; - justify-content: center; - font-weight: 900; - border: 3px solid var(--border); - box-shadow: 4px 4px 0px 0px #000000; -} - -.form-input { - background: var(--input); - border: 3px solid var(--border); - border-radius: var(--radius); - padding: 16px 20px; - font-size: var(--text-lg); - font-weight: 700; - transition: all 0.1s ease; - box-shadow: var(--shadow-inset); - font-family: var(--font-mono); -} - -.form-input:focus { - outline: none; - border-color: var(--primary); - box-shadow: var(--shadow-brutal-color); - transform: translate(-2px, -2px); -} - -.badge { - display: inline-flex; - align-items: center; - padding: 8px 16px; - border-radius: var(--radius); - font-size: var(--text-sm); - font-weight: 900; - text-transform: uppercase; - letter-spacing: 0.1em; - border: 2px solid var(--border); - box-shadow: 4px 4px 0px 0px #000000; - font-family: var(--font-sans); -} - -.badge-available { - background: var(--event-available); - color: #000000; -} - -.badge-sold-out { - background: var(--event-sold-out); - color: #ffffff; -} - -.badge-featured { - background: var(--event-featured); - color: #ffffff; - animation: pulse-brutal 2s infinite; -} - -.badge-premium { - background: var(--ticket-premium); - color: #000000; - position: relative; -} - -.badge-premium::after { - content: '★'; - margin-left: 8px; - animation: rotate 3s linear infinite; -} - -/* Navigation */ -.nav { - background: var(--background); - border-bottom: 6px solid var(--border); - box-shadow: 0 6px 0px 0px var(--accent); -} - -.nav-link { - color: var(--foreground); - font-weight: 900; - padding: 12px 20px; - border-radius: var(--radius); - transition: all 0.1s ease; - text-decoration: none; - text-transform: uppercase; - letter-spacing: 0.05em; - border: 3px solid transparent; - font-family: var(--font-sans); -} - -.nav-link:hover, .nav-link.active { - background: var(--primary); - color: var(--primary-foreground); - border-color: var(--border); - box-shadow: 4px 4px 0px 0px #000000; - transform: translate(-2px, -2px); -} - -/* Animations */ -@keyframes pulse-brutal { - 0%, 100% { - transform: scale(1); - box-shadow: 4px 4px 0px 0px #000000; - } - 50% { - transform: scale(1.05); - box-shadow: 6px 6px 0px 0px #000000; - } -} - -@keyframes rotate { - from { transform: rotate(0deg); } - to { transform: rotate(360deg); } -} - -@keyframes shake-brutal { - 0%, 100% { transform: translateX(0); } - 25% { transform: translateX(-8px); } - 75% { transform: translateX(8px); } -} - -.animate-shake { - animation: shake-brutal 0.5s ease-in-out; -} - -/* Special effects */ -.glitch-text { - position: relative; - color: var(--primary); - font-weight: 900; -} - -.glitch-text::before, -.glitch-text::after { - content: attr(data-text); - position: absolute; - top: 0; - left: 0; - overflow: hidden; - clip-path: polygon(0 0, 100% 0, 100% 45%, 0 45%); -} - -.glitch-text::before { - color: var(--accent); - animation: glitch-1 2s infinite; -} - -.glitch-text::after { - color: var(--secondary); - animation: glitch-2 2s infinite; -} - -@keyframes glitch-1 { - 0%, 100% { transform: translateX(0); } - 20% { transform: translateX(-2px); } -} - -@keyframes glitch-2 { - 0%, 100% { transform: translateX(0); } - 20% { transform: translateX(2px); } -} - -/* Responsive design */ -@media (max-width: 768px) { - :root { - --space-4: 0.75rem; - --space-6: 1rem; - --space-8: 1.5rem; - --text-4xl: 2.5rem; - --text-3xl: 2rem; - } - - .btn-primary, .btn-secondary, .btn-destructive { - padding: 12px 24px; - font-size: var(--text-sm); - } - - .card { - padding: var(--space-4); - } - - .shadow-brutal, .shadow-brutal-lg, .shadow-brutal-xl { - box-shadow: 4px 4px 0px 0px #000000; - } -} \ No newline at end of file diff --git a/app/helpers/lucide_helper.rb b/app/helpers/lucide_helper.rb new file mode 100644 index 0000000..cb37661 --- /dev/null +++ b/app/helpers/lucide_helper.rb @@ -0,0 +1,82 @@ +module LucideHelper + # Create a Lucide icon element + # + # @param name [String] The name of the Lucide icon + # @param options [Hash] Additional options + # @option options [String] :class Additional CSS classes + # @option options [String] :size Size class (e.g., 'w-4 h-4', 'w-6 h-6') + # @option options [Hash] :data Additional data attributes + # + # @return [String] HTML string for the icon + # + # Usage: + # lucide_icon('user') + # lucide_icon('check-circle', class: 'text-green-500', size: 'w-5 h-5') + # lucide_icon('menu', data: { action: 'click->header#toggleMenu' }) + def lucide_icon(name, options = {}) + css_classes = ["lucide-icon"] + css_classes << options[:size] if options[:size] + css_classes << options[:class] if options[:class] + + data_attributes = { lucide: name } + data_attributes.merge!(options[:data]) if options[:data] + + content_tag :i, "", + class: css_classes.join(" "), + data: data_attributes, + **options.except(:class, :size, :data) + end + + # Create a button with a Lucide icon + # + # @param name [String] The name of the Lucide icon + # @param options [Hash] Button options + # @option options [String] :text Button text (optional) + # @option options [String] :class Additional CSS classes for button + # @option options [String] :icon_class Additional CSS classes for icon + # @option options [String] :icon_size Size class for icon + # + # Usage: + # lucide_button('plus', text: 'Add Item', class: 'btn btn-primary') + # lucide_button('trash-2', class: 'btn-danger', data: { confirm: 'Are you sure?' }) + def lucide_button(name, options = {}) + text = options.delete(:text) + icon_class = options.delete(:icon_class) + icon_size = options.delete(:icon_size) || 'w-4 h-4' + + icon = lucide_icon(name, class: icon_class, size: icon_size) + + content = if text.present? + safe_join([icon, " ", text]) + else + icon + end + + content_tag :button, content, options + end + + # Create a link with a Lucide icon + # + # @param name [String] The name of the Lucide icon + # @param url [String] The URL for the link + # @param options [Hash] Link options + # + # Usage: + # lucide_link('edit', edit_user_path(user), text: 'Edit') + # lucide_link('external-link', 'https://example.com', text: 'Visit', target: '_blank') + def lucide_link(name, url, options = {}) + text = options.delete(:text) + icon_class = options.delete(:icon_class) + icon_size = options.delete(:icon_size) || 'w-4 h-4' + + icon = lucide_icon(name, class: icon_class, size: icon_size) + + content = if text.present? + safe_join([icon, " ", text]) + else + icon + end + + link_to content, url, options + end +end \ No newline at end of file diff --git a/app/javascript/controllers/lucide_controller.js b/app/javascript/controllers/lucide_controller.js new file mode 100644 index 0000000..9bec9b2 --- /dev/null +++ b/app/javascript/controllers/lucide_controller.js @@ -0,0 +1,68 @@ +import { Controller } from "@hotwired/stimulus" + +// Connects to data-controller="lucide" +export default class extends Controller { + static targets = ["icon"] + + connect() { + this.initializeIcons() + + // Listen for Turbo navigation events to reinitialize icons + document.addEventListener('turbo:render', this.handleTurboRender.bind(this)) + document.addEventListener('turbo:frame-render', this.handleTurboFrameRender.bind(this)) + } + + disconnect() { + // Clean up event listeners + document.removeEventListener('turbo:render', this.handleTurboRender.bind(this)) + document.removeEventListener('turbo:frame-render', this.handleTurboFrameRender.bind(this)) + } + + // Initialize all Lucide icons in the controller scope + initializeIcons() { + if (typeof lucide !== 'undefined') { + // Initialize icons within this controller's element + lucide.createIcons({ + element: this.element + }) + } else { + console.warn('Lucide not loaded yet, retrying...') + // Retry after a short delay if Lucide hasn't loaded yet + setTimeout(() => this.initializeIcons(), 100) + } + } + + // Method to reinitialize icons after dynamic content changes + reinitialize() { + this.initializeIcons() + } + + // Method to create a specific icon programmatically + createIcon(iconName, element = null) { + if (typeof lucide !== 'undefined') { + const targetElement = element || this.element + lucide.createIcons({ + element: targetElement, + icons: { + [iconName]: lucide[iconName] + } + }) + } + } + + // Handle Turbo page renders + handleTurboRender() { + // Small delay to ensure DOM is fully updated + setTimeout(() => this.initializeIcons(), 10) + } + + // Handle Turbo frame renders + handleTurboFrameRender(event) { + // Initialize icons within the specific frame that was rendered + if (event.detail && event.detail.newFrame) { + lucide.createIcons({ + element: event.detail.newFrame + }) + } + } +} \ No newline at end of file diff --git a/app/views/devise/passwords/new.html.erb b/app/views/devise/passwords/new.html.erb index 0bfa10e..d5aa7b0 100755 --- a/app/views/devise/passwords/new.html.erb +++ b/app/views/devise/passwords/new.html.erb @@ -5,17 +5,17 @@ Aperonight <% end %>

- <%= t('devise.passwords.new.title') %> + Mot de passe oublié ?

- <%= t('devise.passwords.new.description') %> + Entrez votre adresse email ci-dessous et nous vous enverrons un lien pour réinitialiser votre mot de passe.

<%= form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :post, class: "mt-8 space-y-6" }) do |f| %>
- <%= f.label :email, class: "block text-sm font-medium text-neutral-700" %> + <%= f.label :email, "Adresse Email", class: "block text-sm font-medium text-neutral-700" %>
<%= f.email_field :email, autofocus: true, autocomplete: "email", class: "appearance-none block w-full px-3 py-2 border border-neutral-300 rounded-md shadow-sm placeholder-neutral-400 focus:outline-none focus:ring-purple-500 focus:border-purple-500 sm:text-sm", @@ -24,7 +24,7 @@
- <%= f.submit t('devise.passwords.new.submit'), + <%= f.submit "Envoyer le lien de réinitialisation", class: "group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-purple-600 hover:bg-purple-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-neutral-50 focus:ring-purple-500" %>
<% end %> @@ -35,7 +35,7 @@
- <%= t('devise.sessions.new.continue_with') %> + Continuer avec
diff --git a/app/views/devise/registrations/new.html.erb b/app/views/devise/registrations/new.html.erb index dcc4039..b24b545 100755 --- a/app/views/devise/registrations/new.html.erb +++ b/app/views/devise/registrations/new.html.erb @@ -4,14 +4,9 @@ <%= link_to "/" do %> Aperonight <% end %> -

- <%= t('devise.registrations.new.title') %> -

+

Créer un compte

- <%= t('devise.registrations.new.or') %> - - <%= t('devise.registrations.new.sign_in_link') %> - + ou se connecter à votre compte

@@ -19,13 +14,13 @@
- <%= f.label :email, class: "block text-sm font-medium text-neutral-700" %> + <%= f.label :email, "Adresse email", class: "block text-sm font-medium text-neutral-700" %> <%= f.email_field :email, autofocus: true, autocomplete: "email", class: "mt-1 block w-full px-3 py-2 border border-neutral-300 rounded-md shadow-sm placeholder-neutral-500 focus:outline-none focus:ring-purple-500 focus:border-purple-500 sm:text-sm" %>
- <%= f.label :password, class: "block text-sm font-medium text-neutral-700" %> + <%= f.label :password, "Mot de passe", class: "block text-sm font-medium text-neutral-700" %> <% if @minimum_password_length %> (<%= t('devise.registrations.new.minimum_password_length', count: @minimum_password_length) %>) <% end %> @@ -34,14 +29,14 @@
- <%= f.label :password_confirmation, class: "block text-sm font-medium text-neutral-700" %> + <%= f.label :password_confirmation, "Confirmation du mot de passe", class: "block text-sm font-medium text-neutral-700" %> <%= f.password_field :password_confirmation, autocomplete: "new-password", class: "mt-1 block w-full px-3 py-2 border border-neutral-300 rounded-md shadow-sm placeholder-neutral-500 focus:outline-none focus:ring-purple-500 focus:border-purple-500 sm:text-sm" %>
-
- <%= f.submit t('devise.registrations.new.sign_up'), class: "group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-purple-600 hover:bg-purple-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-neutral-50 focus:ring-purple-500" %> +
+ <%= f.submit "Créer un compte", class: "group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-purple-600 hover:bg-purple-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-neutral-50 focus:ring-purple-500" %>
<% end %> @@ -51,7 +46,7 @@
- <%= t('devise.registrations.new.continue_with') %> + Continuer avec
diff --git a/app/views/devise/sessions/new.html.erb b/app/views/devise/sessions/new.html.erb index 9ad5e07..7828e05 100755 --- a/app/views/devise/sessions/new.html.erb +++ b/app/views/devise/sessions/new.html.erb @@ -5,12 +5,12 @@ Aperonight <% end %>

- <%= t('devise.sessions.new.title') %> + Se connecter à votre compte

- <%= t('devise.sessions.new.or') %> + ou - <%= t('devise.sessions.new.sign_up_link') %> + créer un compte

@@ -19,17 +19,17 @@
- <%= f.label :email, class: "sr-only" %> + <%= f.label :email, "Email", class: "sr-only" %> <%= f.email_field :email, autofocus: true, autocomplete: "email", class: "appearance-none rounded-none relative block w-full px-3 py-2 border border-neutral-300 placeholder-neutral-500 text-neutral-900 bg-white rounded-t-md focus:outline-none focus:ring-purple-500 focus:border-purple-500 focus:z-10 sm:text-sm", - placeholder: t('devise.sessions.new.email_placeholder') %> + placeholder: "Adresse email" %>
- <%= f.label :password, class: "sr-only" %> + <%= f.label :password, "Mot de passe", class: "sr-only" %> <%= f.password_field :password, autocomplete: "current-password", class: "appearance-none rounded-none relative block w-full px-3 py-2 border border-neutral-300 placeholder-neutral-500 text-neutral-900 bg-white rounded-b-md focus:outline-none focus:ring-purple-500 focus:border-purple-500 focus:z-10 sm:text-sm", - placeholder: t('devise.sessions.new.password_placeholder') %> + placeholder: "Mot de passe" %>
@@ -37,14 +37,14 @@
<%= f.check_box :remember_me, class: "h-4 w-4 text-purple-600 focus:ring-purple-500 border-neutral-300 rounded bg-white" %> - +
<% end %>
- <%= f.submit t('devise.sessions.new.sign_in'), class: "group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-purple-600 hover:bg-purple-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-neutral-50 focus:ring-purple-500" %> + <%= f.submit "Se connecter", class: "group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-purple-600 hover:bg-purple-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-neutral-50 focus:ring-purple-500" %>
<% end %> @@ -54,7 +54,7 @@
- <%= t('devise.sessions.new.continue_with') %> + Continuer avec
diff --git a/app/views/devise/shared/_links.html.erb b/app/views/devise/shared/_links.html.erb index 334abc6..7a31dd8 100755 --- a/app/views/devise/shared/_links.html.erb +++ b/app/views/devise/shared/_links.html.erb @@ -1,38 +1,38 @@
<%- if controller_name != "sessions" %>
- <%= link_to t('devise.shared.links.sign_in'), new_session_path(resource_name), class: "block" %> + <%= link_to "Se connecter", new_session_path(resource_name), class: "block" %>
<% end %> <%- if devise_mapping.registerable? && controller_name != "registrations" %>
- <%= link_to t('devise.shared.links.sign_up'), new_registration_path(resource_name), class: "block" %> + <%= link_to "Créer un compte", new_registration_path(resource_name), class: "block" %>
<% end %> <%- if devise_mapping.recoverable? && controller_name != "passwords" && controller_name != "registrations" %>
- <%= link_to t('devise.shared.links.forgot_password'), new_password_path(resource_name), class: "block" %> + <%= link_to "Mot de passe oublié ?", new_password_path(resource_name), class: "block" %>
<% end %> <%- if devise_mapping.confirmable? && controller_name != "confirmations" %>
- <%= link_to t('devise.shared.links.confirmation_instructions'), new_confirmation_path(resource_name), class: "block" %> + <%= link_to "Renvoyer le lien de confirmation", new_confirmation_path(resource_name), class: "block" %>
<% end %> <%- if devise_mapping.lockable? && resource_class.unlock_strategy_enabled?(:email) && controller_name != "unlocks" %>
- <%= link_to t('devise.shared.links.unlock_instructions'), new_unlock_path(resource_name), class: "block" %> + <%= link_to "Renvoyer le lien de déblocage", new_unlock_path(resource_name), class: "block" %>
<% end %> <%- if devise_mapping.omniauthable? %> <%- resource_class.omniauth_providers.each do |provider| %>
- <%= button_to t('devise.shared.links.sign_in_with', provider: OmniAuth::Utils.camelize(provider)), omniauth_authorize_path(resource_name, provider), data: { turbo: false }, class: "block" %> + <%= button_to "Se connecter avec #{OmniAuth::Utils.camelize(provider)}", omniauth_authorize_path(resource_name, provider), data: { turbo: false }, class: "block" %>
<% end %> <% end %>