New screens: Guides, Library, Map, Notifications, Settings. Home refactored with modular components (SearchHeader, HomeCta, FrequentDiseases, SeasonAlert, PracticalGuides). Replaced hardcoded colors with theme tokens in SeasonAlert and HomeCta. Updated navigation, i18n, and CLAUDE.md. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
105 lines
2.5 KiB
TypeScript
105 lines
2.5 KiB
TypeScript
import { View, TouchableOpacity, StyleSheet } from "react-native";
|
|
import { useTranslation } from "react-i18next";
|
|
import { Ionicons } from "@expo/vector-icons";
|
|
import { Text } from "@/components/ui/text";
|
|
import { colors } from "@/theme/colors";
|
|
|
|
const CURRENT_ALERT = {
|
|
type: "warning" as const,
|
|
title: "Stay in the know",
|
|
message: "Get alerts on your money activity and budgets",
|
|
};
|
|
|
|
export default function SeasonAlert() {
|
|
const { t } = useTranslation();
|
|
|
|
return (
|
|
<View style={styles.container}>
|
|
<View style={styles.content}>
|
|
{/* Bouton Fermer */}
|
|
<TouchableOpacity style={styles.closeButton} activeOpacity={0.7}>
|
|
<Ionicons name="close" size={18} color={colors.primary[900]} />
|
|
</TouchableOpacity>
|
|
|
|
{/* Contenu Texte */}
|
|
<View style={styles.textContainer}>
|
|
<Text style={styles.title}>{t(CURRENT_ALERT.title)}</Text>
|
|
<Text style={styles.message}>{t(CURRENT_ALERT.message)}</Text>
|
|
</View>
|
|
|
|
{/* Bouton d'action */}
|
|
<TouchableOpacity style={styles.actionButton} activeOpacity={0.7}>
|
|
<Text style={styles.actionText}>{t("Allow notifications")}</Text>
|
|
</TouchableOpacity>
|
|
|
|
{/* Illustration decorative */}
|
|
<View style={styles.decoration}>
|
|
<Ionicons name="notifications" size={100} color={colors.primary[300]} />
|
|
</View>
|
|
</View>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
marginHorizontal: 20,
|
|
marginBottom: 24,
|
|
borderRadius: 28,
|
|
backgroundColor: colors.primary[200],
|
|
overflow: "hidden",
|
|
},
|
|
content: {
|
|
position: "relative",
|
|
padding: 24,
|
|
},
|
|
closeButton: {
|
|
position: "absolute",
|
|
right: 16,
|
|
top: 16,
|
|
height: 32,
|
|
width: 32,
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
borderRadius: 16,
|
|
backgroundColor: colors.primary[300],
|
|
zIndex: 1,
|
|
},
|
|
textContainer: {
|
|
paddingRight: 48,
|
|
},
|
|
title: {
|
|
fontSize: 22,
|
|
fontWeight: "700",
|
|
letterSpacing: -0.5,
|
|
color: colors.primary[900],
|
|
},
|
|
message: {
|
|
marginTop: 8,
|
|
fontSize: 16,
|
|
lineHeight: 24,
|
|
color: colors.primary[800],
|
|
opacity: 0.6,
|
|
},
|
|
actionButton: {
|
|
marginTop: 24,
|
|
alignSelf: "flex-start",
|
|
borderRadius: 12,
|
|
backgroundColor: colors.primary[400],
|
|
paddingHorizontal: 24,
|
|
paddingVertical: 12,
|
|
elevation: 2,
|
|
},
|
|
actionText: {
|
|
fontSize: 16,
|
|
fontWeight: "700",
|
|
color: colors.primary[900],
|
|
},
|
|
decoration: {
|
|
position: "absolute",
|
|
bottom: -16,
|
|
right: -16,
|
|
opacity: 0.8,
|
|
},
|
|
});
|