AzmogExe/cesizen-individuel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(mobile): applique l'identité visuelle DSFR (bleu France, République Française)

Browse Source 
- palette officielle DSFR (#000091, rouge Marianne, gris DSFR) dans lib/colors.ts
- composant RepubliqueHeader (bloc « République Française » + service CESIZen)
- restyle boutons/champs/cartes/onglets/urgence au style gouv.fr sur tous les écrans
- couleurs d'émotions conservées

Le DSFR étant un framework web, le mobile en reçoit l'identité visuelle (pas les classes fr-*). tsc 0.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Azmog
2026-06-18 23:45:05 +02:00
parent 69c40bd628
commit ca88bf7737
16 changed files with 218 additions and 138 deletions
Download Patch File Download Diff File Expand all files Collapse all files
mobile/app/(tabs)/info/[slug].tsx
+5 -5
View File
@@ -11,7 +11,7 @@ export default function FeedDetailScreen() {
if (isLoading) {
return (
<View style={styles.centered}>
<ActivityIndicator size="large" color={Colors.secondary} />
<ActivityIndicator size="large" color={Colors.primary} />
</View>
);
}
@@ -32,7 +32,7 @@ export default function FeedDetailScreen() {
<Stack.Screen options={{ title: feed.titre ?? '' }} />
<ScrollView style={styles.container} contentContainerStyle={styles.content}>
<View style={styles.badge}>
<Ionicons name="information-circle" size={14} color={Colors.secondary} />
<Ionicons name="information-circle" size={14} color={Colors.primary} />
<Text style={styles.badgeText}>Information santé mentale</Text>
</View>
@@ -52,10 +52,10 @@ const styles = StyleSheet.create({
container: { flex: 1, backgroundColor: Colors.white },
content: { padding: 20, paddingBottom: 40 },
centered: { flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: Colors.white },
badge: { flexDirection: 'row', alignItems: 'center', gap: 6, alignSelf: 'flex-start', backgroundColor: `${Colors.secondary}15`, paddingHorizontal: 10, paddingVertical: 5, borderRadius: 999, marginBottom: 12 },
badgeText: { fontSize: 12, fontWeight: '600', color: Colors.secondary },
badge: { flexDirection: 'row', alignItems: 'center', gap: 6, alignSelf: 'flex-start', backgroundColor: `${Colors.primary}15`, paddingHorizontal: 10, paddingVertical: 5, borderRadius: 4, marginBottom: 12 },
badgeText: { fontSize: 12, fontWeight: '600', color: Colors.primary },
title: { fontSize: 24, fontWeight: '800', color: Colors.black, marginBottom: 8, lineHeight: 30 },
date: { fontSize: 13, color: Colors.gray[400], marginBottom: 20 },
body: { fontSize: 15, lineHeight: 24, color: Colors.gray[700] ?? '#374151' },
body: { fontSize: 15, lineHeight: 24, color: Colors.black },
errorText: { marginTop: 12, fontSize: 16, color: Colors.gray[400] },
});
mobile/app/(tabs)/info/index.tsx
+5 -5
View File
@@ -15,7 +15,7 @@ export default function InfoListScreen() {
onPress={() => router.push(`/(tabs)/info/${item.slug}`)}
>
<View style={styles.cardIcon}>
<Ionicons name="document-text" size={24} color={Colors.secondary} />
<Ionicons name="document-text" size={24} color={Colors.primary} />
</View>
<View style={styles.cardContent}>
<Text style={styles.cardTitle}>{item.titre}</Text>
@@ -62,14 +62,14 @@ const styles = StyleSheet.create({
container: { flex: 1, backgroundColor: Colors.white },
listContent: { padding: 16 },
header: { marginBottom: 20 },
headerTitle: { fontSize: 14, fontWeight: '700', color: Colors.secondary, textTransform: 'uppercase', letterSpacing: 1 },
headerTitle: { fontSize: 14, fontWeight: '700', color: Colors.primary, textTransform: 'uppercase', letterSpacing: 1 },
headerSubtitle: { fontSize: 15, color: Colors.gray[500], marginTop: 4 },
card: {
flexDirection: 'row', alignItems: 'center', gap: 14, padding: 16,
backgroundColor: Colors.gray[50], borderRadius: 16, marginBottom: 10,
borderWidth: 1, borderColor: Colors.gray[100],
backgroundColor: Colors.white, borderRadius: 4, marginBottom: 10,
borderWidth: 1, borderColor: Colors.gray[200],
},
cardIcon: { width: 48, height: 48, borderRadius: 14, backgroundColor: `${Colors.secondary}15`, justifyContent: 'center', alignItems: 'center' },
cardIcon: { width: 48, height: 48, borderRadius: 4, backgroundColor: `${Colors.primary}15`, justifyContent: 'center', alignItems: 'center' },
cardContent: { flex: 1 },
cardTitle: { fontSize: 15, fontWeight: '700', color: Colors.black, marginBottom: 4 },
cardExcerpt: { fontSize: 13, color: Colors.gray[500], lineHeight: 18 },