feat: Update UI colors to use dynamic theme system and fix predictions
**Theme-Aware Colors Across App:** - Updated track page cards to use theme.palette colors - Updated analytics page icons to use theme colors - Updated login/register gradient backgrounds to use theme colors - All colors now respond to Standard/High Contrast theme toggle **Fixed Next Predicted Activity Section:** - Connected to real analytics API predictions endpoint - Fetches sleep and feeding predictions based on actual data - Shows "Nap time in X minutes" when prediction available - Displays formatted time using formatDistanceToNow - Falls back to "Not enough data available for now. Keep tracking :)" when no predictions **Multi-Language Support:** - Added "notEnoughData" translation key to all 7 languages: - English: "Not enough data available for now. Keep tracking :)" - Spanish: "No hay suficientes datos disponibles por ahora. ¡Sigue rastreando! :)" - French: "Pas assez de données disponibles pour le moment. Continuez à suivre :)" - Portuguese: "Dados insuficientes disponíveis no momento. Continue rastreando :)" - Chinese: "暂无足够数据。请继续记录 :)" - German: "Derzeit nicht genügend Daten verfügbar. Weiter verfolgen :)" - Italian: "Dati insufficienti al momento. Continua a monitorare :)" **Color Mapping by Theme:** *Purple Theme (Standard):* - Feeding: Primary (#8b52ff) - Sleep: Secondary (#ff7094) - Diaper: Warning (amber) - Medical: Error (red) - Activity: Success (green) - Growth: Primary Dark *Peach Theme (High Contrast):* - Feeding: Primary (#FFB6C1) - Sleep: Secondary (#FFDAB9) - Diaper: Warning (amber) - Medical: Error (red) - Activity: Success (green) - Growth: Primary Dark **Files Modified:** - app/track/page.tsx - Dynamic theme colors - app/analytics/page.tsx - Theme-aware icon colors - app/(auth)/login/page.tsx - Gradient uses theme - app/(auth)/register/page.tsx - Gradient uses theme - app/page.tsx - Predictions integration - locales/*/dashboard.json - All 7 languages 🎉 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -22,6 +22,7 @@ import { motion } from 'framer-motion';
|
||||
import * as z from 'zod';
|
||||
import { useAuth } from '@/lib/auth/AuthContext';
|
||||
import Link from 'next/link';
|
||||
import { useTheme } from '@mui/material/styles';
|
||||
|
||||
const registerSchema = z.object({
|
||||
name: z.string().min(2, 'Name must be at least 2 characters'),
|
||||
@@ -70,6 +71,7 @@ const registerSchema = z.object({
|
||||
type RegisterFormData = z.infer<typeof registerSchema>;
|
||||
|
||||
export default function RegisterPage() {
|
||||
const theme = useTheme();
|
||||
const [showPassword, setShowPassword] = useState(false);
|
||||
const [showConfirmPassword, setShowConfirmPassword] = useState(false);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
@@ -148,7 +150,7 @@ export default function RegisterPage() {
|
||||
justifyContent: 'center',
|
||||
px: 3,
|
||||
py: 6,
|
||||
background: 'linear-gradient(135deg, #FFE4E1 0%, #FFDAB9 100%)',
|
||||
background: `linear-gradient(135deg, ${theme.palette.primary.light} 0%, ${theme.palette.secondary.light} 100%)`,
|
||||
}}
|
||||
>
|
||||
<motion.div
|
||||
|
||||
Reference in New Issue
Block a user