feat(theme): finalize design token system with WCAG AA compliance

- Fix gold text contrast in light theme from 3.30:1 to 6.38:1 (AA compliant)
- Separate ThemeContext into definition and provider files for ESLint compliance
- Update contrast report with final validation results (100% passing tests)
- Ensure all accent colors meet WCAG AA standards across light/dark themes
- Complete design token system with proper semantic color roles

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-08-16 02:21:19 -06:00
parent a049472a13
commit 6d879d0685
35 changed files with 12075 additions and 0 deletions

View File

@@ -0,0 +1,199 @@
# =============================================================================
# ENVIRONMENT CONFIGURATION - BLACK CANYON TICKETS REACT REBUILD
# =============================================================================
#
# ⚠️ IMPORTANT: This is a LEARNING PROJECT with MOCK VALUES only!
# ⚠️ Do NOT use real API keys, secrets, or live service credentials
# ⚠️ All values below are fake/example values for development learning
#
# This project is frontend-only and does not connect to live services.
# Copy this file to `.env` and keep all mock values as-is for development.
# =============================================================================
# -----------------------------------------------------------------------------
# APPLICATION CONFIGURATION
# -----------------------------------------------------------------------------
# Environment flag for conditional features
VITE_NODE_ENV=development
# Base URL for the React application
VITE_APP_URL=http://localhost:5173
# Application name and version
VITE_APP_NAME="Black Canyon Tickets - React Rebuild"
VITE_APP_VERSION=1.0.0
# Feature flags for development
VITE_ENABLE_MOCK_DATA=true
VITE_ENABLE_DEBUG_MODE=true
VITE_ENABLE_ANIMATIONS=true
# -----------------------------------------------------------------------------
# MOCK SUPABASE CONFIGURATION (NO REAL CONNECTION)
# -----------------------------------------------------------------------------
# These simulate the database/auth service from the original project
# Used for mock authentication flows and data structure examples
VITE_SUPABASE_URL=https://mock-bct-learning.supabase.co
VITE_SUPABASE_ANON_KEY=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJtb2NrLXN1cGFiYXNlIiwiaWF0IjoxNjM0NzY1MjAwLCJleHAiOjE5NTAxMjUyMDAsImF1ZCI6Im1vY2stYXVkaWVuY2UiLCJzdWIiOiJtb2NrLXN1YmplY3QiLCJyb2xlIjoiYW5vbiJ9
# Service role key (would be server-side only in real app)
VITE_SUPABASE_SERVICE_ROLE_KEY=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJtb2NrLXN1cGFiYXNlIiwiaWF0IjoxNjM0NzY1MjAwLCJleHAiOjE5NTAxMjUyMDAsImF1ZCI6Im1vY2stYXVkaWVuY2UiLCJzdWIiOiJtb2NrLXN1YmplY3QiLCJyb2xlIjoic2VydmljZV9yb2xlIn0
# -----------------------------------------------------------------------------
# MOCK STRIPE CONFIGURATION (NO REAL PAYMENTS)
# -----------------------------------------------------------------------------
# These simulate payment processing for UI/UX learning
# Checkout flows will show mock success/failure states
VITE_STRIPE_PUBLISHABLE_KEY=pk_test_51MockStripePublishableKeyForReactLearning1234567890
VITE_STRIPE_SECRET_KEY=sk_test_51MockStripeSecretKeyForReactLearning1234567890
# Webhook secret for mock webhook handling examples
VITE_STRIPE_WEBHOOK_SECRET=whsec_1234567890MockWebhookSecretForLearning
# Connect application fee (percentage for platform)
VITE_STRIPE_APPLICATION_FEE_PERCENT=2.9
# -----------------------------------------------------------------------------
# MOCK EMAIL SERVICE CONFIGURATION
# -----------------------------------------------------------------------------
# Simulates transactional email service for UI examples
VITE_RESEND_API_KEY=re_MockResendApiKey_1234567890ForReactLearning
VITE_EMAIL_FROM_ADDRESS=noreply@mock-blackcanyontickets.com
VITE_EMAIL_REPLY_TO=support@mock-blackcanyontickets.com
# -----------------------------------------------------------------------------
# MOCK ERROR MONITORING & ANALYTICS
# -----------------------------------------------------------------------------
# Simulates production monitoring services for learning
VITE_SENTRY_DSN=https://mock1234567890@o123456.ingest.sentry.io/1234567
VITE_SENTRY_ENVIRONMENT=development
VITE_SENTRY_SAMPLE_RATE=1.0
# Google Analytics (mock tracking ID)
VITE_GA_MEASUREMENT_ID=G-MOCKMEASUREMENT123
# -----------------------------------------------------------------------------
# MOCK AI/ML SERVICE CONFIGURATION
# -----------------------------------------------------------------------------
# For any AI-powered features in the learning project
VITE_OPENAI_API_KEY=sk-mock1234567890OpenAIKeyForReactLearningProject
VITE_OPENAI_ORGANIZATION_ID=org-MockOpenAIOrganizationForLearning
# -----------------------------------------------------------------------------
# MOCK THIRD-PARTY INTEGRATIONS
# -----------------------------------------------------------------------------
# Mock weather API for event planning features
VITE_WEATHER_API_KEY=mock1234567890WeatherAPIKeyForLearning
# Mock maps/geocoding service
VITE_MAPS_API_KEY=AIzaSyMockGoogleMapsAPIKeyForReactLearning1234567890
# Mock social media integration
VITE_FACEBOOK_APP_ID=1234567890123456
VITE_TWITTER_API_KEY=MockTwitterAPIKeyForReactLearning
# -----------------------------------------------------------------------------
# DEVELOPMENT CONFIGURATION
# -----------------------------------------------------------------------------
# Hot module replacement and dev server settings
VITE_HMR_PORT=24678
VITE_HMR_HOST=localhost
# API endpoint for mock backend (if implementing mock API server)
VITE_API_BASE_URL=http://localhost:3001/api
VITE_API_TIMEOUT=5000
# WebSocket configuration for real-time features simulation
VITE_WS_URL=ws://localhost:3001
# -----------------------------------------------------------------------------
# MOCK ORGANIZATION & TENANT CONFIGURATION
# -----------------------------------------------------------------------------
# Simulates multi-tenant setup from original project
# Default organization for development
VITE_DEFAULT_ORG_ID=org_MockBlackCanyonTickets123
VITE_DEFAULT_ORG_NAME="Mock Black Canyon Tickets"
VITE_DEFAULT_ORG_SLUG=mock-bct
# Platform configuration
VITE_PLATFORM_NAME="Black Canyon Tickets - Learning Platform"
VITE_PLATFORM_SUPPORT_EMAIL=support@mock-bct.com
VITE_PLATFORM_PHONE="+1-555-MOCK-BCT"
# -----------------------------------------------------------------------------
# MOCK SECURITY CONFIGURATION
# -----------------------------------------------------------------------------
# JWT secrets for mock authentication (learning only)
VITE_JWT_SECRET=mock-jwt-secret-for-react-learning-project-only
VITE_JWT_EXPIRE_TIME=7d
# CORS settings for development
VITE_CORS_ORIGIN=http://localhost:5173
VITE_CORS_CREDENTIALS=true
# -----------------------------------------------------------------------------
# DEPLOYMENT CONFIGURATION (when hosting the learning project)
# -----------------------------------------------------------------------------
# Production URL (when deploying to learn deployment)
VITE_PRODUCTION_URL=https://mock-bct-react-rebuild.netlify.app
# CDN configuration for static assets
VITE_CDN_URL=https://mock-cdn.blackcanyontickets.com
# Database connection (mock - for reference only)
VITE_DATABASE_URL=postgresql://mockuser:mockpass@mock-db.com:5432/mock_bct_db
# Redis configuration (mock - for reference only)
VITE_REDIS_URL=redis://mock-redis:6379
# -----------------------------------------------------------------------------
# FEATURE FLAGS FOR LEARNING DIFFERENT IMPLEMENTATIONS
# -----------------------------------------------------------------------------
# UI/UX feature toggles
VITE_FEATURE_DARK_MODE=true
VITE_FEATURE_GLASSMORPHISM=true
VITE_FEATURE_ANIMATIONS=true
VITE_FEATURE_MOBILE_OPTIMIZATIONS=true
# Functional feature toggles
VITE_FEATURE_CALENDAR_VIEW=true
VITE_FEATURE_TICKET_SCANNING=true
VITE_FEATURE_ADMIN_DASHBOARD=true
VITE_FEATURE_ANALYTICS_CHARTS=true
VITE_FEATURE_REAL_TIME_UPDATES=true
# Learning-specific features
VITE_FEATURE_MOCK_API_DELAY=1000
VITE_FEATURE_MOCK_ERRORS=true
VITE_FEATURE_DEBUG_PANELS=true
# =============================================================================
# SETUP INSTRUCTIONS FOR DEVELOPERS
# =============================================================================
#
# 1. Copy this file to `.env` in the project root:
# cp .env.example .env
#
# 2. Keep all mock values as-is - they are designed for learning
#
# 3. Start the development server:
# npm run dev
#
# 4. The app will run at http://localhost:5173 with mock data
#
# 5. All API calls will return mock data - no real services are contacted
#
# REMEMBER: This is a learning project! All values are fake and safe to use.
# =============================================================================