tp5 :fix:

JokesApp/components/DetailJoke.tsx

@@ -63,6 +63,7 @@ const styles = StyleSheet.create({
         borderRadius: 20,
         borderColor: whiteColor,
         backgroundColor : indigo,
+        borderWidth: 1,
     },
     imageSettings: {
         flex: 1,
@@ -77,7 +78,7 @@ const styles = StyleSheet.create({
     },
     chip: {
         borderRadius: 16,
-        backgroundColor: greyColor,
+        backgroundColor: whiteColor,
         padding: 5,
         margin: 5,
         marginLeft: 30,

JokesApp/navigation/Navigation.tsx

@@ -47,7 +47,8 @@ export function Navigation(){
                                                    <Image source={listIcon}
                                                           style={{ tintColor: focused ? darksalmonColor : purpleColor }}
                                                    />
-                                               )
+                                               ),
+                                               headerShown: false,
                                            }}/>
                 <BottomTabNavigator.Screen name="Ajouter" component={AddJokeScreen}
                                            options={{
@@ -57,7 +58,8 @@ export function Navigation(){
                                                               style={{ tintColor: focused ? darksalmonColor : purpleColor }}
                                                        />
                                                    </View>
-                                               )
+                                               ),
+
                                            }}/>
 
                 <BottomTabNavigator.Screen name="Favoris" component={ListJokeScreen}

JokesApp/navigation/StackNavigation.tsx

@@ -5,14 +5,33 @@ import {JokeListItems} from "../components/ListeJokeComponent";
 import {DetailJoke} from "../components/DetailJoke";
 import JokeDetailScreen from "../screens/JokeDetailScreen";
 import {ListJokeScreen} from "../screens/ListJokeScreen";
+import {darksalmonColor, indigo, purpleColor} from "../Theme";
 
 export default function StackNavigation() {
 
     const Stack = createStackNavigator();
     return(
-        <Stack.Navigator initialRouteName="CatalogueStack">
+        <Stack.Navigator initialRouteName="CatalogueStack" screenOptions={
-                <Stack.Screen name="CatalogueStack" component={ListJokeScreen}/>
+            {
-                <Stack.Screen name="JokeDetail" component={JokeDetailScreen}/>
+                headerTitleStyle: {
+                    fontSize: 24,
+                    fontWeight: 'bold',
+                    color: darksalmonColor,
+
+                },
+                headerStyle: {
+                    backgroundColor: indigo,
+
+                },
+                headerTitle : "Catalogue",
+                headerBackTitleVisible: false,
+                headerTintColor: darksalmonColor,
+            }
+
+        }>
+                <Stack.Screen name="CatalogueStack" component={ListJokeScreen} options={{ headerTitle: 'Catalogue' }}/>
+                <Stack.Screen name="JokeDetail" component={JokeDetailScreen} options={{ headerTitle: 'Detail d une blague' }
+                } />
         </Stack.Navigator>
     )
 }

JokesApp/screens/JokeDetailScreen.tsx

@@ -1,5 +1,5 @@
 import {View, Text, StyleSheet} from "react-native";
-import {indigo, purpleColor} from "../Theme";
+import {indigo, purpleColor, whiteColor} from "../Theme";
 import React, {useEffect} from "react";
 import {CustomJoke} from "../model/CustomJoke";
 import {DetailJoke} from "../components/DetailJoke";
@@ -35,6 +35,7 @@ const styles = StyleSheet.create({
         backgroundColor: purpleColor,
         width: '100%',
         height: '100%',
+
     },
     text: {
         fontSize: 24,