Add placeholder images, enhance alert styles, and implement theme toggle component with dark mode support

2025-12-22 23:11:10 -05:00 · 2025-02-23 22:12:26 -05:00
parent 27e584f427
commit 0ba7add72f
44 changed files with 2188 additions and 227 deletions
--- a/memory-bank/design/DesignMigration.md
+++ b/memory-bank/design/DesignMigration.md
@@ -0,0 +1,129 @@
+# Design Migration from Django to Laravel
+
+## Overview
+This document tracks the migration of design assets and templates from the original Django project to Laravel/Livewire implementation.
+
+## Static Assets Structure (Django)
+```
+static/
+├── css/
+│   ├── alerts.css
+│   ├── tailwind.css
+│   └── src/
+│       └── input.css
+├── images/
+│   ├── default-avatar.png
+│   ├── discord-icon.svg
+│   ├── favicon.png
+│   ├── google-icon.svg
+│   └── placeholders/
+│       ├── dark-ride.jpg
+│       ├── default-park.jpg 
+│       ├── default-ride.jpg
+│       ├── flat-ride.jpg
+│       ├── other-ride.jpg
+│       ├── roller-coaster.jpg
+│       ├── transport.jpg
+│       └── water-ride.jpg
+└── js/
+    ├── alerts.js
+    ├── alpine.min.js
+    ├── cdn.min.js
+    ├── location-autocomplete.js
+    ├── main.js
+    ├── park-map.js
+    ├── photo-gallery.js
+    └── search.js
+```
+
+## Primary Templates (Django)
+1. Base Templates
+   - base/base.html (Main layout template)
+   
+2. Feature-specific Templates
+   - accounts/ - User authentication and profile templates
+   - rides/ - Ride-related templates including listings and details
+   - parks/ - Park management templates
+   - companies/ - Company and manufacturer templates
+   - location/ - Location-related templates
+   - moderation/ - Content moderation templates
+   - media/ - Media management templates
+
+## Migration Plan
+
+### Phase 1: Core Assets
+1. Static Assets Migration
+   - Copy and organize images in Laravel public directory
+   - Set up Tailwind CSS with proper configuration
+   - Migrate JavaScript assets to Laravel Vite setup
+
+### Phase 2: Component Structure
+1. Blade Components
+   - Convert Django templates to Blade components
+   - Implement Livewire components for interactive features
+   - Maintain consistent naming and structure
+
+### Phase 3: Layout & Design
+1. Base Layout
+   - Implement base.blade.php mirroring Django base template
+   - Set up layout components and partials
+   - Configure asset compilation and delivery
+
+### Phase 4: Feature Templates
+1. Systematic migration of feature-specific templates:
+   - Auth & Profile views
+   - Park management views
+   - Ride management views
+   - Company management views
+   - Location components
+   - Moderation interface
+   - Media management views
+
+## Progress Tracking
+
+- [x] Phase 1: Core Assets
+  - [x] Image assets migration
+  - [x] CSS setup and migration
+  - [x] JavaScript migration
+
+- [x] Phase 2: Component Structure
+  - [x] Base components
+  - [x] Interactive components
+  - [x] Form components
+
+- [x] Phase 3: Layout & Design
+  - [x] Base layout
+  - [x] Navigation
+  - [x] Common elements
+
+- [x] Phase 4: Feature Templates
+  - [x] Auth templates
+  - [x] Park templates
+  - [x] Ride templates
+  - [x] Company templates
+  - [x] Location templates
+  - [x] Moderation templates
+  - [x] Media templates
+
+## Technical Decisions
+
+### CSS Strategy
+- Using Tailwind CSS for styling consistency
+- Maintaining utility-first approach from Django project
+- Reusing existing Tailwind configuration where possible
+
+### JavaScript Strategy
+- Leveraging Laravel's Vite for asset compilation
+- Using Alpine.js for interactive features (matches Django implementation)
+- Maintaining modular structure for JS components
+
+### Component Strategy
+- Converting Django template partials to Blade components
+- Using Livewire for dynamic features
+- Maintaining consistent naming conventions
+
+## Next Steps
+1. Begin Phase 1 with static asset migration
+2. Set up base layout structure
+3. Implement core components
+4. Migrate feature-specific templates systematically