fixed

screens/logbook.js

@@ -77,7 +77,7 @@ class LogBook extends React.PureComponent {
                     backgroundColor: 'white',
                     borderBottomWidth:1,
                   }}>
-                  <View style={{alignItems: 'center',marginRight:5}}>
+                  <View style={{alignItems: 'center',marginRight:8}}>
                   <View>
                   <Text style={{color:'black', fontSize: 40,textAlign: 'center'}}>{(item.date !== undefined) ? item.date.split(' ')[0].trim() : ''}</Text>
                   <Text style={{color:'black', fontSize: 15, textAlign: 'center'}}>{(item.date !== undefined) ? item.date.split(' ')[1].trim() : ''}</Text>

screens/quiz.js

@@ -59,7 +59,6 @@ const NOTESFF1 = [{name: 'F#2', url: require('../sound/f_ff.mp3')}];
 const NOTESGG1 = [{name: 'G#2', url: require('../sound/g_gg.mp3')}];
 const NOTESAA1 = [{name: 'A#2', url: require('../sound/a_aa.mp3')}];
 const keywordsList = [];
-const exitApp = () => BackHandler.exitApp();
 
 var imageN = '';
 var indexN = 0;
@@ -781,8 +780,15 @@ this.setState({records: []});
       SbuttonB51,
     } = styles;
 
-    const CorrectAlertBox = () =>{
     return (
+      <View style={styles.container}>
+       <ImageBackground
+          source={require('../img/background.jpg')}
+          style={{
+            width: '100%',
+            height: '100%',
+          }}>
+
         <Modal transparent={true} visible={this.state.showC}  animationType="slide">
          <View style={{backgroundColor: '#000000aa', flex: 1}}>
           <View
@@ -819,11 +825,7 @@ this.setState({records: []});
             </View>
           </View>
         </Modal>
-    );
-   };
 
-   const WrongAlertBox = () =>{
-    return (
          <Modal transparent={true} visible={this.state.showW} animationType="slide">
          <View style={{backgroundColor: '#000000aa', flex: 1}}>
           <View
@@ -860,11 +862,7 @@ this.setState({records: []});
             </View>
           </View>
         </Modal>
-    );
-   };
 
-     const DoneAlertBox = () =>{
-    return (
         <Modal transparent={true} visible={this.state.showDone} animationType="slide">
          <View style={{backgroundColor: '#000000aa', flex: 1}}>
            <View
@@ -895,20 +893,7 @@ this.setState({records: []});
             </View>
           </View>
         </Modal>
-    );
-   };
 
-    return (
-      <View style={styles.container}>
-       <ImageBackground
-          source={require('../img/background.jpg')}
-          style={{
-            width: '100%',
-            height: '100%',
-          }}>
-        <CorrectAlertBox />
-        <WrongAlertBox />
-        <DoneAlertBox />
         <StatusBar hidden />
         <View style={styles.c1}>
           <View style={styles.cc1}>

screens/settings.js

@@ -6,13 +6,14 @@ import {
   ImageBackground,
   Text,
   View,
-  TouchableOpacity,
+  //TouchableOpacity,
   StyleSheet,
   Image,
   ScrollView,
   Dimensions,
  // TextInput,
  BackHandler,
+ Pressable,
 } from 'react-native';
 import Orientation from 'react-native-orientation';
 import Notes from './data';
@@ -229,14 +230,14 @@ export default class Settings extends React.Component {
                 }}>
                 {Notes.map((item, id) => (
                   <View key={id}>
-                    <TouchableOpacity
+                    <Pressable
                       style={
                         notes.find((element) => element === item.name)
                           ? styles.selectedKeywordStyle
                           : styles.buttonStyle
                       }
                       onPress={() => this.toggleKeyword(item.name)}
-                      key={id} activeOpacity={1.0}>
+                      key={id}>
                       <Image
                         source={item.image}
                         style={{
@@ -247,7 +248,7 @@ export default class Settings extends React.Component {
                       <Text style={{textAlign: 'center', paddingBottom: 10}}>
                         {item.name}
                       </Text>
-                    </TouchableOpacity>
+                    </Pressable>
                   </View>
                 ))}
               </View>
@@ -274,7 +275,7 @@ const styles = StyleSheet.create({
     borderColor: 'white',
     borderRadius: 10,
     backgroundColor: 'rgba(52, 52, 52, 0.0)',
-    //opacity: 0.5,
+    opacity:0.4,
     padding: 10,
     marginRight: config.deviceWidth * 0.03,
     marginBottom: config.deviceHeight * 0.03,
@@ -287,7 +288,6 @@ const styles = StyleSheet.create({
     borderColor: 'black',
      backgroundColor: 'white',
    // backgroundColor: 'rgba(0,0,0,0)',
-  // opacity: 0.5,
     borderRadius: 10,
     marginRight: config.deviceWidth * 0.03,
     marginBottom: config.deviceHeight * 0.03,