upd: notifikasi

Deskripsi:
- update ui page notifikasi

No Issues

app/(application)/_layout.tsx

@@ -9,6 +9,8 @@ export default function RootLayout() {
             <Stack.Screen name="home" options={{ title: 'Home' }} />
             <Stack.Screen name="feature" options={{ title: 'Fitur' }} />
             <Stack.Screen name="search" options={{ title: 'Pencarian' }} />
+            <Stack.Screen name="notification" options={{ title: 'Notifikasi' }} />
+            <Stack.Screen name="profile" options={{ title: 'Profile' }} />
          </Stack>
          <StatusBar style="light" />
       </>

app/(application)/notification.tsx

@@ -0,0 +1,119 @@
+import BorderBottomItem from "@/components/borderBottomItem";
+import ButtonBackHeader from "@/components/buttonBackHeader";
+import { ColorsStatus } from "@/constants/ColorsStatus";
+import Styles from "@/constants/Styles";
+import { Feather } from "@expo/vector-icons";
+import { router, Stack } from "expo-router";
+import { SafeAreaView, ScrollView, View } from "react-native";
+
+export default function Notification() {
+   return (
+      <SafeAreaView>
+         <Stack.Screen
+            options={{
+               headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
+               headerTitle: 'Pencarian',
+               headerTitleAlign: 'center'
+            }}
+         />
+         <ScrollView>
+            <View style={[Styles.p15]}>
+               <View style={[Styles.wrapPaper, Styles.mb100]}>
+                  <View style={[Styles.mb05]}>
+                     <BorderBottomItem
+                        icon={
+                           <View style={[Styles.iconContent, ColorsStatus.primary]}>
+                              <Feather name="bell" size={25} color="white" />
+                           </View>
+                        }
+                        title="TU dan Umum"
+                        rightTopInfo="16 Feb 2025"
+                        desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
+                     />
+                     <BorderBottomItem
+                        icon={
+                           <View style={[Styles.iconContent, ColorsStatus.primary]}>
+                              <Feather name="bell" size={25} color="white" />
+                           </View>
+                        }
+                        title="TU dan Umum"
+                        rightTopInfo="16 Feb 2025"
+                        desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
+                     />
+                     <BorderBottomItem
+                        icon={
+                           <View style={[Styles.iconContent, ColorsStatus.primary]}>
+                              <Feather name="bell" size={25} color="white" />
+                           </View>
+                        }
+                        title="TU dan Umum"
+                        rightTopInfo="16 Feb 2025"
+                        desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
+                     />
+                     <BorderBottomItem
+                        icon={
+                           <View style={[Styles.iconContent, ColorsStatus.primary]}>
+                              <Feather name="bell" size={25} color="white" />
+                           </View>
+                        }
+                        title="TU dan Umum"
+                        rightTopInfo="16 Feb 2025"
+                        desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
+                     />
+                     <BorderBottomItem
+                        icon={
+                           <View style={[Styles.iconContent, ColorsStatus.primary]}>
+                              <Feather name="bell" size={25} color="white" />
+                           </View>
+                        }
+                        title="TU dan Umum"
+                        rightTopInfo="16 Feb 2025"
+                        desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
+                     />
+                     <BorderBottomItem
+                        icon={
+                           <View style={[Styles.iconContent, ColorsStatus.primary]}>
+                              <Feather name="bell" size={25} color="white" />
+                           </View>
+                        }
+                        title="TU dan Umum"
+                        rightTopInfo="16 Feb 2025"
+                        desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
+                     />
+                     <BorderBottomItem
+                        icon={
+                           <View style={[Styles.iconContent, ColorsStatus.primary]}>
+                              <Feather name="bell" size={25} color="white" />
+                           </View>
+                        }
+                        title="TU dan Umum"
+                        rightTopInfo="16 Feb 2025"
+                        desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
+                     />
+                     <BorderBottomItem
+                        icon={
+                           <View style={[Styles.iconContent, ColorsStatus.primary]}>
+                              <Feather name="bell" size={25} color="white" />
+                           </View>
+                        }
+                        title="TU dan Umum"
+                        rightTopInfo="16 Feb 2025"
+                        desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
+                     />
+                     <BorderBottomItem
+                        icon={
+                           <View style={[Styles.iconContent, ColorsStatus.primary]}>
+                              <Feather name="bell" size={25} color="white" />
+                           </View>
+                        }
+                        title="TU dan Umum"
+                        rightTopInfo="16 Feb 2025"
+                        desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
+                     />
+                  </View>
+               </View>
+            </View>
+         </ScrollView>
+      </SafeAreaView>
+   )
+}

app/(application)/profile.tsx

@@ -0,0 +1,9 @@
+import { Text, View } from "react-native";
+
+export default function Profile() {
+   return (
+      <View>
+         <Text>Profile</Text>
+      </View>
+   )
+}

app/(application)/search.tsx

@@ -61,7 +61,7 @@ export default function Search() {
                         <BorderBottomItem
                            icon={
                               <View style={[Styles.iconContent, ColorsStatus.primary]}>
-                                 <MaterialIcons name="group" size={30} color="white" />
+                                 <MaterialIcons name="group" size={25} color="white" />
                               </View>
                            }
                            title="TU dan Umum"
@@ -70,7 +70,7 @@ export default function Search() {
                         <BorderBottomItem
                            icon={
                               <View style={[Styles.iconContent, ColorsStatus.primary]}>
-                                 <MaterialIcons name="group" size={30} color="white" />
+                                 <MaterialIcons name="group" size={25} color="white" />
                               </View>
                            }
                            title="TU dan Umum"
@@ -82,7 +82,7 @@ export default function Search() {
                         <BorderBottomItem
                            icon={
                               <View style={[Styles.iconContent, ColorsStatus.primary]}>
-                                 <AntDesign name="areachart" size={30} color="white" />
+                                 <AntDesign name="areachart" size={25} color="white" />
                               </View>
                            }
                            title="Kerja Bakti"
@@ -91,7 +91,7 @@ export default function Search() {
                         <BorderBottomItem
                            icon={
                               <View style={[Styles.iconContent, ColorsStatus.primary]}>
-                                 <AntDesign name="areachart" size={30} color="white" />
+                                 <AntDesign name="areachart" size={25} color="white" />
                               </View>
                            }
                            title="Pasar Ramadhan"
@@ -100,7 +100,7 @@ export default function Search() {
                         <BorderBottomItem
                            icon={
                               <View style={[Styles.iconContent, ColorsStatus.primary]}>
-                                 <AntDesign name="areachart" size={30} color="white" />
+                                 <AntDesign name="areachart" size={25} color="white" />
                               </View>
                            }
                            title="Pasar Ramadhan"

components/borderBottomItem.tsx

@@ -18,7 +18,7 @@ export default function BorderBottomItem({ title, subtitle, icon, desc, onPress,
             <View style={[Styles.rowSpaceBetween, { width: '85%' }]}>
                <View style={[Styles.ml10]}>
                   <Text style={[Styles.textDefaultSemiBold]}>{title}</Text>
-                  <Text style={[Styles.textMediumNormal]}>{subtitle}</Text>
+                  {subtitle && <Text style={[Styles.textMediumNormal]}>{subtitle}</Text>}
                </View>
                {
                   rightTopInfo && <Text style={[Styles.textInformation]}>{rightTopInfo}</Text>

constants/Styles.ts

@@ -249,8 +249,8 @@ const Styles = StyleSheet.create({
       borderBottomWidth: 1,
    },
    userProfileSmall: {
-      width: 50,
+      width: 48,
-      height: 50,
+      height: 48,
       borderRadius: 100
    },
    iconContent: {