Improve weather condition translations and icon displays

Update WeatherWidget component to support more French weather conditions and improve icon rendering by fixing dynamic sizing issues and adding new icons for partially cloudy and sunny conditions.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: d43bd811-9372-45a7-8ac9-4a954c0538e1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/1957c339-2757-4d1f-8e92-e9f71a1ce58e/d43bd811-9372-45a7-8ac9-4a954c0538e1/xwPSzXM

client/src/components/WeatherWidget.tsx

@@ -1,5 +1,5 @@
 import { useQuery } from "@tanstack/react-query";
-import { Cloud, CloudRain, Sun, CloudSnow, ThermometerSun, CloudDrizzle, Wind, Zap, Eye } from "lucide-react";
+import { Cloud, CloudRain, Sun, CloudSnow, CloudSun, ThermometerSun, CloudDrizzle, Wind, Zap, Eye } from "lucide-react";
 import { Card, CardContent } from "@/components/ui/card";
 
 interface WeatherData {
@@ -24,17 +24,37 @@ interface WeatherResponse {
 
 
 const WeatherIcon = ({ condition, size = 20 }: { condition: string; size?: number }) => {
-  const iconClass = `h-${Math.floor(size/4)} w-${Math.floor(size/4)}`;
+  // Utiliser des tailles fixes plutôt que dynamiques pour éviter les problèmes de Tailwind
+  const getIconClass = (size: number) => {
+    if (size <= 16) return "h-4 w-4";
+    if (size <= 20) return "h-5 w-5";
+    if (size <= 24) return "h-6 w-6";
+    return "h-8 w-8";
+  };
+  
+  const iconClass = getIconClass(size);
   const conditionLower = condition.toLowerCase();
   
+  // Ensoleillé/Dégagé
+  if (conditionLower.includes('clear') || conditionLower.includes('dégagé') || 
+      conditionLower.includes('sunny') || conditionLower.includes('ensoleillé') ||
+      conditionLower.includes('fair') || conditionLower.includes('beau')) {
+    return <Sun className={`${iconClass} text-yellow-500`} />;
+  }
+  
   // Conditions pluvieuses
-  if (conditionLower.includes('rain') || conditionLower.includes('pluie') || conditionLower.includes('shower')) {
+  if (conditionLower.includes('rain') || conditionLower.includes('pluie') || conditionLower.includes('shower') || conditionLower.includes('averses')) {
     if (conditionLower.includes('heavy') || conditionLower.includes('forte')) {
       return <CloudRain className={`${iconClass} text-blue-600`} />;
     }
     return <CloudDrizzle className={`${iconClass} text-blue-500`} />;
   }
   
+  // Bruine  
+  if (conditionLower.includes('drizzle') || conditionLower.includes('bruine')) {
+    return <CloudDrizzle className={`${iconClass} text-blue-400`} />;
+  }
+  
   // Conditions neigeuses
   if (conditionLower.includes('snow') || conditionLower.includes('neige') || conditionLower.includes('blizzard')) {
     return <CloudSnow className={`${iconClass} text-blue-300`} />;
@@ -42,34 +62,29 @@ const WeatherIcon = ({ condition, size = 20 }: { condition: string; size?: numbe
   
   // Orages
   if (conditionLower.includes('thunder') || conditionLower.includes('storm') || conditionLower.includes('orage')) {
-    return <Zap className={`${iconClass} text-yellow-500`} />;
+    return <Zap className={`${iconClass} text-purple-600`} />;
   }
   
   // Brouillard
-  if (conditionLower.includes('fog') || conditionLower.includes('mist') || conditionLower.includes('brouillard')) {
+  if (conditionLower.includes('fog') || conditionLower.includes('mist') || conditionLower.includes('brouillard') || conditionLower.includes('brume')) {
-    return <Eye className={`${iconClass} text-gray-400`} />;
+    return <Cloud className={`${iconClass} text-gray-400`} />;
   }
   
   // Vent
-  if (conditionLower.includes('wind') || conditionLower.includes('vent')) {
+  if (conditionLower.includes('wind') || conditionLower.includes('vent') || conditionLower.includes('venteux')) {
     return <Wind className={`${iconClass} text-gray-600`} />;
   }
   
   // Nuageux
-  if (conditionLower.includes('cloud') || conditionLower.includes('nuage') || conditionLower.includes('overcast')) {
+  if (conditionLower.includes('cloud') || conditionLower.includes('nuage') || conditionLower.includes('overcast') || conditionLower.includes('couvert')) {
-    if (conditionLower.includes('partly') || conditionLower.includes('partial')) {
+    if (conditionLower.includes('partly') || conditionLower.includes('partial') || conditionLower.includes('partiellement')) {
-      return <Cloud className={`${iconClass} text-gray-500`} />;
+      return <CloudSun className={`${iconClass} text-yellow-400`} />;
     }
     return <Cloud className={`${iconClass} text-gray-600`} />;
   }
   
-  // Ensoleillé
+  // Par défaut pour températures
-  if (conditionLower.includes('sun') || conditionLower.includes('soleil') || conditionLower.includes('clear') || conditionLower.includes('fair')) {
+  return <Sun className={`${iconClass} text-yellow-500`} />;
-    return <Sun className={`${iconClass} text-yellow-500`} />;
-  }
-  
-  // Par défaut
-  return <ThermometerSun className={`${iconClass} text-orange-500`} />;
 };
 
 export default function WeatherWidget() {

cookies.txt

@@ -2,4 +2,4 @@
 # https://curl.se/docs/http-cookies.html
 # This file was generated by libcurl! Edit at your own risk.
 
-#HttpOnly_localhost	FALSE	/	FALSE	1755333988	connect.sid	s%3AISLqM3nMPwDqTr6rJYeqzJe6pp6ETpGJ.UEpHxk3T4DOjAZ6VGJsJ%2FHoasP2kzqayut1IaOzPG9E
+#HttpOnly_localhost	FALSE	/	FALSE	1755334812	connect.sid	s%3AIUsQcAbYjJ2Yu9GRwhXwQt22rGvvMGRo.zTBgX64O5zq1nh16Yc0umuKKQnBAy0xAn4BkA5iErOQ