chore: fix UI

frontend-admin/src/screens/cabine/DashboardScreen.tsx

@@ -8,6 +8,7 @@ import {
     TouchableOpacity,
     Linking,
     Alert,
+    useWindowDimensions,
 } from "react-native";
 import { Ionicons } from "@expo/vector-icons";
 import { spacing, fontSize, borderRadius } from "../../theme";
@@ -26,6 +27,7 @@ import LoadingSpinner from "../../components/ui/LoadingSpinner";
 export default function DashboardScreen() {
     const { colors } = useTheme();
     const { username } = useAuth();
+    const { width: screenWidth } = useWindowDimensions();
 
     const [tgLinked, setTgLinked]   = useState(false);
     const [tgEnabled, setTgEnabled] = useState(false);
@@ -133,54 +135,54 @@ export default function DashboardScreen() {
                 container: {
                     flex: 1,
                     backgroundColor: colors.bgPrimary,
-                    padding: spacing.l,
+                    padding: screenWidth < 380 ? spacing.m : spacing.l,
                 },
                 welcome: {
-                    fontSize: fontSize.xl,
+                    fontSize: screenWidth < 380 ? fontSize.lg : fontSize.xl,
                     fontWeight: "bold",
                     color: colors.textWhite,
                     marginBottom: spacing.xs,
                 },
                 subtitle: {
-                    fontSize: fontSize.md,
+                    fontSize: screenWidth < 380 ? fontSize.sm : fontSize.md,
                     color: colors.textSecondary,
-                    marginBottom: spacing.xl,
+                    marginBottom: spacing.l,
                 },
                 grid: {
                     flexDirection: "row",
                     flexWrap: "wrap",
-                    gap: spacing.m,
+                    gap: screenWidth < 380 ? spacing.s : spacing.m,
                 },
                 card: {
-                    width: "47%",
+                    width: screenWidth < 360 ? "100%" : "47%",
                     backgroundColor: colors.bgCard,
                     borderRadius: borderRadius.md,
-                    padding: spacing.l,
+                    padding: screenWidth < 380 ? spacing.m : spacing.l,
                     borderWidth: 1,
                     borderColor: colors.borderLight,
                     alignItems: "center",
                 },
                 iconCircle: {
-                    width: 48,
-                    height: 48,
-                    borderRadius: 24,
+                    width: screenWidth < 380 ? 40 : 48,
+                    height: screenWidth < 380 ? 40 : 48,
+                    borderRadius: screenWidth < 380 ? 20 : 24,
                     justifyContent: "center",
                     alignItems: "center",
                     marginBottom: spacing.s,
                 },
                 cardValue: {
-                    fontSize: fontSize.xxl,
+                    fontSize: screenWidth < 380 ? fontSize.xl : fontSize.xxl,
                     fontWeight: "bold",
                     color: colors.textWhite,
                 },
                 cardLabel: {
-                    fontSize: fontSize.sm,
+                    fontSize: screenWidth < 380 ? fontSize.xs : fontSize.sm,
                     color: colors.textSecondary,
                     marginTop: spacing.xs,
                     textAlign: "center",
                 },
             }),
-        [colors],
+        [colors, screenWidth],
     );
 
     if (loading) return <LoadingSpinner message="Chargement..." />;