1  import {StyleSheet} from 'react-native';
  2  
  3  const sharedStyles = {
  4    container: {
  5      flex: 1,
  6      justifyContent: 'center',
  7      alignItems: 'center',
  8      backgroundColor: '#cdabf8',
  9      paddingHorizontal: 20,
 10    },
 11    text: {
 12      fontSize: 18,
 13      textAlign: 'center',
 14      marginVertical: 20,
 15      color: '#042431',
 16    },
 17    buttonContainer: {
 18      flexDirection: 'row',
 19      justifyContent: 'space-around',
 20      marginVertical: 20,
 21    },
 22    button: {
 23      backgroundColor: '#450291',
 24      paddingVertical: 15,
 25      paddingHorizontal: 20,
 26      borderRadius: 10,
 27      textAlign: 'center',
 28      marginHorizontal: 10,
 29    },
 30    buttonText: {
 31      color: 'white',
 32      fontSize: 14,
 33    },
 34  }
 35  
 36  export const homeStyles = StyleSheet.create({
 37    ...sharedStyles,
 38    logo: {
 39      height: 500,
 40    },
 41    tagline: {
 42      fontSize: 24,
 43      margin: 30,
 44      color: '#042431',
 45    },
 46  });
 47  
 48  export const drawerStyles = StyleSheet.create({
 49    drawerHeader: {
 50      padding: 16,
 51      backgroundColor: '#f5f5f5',
 52    },
 53    drawerHeaderText: {
 54      fontSize: 18,
 55      fontWeight: 'bold',
 56    },
 57  });
 58  
 59  export const cameraStyles = StyleSheet.create({
 60    ...sharedStyles,
 61    container: {flex: 1, flexDirection: 'column', backgroundColor: '#cdabf8'},
 62    preview: {flex: 1, justifyContent: 'flex-end', alignItems: 'center'},
 63  });
 64  
 65  export const photoScreenStyles = StyleSheet.create({
 66    ...sharedStyles,
 67    timerContainer: {
 68      justifyContent: 'center',
 69      alignItems: 'center',
 70      marginBottom: 40,
 71    },
 72    timerText: {
 73      position: 'absolute',
 74      fontSize: 24,
 75      fontWeight: 'bold',
 76      color: '#042431',
 77    },
 78    photo: {
 79      width: 375,
 80      height: 375,
 81      marginBottom: 20,
 82    },
 83    noPhotoText: {
 84      fontSize: 36,
 85      color: '#042431',
 86    },
 87  });
 88  
 89  export const processingStyles = StyleSheet.create({
 90    ...sharedStyles,
 91  });
 92  
 93  export const permissionDeniedStyles = StyleSheet.create({
 94    ...sharedStyles,
 95  });
 96  
 97  export const skipStyles = StyleSheet.create({
 98    ...sharedStyles,
 99    message: {
100      fontSize: 28,
101      marginBottom: 50,
102      textAlign: 'center',
103      color: '#042431',
104    },
105  });
106  
107  export const headerStyles = StyleSheet.create({
108    header: {
109      height: 80,
110      flexDirection: 'row',
111      justifyContent: 'space-between',
112      alignItems: 'center',
113      backgroundColor: '#cdabf8',
114      paddingHorizontal: 15,
115      paddingTop: 30,
116    },
117    logo: {
118      width: 30,
119      height: 40,
120      resizeMode: 'contain',
121    },
122    modalContainer: {
123      flex: 1,
124      flexDirection: 'row',
125      justifyContent: 'flex-end',
126    },
127    sidebar: {
128      width: '80%',
129      height: '100%',
130      backgroundColor: '#450291',
131      paddingHorizontal: 40,
132      justifyContent: 'center',
133    },
134    closeIcon: {
135      position: 'absolute',
136      top: 15,
137      right: 15,
138    },
139    sidebarItem: {
140      color: '#fff',
141      fontSize: 18,
142      marginVertical: 10,
143    },
144  });