Files
thrillwiki_django_no_react/shared/docs/memory-bank/projects/card-count-standardization-implementation.md
pacnpal d504d41de2 feat: complete monorepo structure with frontend and shared resources
- Add complete backend/ directory with full Django application
- Add frontend/ directory with Vite + TypeScript setup ready for Next.js
- Add comprehensive shared/ directory with:
  - Complete documentation and memory-bank archives
  - Media files and avatars (letters, park/ride images)
  - Deployment scripts and automation tools
  - Shared types and utilities
- Add architecture/ directory with migration guides
- Configure pnpm workspace for monorepo development
- Update .gitignore to exclude .django_tailwind_cli/ build artifacts
- Preserve all historical documentation in shared/docs/memory-bank/
- Set up proper structure for full-stack development with shared resources
2025-08-23 18:40:07 -04:00

4.4 KiB

Card Count Standardization Implementation Plan

Date: June 27, 2025
Objective: Fix critical card count inconsistency across detail pages

Current State Analysis

Park Detail Pages (GOOD STANDARD - 5 cards)

  • Location: templates/parks/park_detail.html
  • Cards: Total Rides, Roller Coasters, Status, Opened, Owner
  • Layout: Horizontal stats bar using grid-cols-2 md:grid-cols-4 lg:grid-cols-6
  • Styling: bg-white rounded-lg shadow-lg dark:bg-gray-800 p-compact card-stats

Ride Detail Pages (CRITICAL ISSUE - Only 2 cards)

  • Location: templates/rides/ride_detail.html
  • Current Cards:
    1. Ride Info Card (name, park, status, category, rating)
    2. Stats and Quick Facts (height, speed, manufacturer, etc.)
  • Problem: Severely sparse layout with excessive white space
  • Target: Add 3 additional cards to match park standard

Company Detail Pages (INCONSISTENT - 3-4 cards)

  • Location: templates/companies/manufacturer_detail.html
  • Current Cards: Company Info, Total Rides, Coasters, Founded (conditional)
  • Layout: grid-cols-1 md:grid-cols-4
  • Target: Add 1-2 additional cards for consistency

Implementation Strategy

Phase 1: Ride Detail Page Enhancement (Priority 1)

Add 3 new cards to achieve 5-card standard:

  1. Statistics Card: Height, Speed, Duration, Inversions
  2. Experience Card: Ride Type, Thrill Level, Age Requirements
  3. History Card: Opening Date, Designer, Notable Facts

Technical Approach:

  • Restructure header grid to use horizontal stats bar like park pages
  • Move existing stats into dedicated cards
  • Maintain responsive behavior across breakpoints

Phase 2: Company Detail Page Enhancement (Priority 2)

Add 1-2 new cards to achieve 5-card standard:

  1. Specialties Card: Primary ride types, Notable innovations
  2. History Card: Year established, Key milestones

Implementation Details

Ride Detail Page Changes

Current Structure:

<!-- Header Grid -->
<div class="grid grid-cols-1 gap-4 mb-6 lg:grid-cols-2">
    <!-- Ride Info Card -->
    <!-- Stats and Quick Facts -->
</div>

New Structure:

<!-- Ride Header -->
<div class="p-compact mb-6 bg-white rounded-lg shadow-lg dark:bg-gray-800">
    <!-- Ride name, park, status badges -->
</div>

<!-- Horizontal Stats Bar (5 cards) -->
<div class="grid grid-cols-2 gap-4 mb-6 md:grid-cols-3 lg:grid-cols-5">
    <!-- Statistics Card -->
    <!-- Experience Card -->
    <!-- Manufacturer Card -->
    <!-- History Card -->
    <!-- Performance Card -->
</div>

Card Content Mapping

Statistics Card

  • Height (from coaster_stats.height_ft)
  • Speed (from coaster_stats.speed_mph)
  • Length (from coaster_stats.length_ft)
  • Inversions (from coaster_stats.inversions)

Experience Card

  • Ride Type (from ride.get_category_display)
  • Duration (from coaster_stats.ride_time_seconds)
  • Capacity (from ride.capacity_per_hour)
  • Min Height (from ride.min_height_in)

Manufacturer Card

  • Manufacturer (from ride.manufacturer)
  • Designer (from ride.designer)
  • Model (from ride.model_name)

History Card

  • Opened (from ride.opening_date)
  • Status Since (from ride.status_since)
  • Previous Names (if exists)

Performance Card

  • Average Rating (from ride.average_rating)
  • Total Reviews (from ride.reviews.count)
  • Track Material (from coaster_stats.track_material)

Company Detail Page Changes

Add after existing cards:

Specialties Card

  • Primary ride types manufactured
  • Notable innovations or technologies
  • Years of operation

History Card

  • Founded year (from manufacturer.founded_date)
  • Headquarters (from manufacturer.headquarters)
  • Key milestones

Success Metrics

  • Consistent Card Count: 5 cards across all detail page types
  • Eliminated White Space: No more severely sparse layouts
  • Professional Appearance: Balanced, consistent visual density
  • Responsive Consistency: Proper behavior across all screen sizes

Testing Plan

  1. Test ride detail pages for improved density
  2. Test company detail pages for consistency
  3. Verify responsive behavior on mobile, tablet, desktop
  4. Ensure visual consistency with park detail pages
  5. Validate content quality and relevance

Implementation Order

  1. Ride Detail Pages (highest impact - fixes severe sparseness)
  2. Company Detail Pages (standardization)
  3. Testing and refinement
  4. Documentation update