martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-02-14 12:39:17 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

extending blocked modal stubs

Browse Source
This commit is contained in:
balzack 2023-09-04 18:12:49 -07:00
parent 2c03abdeb3
commit 67221f3363
3 changed files with 68 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
app/mobile/src/constants/Colors.js
View File

@ -28,6 +28,8 @@ const LightColors = {
disabledButtonText: '#aaaaaa', disabledButtonText: '#aaaaaa',
dangerButton: '#ff5555', dangerButton: '#ff5555',
dangerButtonText: '#ffffff', dangerButtonText: '#ffffff',
closeButton: '#eeeeee',
closeButtonText: '#444444',
inputBase: '#eeeeee', inputBase: '#eeeeee',
inputPlaceholder: '#888888', inputPlaceholder: '#888888',
inputText: '#444444', inputText: '#444444',
@ -38,7 +40,7 @@ const LightColors = {
confirmedIndicator: '#88bb00', confirmedIndicator: '#88bb00',
unknownIndicator: '#dddddd', unknownIndicator: '#dddddd',
errorIndicator: '#ffaaaa', errorIndicator: '#ffaaaa',
horizontalDivider: '#eeeeee', horizontalDivider: '#bbbbbb',
verticalDivider: '#aaaaaa', verticalDivider: '#aaaaaa',
unreadIndicator: '#00aa00', unreadIndicator: '#00aa00',
enabledIndicator: '#8fbea7', enabledIndicator: '#8fbea7',
@ -75,6 +77,8 @@ const DarkColors = {
disabledButtonText: '#aaaaaa', disabledButtonText: '#aaaaaa',
dangerButton: '#ff5555', dangerButton: '#ff5555',
dangerButtonText: '#ffffff', dangerButtonText: '#ffffff',
closeButton: '#111111',
closeButtonText: '#ffffff',
inputBase: '#333333', inputBase: '#333333',
inputPlaceholder: '#aaaaaa', inputPlaceholder: '#aaaaaa',
inputText: '#eeeeee', inputText: '#eeeeee',
@ -85,7 +89,7 @@ const DarkColors = {
confirmedIndicator: '#88bb00', confirmedIndicator: '#88bb00',
unknownIndicator: '#dddddd', unknownIndicator: '#dddddd',
errorIndicator: '#ffaaaa', errorIndicator: '#ffaaaa',
horizonalDivider: '#888888', horizontalDivider: '#888888',
verticalDivider: '#aaaaaa', verticalDivider: '#aaaaaa',
unreadIndicator: '#00aa00', unreadIndicator: '#00aa00',
enabledIndicator: '#8fbea7', enabledIndicator: '#8fbea7',
@ -126,6 +130,8 @@ export const Colors = {
disabledButtonText: getColor('disabledButtonText'), disabledButtonText: getColor('disabledButtonText'),
dangerButton: getColor('dangerButton'), dangerButton: getColor('dangerButton'),
dangerButtonText: getColor('dangerButtonText'), dangerButtonText: getColor('dangerButtonText'),
closeButton: getColor('closeButton'),
closeButtonText: getColor('closeButtonText'),
inputBase: getColor('inputBase'), inputBase: getColor('inputBase'),
inputPlaceholder: getColor('inputPlaceholder'), inputPlaceholder: getColor('inputPlaceholder'),
inputText: getColor('inputText'), inputText: getColor('inputText'),
@ -136,7 +142,7 @@ export const Colors = {
confirmedIndicator: getColor('confirmedIndicator'), confirmedIndicator: getColor('confirmedIndicator'),
unknownIndicator: getColor('unknownIndicator'), unknownIndicator: getColor('unknownIndicator'),
errorIndicator: getColor('errorIndicator'), errorIndicator: getColor('errorIndicator'),
horizonalDivider: getColor('horizontalDivider'), horizontalDivider: getColor('horizontalDivider'),
verticalDivider: getColor('verticalDivider'), verticalDivider: getColor('verticalDivider'),
unreadIndicator: getColor('unreadIndicator'), unreadIndicator: getColor('unreadIndicator'),
enabledIndicator: getColor('enabledIndicator'), enabledIndicator: getColor('enabledIndicator'),

32
app/mobile/src/session/settings/Settings.jsx
View File

@ -271,7 +271,7 @@ export function Settings() {
<BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black"> <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black">
<View style={styles.modalContainer}> <View style={styles.modalContainer}>
<View style={styles.modalClose}> <View style={styles.modalClose}>
<TouchableOpacity style={styles.closeButton} activeOpacity={1} onPress={actions.hideEditSeal}> <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideEditSeal}>
<MatIcons name="close" size={20} color={Colors.descriptionText} /> <MatIcons name="close" size={20} color={Colors.descriptionText} />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
@ -482,7 +482,7 @@ export function Settings() {
<BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black"> <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black">
<View style={styles.modalContainer}> <View style={styles.modalContainer}>
<View style={styles.modalClose}> <View style={styles.modalClose}>
<TouchableOpacity style={styles.closeButton} activeOpacity={1} onPress={actions.hideLogin}> <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideLogin}>
<MatIcons name="close" size={20} color={Colors.descriptionText} /> <MatIcons name="close" size={20} color={Colors.descriptionText} />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
@ -561,7 +561,7 @@ export function Settings() {
<BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black"> <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black">
<View style={styles.modalContainer}> <View style={styles.modalContainer}>
<View style={styles.modalClose}> <View style={styles.modalClose}>
<TouchableOpacity style={styles.closeButton} activeOpacity={1} onPress={actions.hideDelete}> <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideDelete}>
<MatIcons name="close" size={20} color={Colors.descriptionText} /> <MatIcons name="close" size={20} color={Colors.descriptionText} />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
@ -608,12 +608,18 @@ export function Settings() {
<BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black"> <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black">
<View style={styles.modalContainer}> <View style={styles.modalContainer}>
<View style={styles.modalClose}> <View style={styles.modalClose}>
<TouchableOpacity style={styles.closeButton} activeOpacity={1} onPress={actions.hideBlockedContacts}> <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideBlockedContacts}>
<MatIcons name="close" size={20} color={Colors.descriptionText} /> <MatIcons name="close" size={20} color={Colors.descriptionText} />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<Text style={styles.modalHeader}>{ state.strings.blockedContacts }</Text> <Text style={styles.modalHeader}>{ state.strings.blockedContacts }</Text>
<ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} /> <ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} />
<View style={styles.modalList}></View>
<View style={styles.rightButton}>
<TouchableOpacity style={styles.closeButton} activeOpacity={1} onPress={actions.hideBlockedContacts}>
<Text style={styles.closeButtonText}>{ state.strings.close }</Text>
</TouchableOpacity>
</View>
</View> </View>
</BlurView> </BlurView>
</Modal> </Modal>
@ -628,12 +634,18 @@ export function Settings() {
<BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black"> <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black">
<View style={styles.modalContainer}> <View style={styles.modalContainer}>
<View style={styles.modalClose}> <View style={styles.modalClose}>
<TouchableOpacity style={styles.closeButton} activeOpacity={1} onPress={actions.hideBlockedTopics}> <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideBlockedTopics}>
<MatIcons name="close" size={20} color={Colors.descriptionText} /> <MatIcons name="close" size={20} color={Colors.descriptionText} />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<Text style={styles.modalHeader}>{ state.strings.blockedContacts }</Text> <Text style={styles.modalHeader}>{ state.strings.blockedContacts }</Text>
<ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} /> <ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} />
<View style={styles.modalList}></View>
<View style={styles.rightButton}>
<TouchableOpacity style={styles.closeButton} activeOpacity={1} onPress={actions.hideBlockedTopics}>
<Text style={styles.closeButtonText}>{ state.strings.close }</Text>
</TouchableOpacity>
</View>
</View> </View>
</BlurView> </BlurView>
</Modal> </Modal>
@ -648,17 +660,21 @@ export function Settings() {
<BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black"> <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black">
<View style={styles.modalContainer}> <View style={styles.modalContainer}>
<View style={styles.modalClose}> <View style={styles.modalClose}>
<TouchableOpacity style={styles.closeButton} activeOpacity={1} onPress={actions.hideBlockedMessages}> <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideBlockedMessages}>
<MatIcons name="close" size={20} color={Colors.descriptionText} /> <MatIcons name="close" size={20} color={Colors.descriptionText} />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<Text style={styles.modalHeader}>{ state.strings.blockedContacts }</Text> <Text style={styles.modalHeader}>{ state.strings.blockedContacts }</Text>
<ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} /> <ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} />
<View style={styles.modalList}></View>
<View style={styles.rightButton}>
<TouchableOpacity style={styles.closeButton} activeOpacity={1} onPress={actions.hideBlockedMessages}>
<Text style={styles.closeButtonText}>{ state.strings.close }</Text>
</TouchableOpacity>
</View>
</View> </View>
</BlurView> </BlurView>
</Modal> </Modal>
</SafeAreaView> </SafeAreaView>
</ScrollView> </ScrollView>

38
app/mobile/src/session/settings/Settings.styled.js
View File

@ -20,6 +20,9 @@ export const styles = StyleSheet.create({
display: 'flex', display: 'flex',
flexDirection: 'row', flexDirection: 'row',
}, },
dismissButton: {
padding: 12,
},
idleRadioCircle: { idleRadioCircle: {
borderWidth: 1, borderWidth: 1,
borderColor: Colors.activeBorder, borderColor: Colors.activeBorder,
@ -138,9 +141,6 @@ export const styles = StyleSheet.create({
display: 'flex', display: 'flex',
alignItems: 'flex-end', alignItems: 'flex-end',
}, },
closeButton: {
padding: 12,
},
modalBusy: { modalBusy: {
}, },
modalDescription: { modalDescription: {
@ -232,6 +232,23 @@ export const styles = StyleSheet.create({
color: Colors.dangerButtonText, color: Colors.dangerButtonText,
fontFamily: 'Roboto', fontFamily: 'Roboto',
}, },
closeButton: {
marginTop: 8,
marginBottom: 16,
marginRight: 16,
paddingTop: 8,
paddingBottom: 8,
paddingLeft: 32,
paddingRight: 32,
borderRadius: 4,
borderWidth: 1,
borderColor: Colors.cancelButton,
backgroundColor: Colors.closeButton,
},
closeButtonText: {
color: Colors.closeButtonText,
fontFamily: 'Roboto',
},
cancelButton: { cancelButton: {
marginTop: 8, marginTop: 8,
marginBottom: 16, marginBottom: 16,
@ -292,5 +309,20 @@ export const styles = StyleSheet.create({
notAvailable: { notAvailable: {
color: Colors.dangerText, color: Colors.dangerText,
}, },
rightButton: {
width: '100%',
display: 'flex',
alignItems: 'flex-end',
},
modalList: {
width: '100%',
minHeight: 128,
maxHeight: 256,
borderTopWidth: 1,
borderBottomWidth: 1,
marginBottom: 8,
borderColor: Colors.horizontalDivider,
display: 'flex'
},
}); });