diff --git a/src/screens/Service.js b/src/screens/Service.js
index 68c29fe..efc5edb 100644
--- a/src/screens/Service.js
+++ b/src/screens/Service.js
@@ -1,5 +1,5 @@
 import React, { useEffect, useCallback, useMemo, useState, useRef } from 'react';
-import { Icon, Card, Text, Avatar, useTheme, IconButton, MD3Colors, Button } from 'react-native-paper';
+import { Icon, Card, Text, Avatar, useTheme, IconButton, MD3Colors, Button, TouchableRipple } from 'react-native-paper';
 import { RefreshControl, StyleSheet, View, ScrollView, Image, Dimensions } from 'react-native';
 import ilustration from '../assets/images/checked.png';
 import danger from '../assets/images/danger.png';
@@ -14,105 +14,117 @@ export default function ServiceScreen({ route, navigation }) {
     return (
         <View style={styles.container}>
             <Card elevation={4} style={{ marginHorizontal: 10, marginVertical: 6, marginTop: 10, backgroundColor: colors.beanRed }}>
-                <View style={styles.cardContent}>
-                    <View style={styles.leftContent}>
-                        <Text style={[styles.Text, { color: colors.pureWhite }]}>LAPORAN KEJADIAN</Text>
-                        <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Laporan kejadian wajib diisi jika ada kejadian di tempat project</Text>
-                        <Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 7, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.beanRed }} onPress={() => { navigation.navigate('IncidentScreen') }}>
-                            ISI
-                        </Button>
+                <TouchableRipple onPress={() => { navigation.navigate('IncidentScreen') }}>
+                    <View style={styles.cardContent}>
+                        <View style={styles.leftContent}>
+                            <Text style={[styles.Text, { color: colors.pureWhite }]}>LAPORAN KEJADIAN</Text>
+                            <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Laporan kejadian wajib diisi jika ada kejadian di tempat project</Text>
+                            <Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 7, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.beanRed }} onPress={() => { navigation.navigate('IncidentScreen') }}>
+                                ISI
+                            </Button>
+                        </View>
+                        <View style={styles.rightContent}>
+                            <Image
+                                alt="danger"
+                                source={danger}
+                                style={{ width: '100%', height: Dimensions.get('window').height / 12 }}
+                                resizeMode="contain"
+                            />
+                        </View>
                     </View>
-                    <View style={styles.rightContent}>
-                        <Image
-                            alt="danger"
-                            source={danger}
-                            style={{ width: '100%', height: Dimensions.get('window').height / 12 }}
-                            resizeMode="contain"
-                        />
-                    </View>
-                </View>
+                </TouchableRipple>
             </Card>
 
             <View style={{ flexDirection: 'row', justifyContent: 'space-between', marginHorizontal: 10 }}>
                 <Card elevation={4} style={styles.card}>
-                    <View style={styles.cardContentIncident}>
-                        <Image
-                            alt="Activity"
-                            source={activity}
-                            style={{ width: '100%', height: Dimensions.get('window').height / 15 }}
-                            resizeMode="contain"
-                        />
-                        <Text style={[styles.Text, { color: colors.pureWhite }]}>Laporan Kegiatan</Text>
-                        <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Wajib mengisi Kegiatan</Text>
-                        <Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('DialogFormIncident') }}>
-                            ISI
-                        </Button>
-                    </View>
+                    <TouchableRipple onPress={() => { navigation.navigate('ActivityScreen') }}>
+                        <View style={styles.cardContentIncident}>
+                            <Image
+                                alt="Activity"
+                                source={activity}
+                                style={{ width: '100%', height: Dimensions.get('window').height / 15 }}
+                                resizeMode="contain"
+                            />
+                            <Text style={[styles.Text, { color: colors.pureWhite }]}>Laporan Kegiatan</Text>
+                            <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Wajib mengisi Kegiatan</Text>
+                            <Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('ActivityScreen') }}>
+                                ISI
+                            </Button>
+                        </View>
+                    </TouchableRipple>
                 </Card >
                 <Card elevation={4} style={styles.card}>
-                    <View style={styles.cardContentIncident}>
-                        <Image
-                            alt="ilustration"
-                            source={ilustration}
-                            style={{ width: '100%', height: Dimensions.get('window').height / 15 }}
-                            resizeMode="contain"
-                        />
-                        <Text style={[styles.Text, { color: colors.pureWhite }]}>Laporan Harian</Text>
-                        <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Wajib di isi setiap hari</Text>
-                        <Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('DialogFormIncident') }}>
-                            ISI
-                        </Button>
-                    </View>
+                    <TouchableRipple onPress={() => { navigation.navigate('DailyReportScreen') }}>
+                        <View style={styles.cardContentIncident}>
+                            <Image
+                                alt="ilustration"
+                                source={ilustration}
+                                style={{ width: '100%', height: Dimensions.get('window').height / 15 }}
+                                resizeMode="contain"
+                            />
+                            <Text style={[styles.Text, { color: colors.pureWhite }]}>Laporan Harian</Text>
+                            <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Wajib di isi setiap hari</Text>
+                            <Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('DailyReportScreen') }}>
+                                ISI
+                            </Button>
+                        </View>
+                    </TouchableRipple>
                 </Card >
             </View>
 
             <View style={{ flexDirection: 'row', justifyContent: 'space-between', marginHorizontal: 10, marginTop: 5 }}>
                 <Card elevation={4} style={styles.card}>
-                    <View style={styles.cardContentIncident}>
-                        <Image
-                            alt="patroli"
-                            source={patroli}
-                            style={{ width: '100%', height: Dimensions.get('window').height / 15 }}
-                            resizeMode="contain"
-                        />
-                        <Text style={[styles.Text, { color: colors.pureWhite }]}>Patroli</Text>
-                        <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Patroli setiap Pos</Text>
-                        <Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, marginBottom: 5, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('PatroliScreen') }}>
-                            ISI
-                        </Button>
-                    </View>
+                    <TouchableRipple onPress={() => { navigation.navigate('PatroliScreen') }}>
+                        <View style={styles.cardContentIncident}>
+                            <Image
+                                alt="patroli"
+                                source={patroli}
+                                style={{ width: '100%', height: Dimensions.get('window').height / 15 }}
+                                resizeMode="contain"
+                            />
+                            <Text style={[styles.Text, { color: colors.pureWhite }]}>Patroli</Text>
+                            <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Patroli setiap Pos</Text>
+                            <Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, marginBottom: 5, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('PatroliScreen') }}>
+                                ISI
+                            </Button>
+                        </View>
+                    </TouchableRipple>
                 </Card >
                 <Card elevation={4} style={styles.card}>
+                    <TouchableRipple onPress={() => { navigation.navigate('PresenceScreen') }}>
+                        <View style={styles.cardContentIncident}>
+                            <Image
+                                alt="calender"
+                                source={calender}
+                                style={{ width: '100%', height: Dimensions.get('window').height / 15 }}
+                                resizeMode="contain"
+                            />
+                            <Text style={[styles.Text, { color: colors.pureWhite }]}>Kehadiran</Text>
+                            <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Lihat riwayat kehadiran</Text>
+                            <Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, marginBottom: 5, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('PresenceScreen') }}>
+                                ISI
+                            </Button>
+                        </View>
+                    </TouchableRipple>
+                </Card >
+            </View>
+
+            <Card elevation={4} style={{ marginHorizontal: 10, marginVertical: 6, backgroundColor: colors.beanRed }}>
+                <TouchableRipple onPress={() => { navigation.navigate('DialogFormIncident') }}>
                     <View style={styles.cardContentIncident}>
                         <Image
-                            alt="calender"
-                            source={calender}
-                            style={{ width: '100%', height: Dimensions.get('window').height / 15 }}
+                            alt="danger-2"
+                            source={danger2}
+                            style={{ width: '100%', height: Dimensions.get('window').height / 12 }}
                             resizeMode="contain"
                         />
-                        <Text style={[styles.Text, { color: colors.pureWhite }]}>Kehadiran</Text>
-                        <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Lihat riwayat kehadiran</Text>
-                        <Button mode="contained" compact={true} style={{ borderRadius: 10, marginTop: 10, marginBottom: 5, backgroundColor: 'white', width: '100%' }} labelStyle={{ color: colors.blue }} onPress={() => { navigation.navigate('PresenceScreen') }}>
-                            ISI
+                        <Text style={[styles.Text, { color: colors.pureWhite }]}>TOMBOL PANIK</Text>
+                        <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Tekan tombol ini jika terjadi insiden</Text>
+                        <Button mode="contained" style={{ marginTop: 10, marginBottom: 5, backgroundColor: 'white', width: '100%', borderRadius: 10 }} labelStyle={{ color: colors.beanRed }} onPress={() => { navigation.navigate('DialogFormIncident') }}>
+                            TEKAN
                         </Button>
                     </View>
-                </Card >
-            </View>
-
-            <Card elevation={4} style={{ marginHorizontal: 10, marginVertical: 6, backgroundColor: colors.beanRed }}>
-                <View style={styles.cardContentIncident}>
-                    <Image
-                        alt="danger-2"
-                        source={danger2}
-                        style={{ width: '100%', height: Dimensions.get('window').height / 12 }}
-                        resizeMode="contain"
-                    />
-                    <Text style={[styles.Text, { color: colors.pureWhite }]}>TOMBOL PANIK</Text>
-                    <Text variant="bodySmall" style={[styles.subText, { color: colors.pureWhite }]} >Tekan tombol ini jika terjadi insiden</Text>
-                    <Button mode="contained" style={{ marginTop: 10, marginBottom: 5, backgroundColor: 'white', width: '100%', borderRadius: 10 }} labelStyle={{ color: colors.beanRed }} onPress={() => { navigation.navigate('DialogFormIncident') }}>
-                        TEKAN
-                    </Button>
-                </View>
+                </TouchableRipple>
             </Card>
         </View >
     )
@@ -121,7 +133,8 @@ export default function ServiceScreen({ route, navigation }) {
 const styles = StyleSheet.create({
     container: {
         flex: 1,
-        marginTop: 30
+        marginTop: 30,
+        backgroundColor: colors.pureWhite
     },
     Text: {
         fontSize: 16,