more styling tweaks

This commit is contained in:
balzack 2025-01-16 22:19:10 -08:00
parent 48d017f170
commit 7dc22cd774
3 changed files with 16 additions and 14 deletions

View File

@ -191,7 +191,8 @@ export const styles = StyleSheet.create({
paddingVertical: 6, paddingVertical: 6,
}, },
members: { members: {
height: 200, height: 256,
borderRadius: 4,
}, },
membersContainer: {}, membersContainer: {},
subjectInput: { subjectInput: {
@ -208,6 +209,7 @@ export const styles = StyleSheet.create({
}, },
subjectContainer: { subjectContainer: {
marginBottom: 8, marginBottom: 8,
borderRadius: 4,
}, },
cards: { cards: {
display: 'flex', display: 'flex',

View File

@ -152,7 +152,7 @@ export function Content({openConversation, textCard}: {openConversation: ()=>voi
<View style={styles.modal}> <View style={styles.modal}>
<BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" /> <BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" />
<View style={styles.addContainer}> <View style={styles.addContainer}>
<Surface elevation={5} mode="flat" style={styles.addSurface}> <Surface elevation={4} mode="flat" style={styles.addSurface}>
<Text style={styles.addLabel}>{state.strings.newTopic}</Text> <Text style={styles.addLabel}>{state.strings.newTopic}</Text>
<IconButton style={styles.addClose} icon="close" size={24} onPress={() => setAdd(false)} /> <IconButton style={styles.addClose} icon="close" size={24} onPress={() => setAdd(false)} />
<Surface elevation={0} style={styles.subjectContainer}> <Surface elevation={0} style={styles.subjectContainer}>
@ -219,10 +219,10 @@ export function Content({openConversation, textCard}: {openConversation: ()=>voi
</View> </View>
)} )}
</View> </View>
<Button mode="outlined" compact={true} style={styles.cancel} labelStyle={styles.cancelLabel} onPress={() => setAdd(false)}> <Button mode="outlined" onPress={() => setAdd(false)}>
{state.strings.cancel} {state.strings.cancel}
</Button> </Button>
<Button mode="contained" compact={true} style={styles.create} labelStyle={styles.createLabel} loading={adding} onPress={addTopic}> <Button mode="contained" loading={adding} onPress={addTopic}>
{state.strings.create} {state.strings.create}
</Button> </Button>
</View> </View>

View File

@ -657,7 +657,7 @@ export function Settings({showLogout}: {showLogout: boolean}) {
<View style={styles.modal}> <View style={styles.modal}>
<BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" /> <BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" />
<KeyboardAwareScrollView enableOnAndroid={true} style={styles.container} contentContainerStyle={styles.content}> <KeyboardAwareScrollView enableOnAndroid={true} style={styles.container} contentContainerStyle={styles.content}>
<Surface elevation={3} mode="flat" style={styles.surface}> <Surface elevation={4} mode="flat" style={styles.surface}>
<Text style={styles.modalLabel}>{state.strings.manageTopics}</Text> <Text style={styles.modalLabel}>{state.strings.manageTopics}</Text>
<IconButton style={styles.modalClose} icon="close" size={24} onPress={() => setSealing(false)} /> <IconButton style={styles.modalClose} icon="close" size={24} onPress={() => setSealing(false)} />
{!sealDelete && !sealReset && state.config.sealSet && state.config.sealUnlocked && ( {!sealDelete && !sealReset && state.config.sealSet && state.config.sealUnlocked && (
@ -875,7 +875,7 @@ export function Settings({showLogout}: {showLogout: boolean}) {
<View style={styles.modal}> <View style={styles.modal}>
<BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" /> <BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" />
<KeyboardAwareScrollView enableOnAndroid={true} style={styles.container} contentContainerStyle={styles.content}> <KeyboardAwareScrollView enableOnAndroid={true} style={styles.container} contentContainerStyle={styles.content}>
<Surface elevation={3} mode="flat" style={styles.surface}> <Surface elevation={4} mode="flat" style={styles.surface}>
<Text style={styles.modalLabel}>{state.strings.profileDetails}</Text> <Text style={styles.modalLabel}>{state.strings.profileDetails}</Text>
<IconButton style={styles.modalClose} icon="close" size={24} onPress={() => setDetails(false)} /> <IconButton style={styles.modalClose} icon="close" size={24} onPress={() => setDetails(false)} />
<TextInput <TextInput
@ -928,7 +928,7 @@ export function Settings({showLogout}: {showLogout: boolean}) {
<View style={styles.modal}> <View style={styles.modal}>
<BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" /> <BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" />
<KeyboardAwareScrollView enableOnAndroid={true} style={styles.container} contentContainerStyle={styles.content}> <KeyboardAwareScrollView enableOnAndroid={true} style={styles.container} contentContainerStyle={styles.content}>
<Surface elevation={3} mode="flat" style={styles.surface}> <Surface elevation={4} mode="flat" style={styles.surface}>
<Text style={styles.modalLabel}>{state.strings.mfaTitle}</Text> <Text style={styles.modalLabel}>{state.strings.mfaTitle}</Text>
<IconButton style={styles.modalClose} icon="close" size={24} onPress={() => setAuth(false)} /> <IconButton style={styles.modalClose} icon="close" size={24} onPress={() => setAuth(false)} />
<Text style={styles.modalDescription}>{state.strings.mfaSteps}</Text> <Text style={styles.modalDescription}>{state.strings.mfaSteps}</Text>
@ -965,7 +965,7 @@ export function Settings({showLogout}: {showLogout: boolean}) {
<View style={styles.modal}> <View style={styles.modal}>
<BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" /> <BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" />
<KeyboardAwareScrollView enableOnAndroid={true} style={styles.container} contentContainerStyle={styles.content}> <KeyboardAwareScrollView enableOnAndroid={true} style={styles.container} contentContainerStyle={styles.content}>
<Surface elevation={3} mode="flat" style={styles.surface}> <Surface elevation={4} mode="flat" style={styles.surface}>
<Text style={styles.modalLabel}>{state.strings.mfaTitle}</Text> <Text style={styles.modalLabel}>{state.strings.mfaTitle}</Text>
<IconButton style={styles.modalClose} icon="close" size={24} onPress={() => setClear(false)} /> <IconButton style={styles.modalClose} icon="close" size={24} onPress={() => setClear(false)} />
<Text style={styles.modalDescription}>{state.strings.disablePrompt}</Text> <Text style={styles.modalDescription}>{state.strings.disablePrompt}</Text>
@ -986,7 +986,7 @@ export function Settings({showLogout}: {showLogout: boolean}) {
<View style={styles.modal}> <View style={styles.modal}>
<BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" /> <BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" />
<KeyboardAwareScrollView enableOnAndroid={true} style={styles.container} contentContainerStyle={styles.content}> <KeyboardAwareScrollView enableOnAndroid={true} style={styles.container} contentContainerStyle={styles.content}>
<Surface elevation={3} mode="flat" style={styles.surface}> <Surface elevation={4} mode="flat" style={styles.surface}>
<Text style={styles.modalLabel}>{state.strings.changeLogin}</Text> <Text style={styles.modalLabel}>{state.strings.changeLogin}</Text>
<IconButton style={styles.modalClose} icon="close" size={24} onPress={() => setChange(false)} /> <IconButton style={styles.modalClose} icon="close" size={24} onPress={() => setChange(false)} />
<TextInput <TextInput
@ -1064,7 +1064,7 @@ export function Settings({showLogout}: {showLogout: boolean}) {
<View style={styles.modal}> <View style={styles.modal}>
<BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" /> <BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" />
<KeyboardAwareScrollView enableOnAndroid={true} style={styles.container} contentContainerStyle={styles.content}> <KeyboardAwareScrollView enableOnAndroid={true} style={styles.container} contentContainerStyle={styles.content}>
<Surface elevation={3} mode="flat" style={styles.surface}> <Surface elevation={4} mode="flat" style={styles.surface}>
<Text style={styles.modalLabel}>{state.strings.loggingOut}</Text> <Text style={styles.modalLabel}>{state.strings.loggingOut}</Text>
<IconButton style={styles.modalClose} icon="close" size={24} onPress={() => setLogout(false)} /> <IconButton style={styles.modalClose} icon="close" size={24} onPress={() => setLogout(false)} />
@ -1089,7 +1089,7 @@ export function Settings({showLogout}: {showLogout: boolean}) {
<View style={styles.modal}> <View style={styles.modal}>
<BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" /> <BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" />
<KeyboardAwareScrollView enableOnAndroid={true} style={styles.container} contentContainerStyle={styles.content}> <KeyboardAwareScrollView enableOnAndroid={true} style={styles.container} contentContainerStyle={styles.content}>
<Surface elevation={3} mode="flat" style={styles.surface}> <Surface elevation={4} mode="flat" style={styles.surface}>
<Text style={styles.modalLabel}>{state.strings.deleteAccount}</Text> <Text style={styles.modalLabel}>{state.strings.deleteAccount}</Text>
<IconButton style={styles.modalClose} icon="close" size={24} onPress={() => setRemove(false)} /> <IconButton style={styles.modalClose} icon="close" size={24} onPress={() => setRemove(false)} />
@ -1120,7 +1120,7 @@ export function Settings({showLogout}: {showLogout: boolean}) {
<Modal animationType="fade" transparent={true} supportedOrientations={['portrait', 'landscape']} visible={blockedMessage} onRequestClose={() => setBlockedMessage(false)}> <Modal animationType="fade" transparent={true} supportedOrientations={['portrait', 'landscape']} visible={blockedMessage} onRequestClose={() => setBlockedMessage(false)}>
<View style={styles.modal}> <View style={styles.modal}>
<BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" /> <BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" />
<Surface elevation={3} mode="flat" style={styles.blockedSurface}> <Surface elevation={4} mode="flat" style={styles.blockedSurface}>
<View style={styles.blockedHeader}> <View style={styles.blockedHeader}>
<Text style={styles.blockedTitle}>{ state.strings.blockedMessages }</Text> <Text style={styles.blockedTitle}>{ state.strings.blockedMessages }</Text>
<IconButton style={styles.blockedClose} icon="close" size={24} onPress={() => setBlockedMessage(false)} /> <IconButton style={styles.blockedClose} icon="close" size={24} onPress={() => setBlockedMessage(false)} />
@ -1151,7 +1151,7 @@ export function Settings({showLogout}: {showLogout: boolean}) {
<Modal animationType="fade" transparent={true} supportedOrientations={['portrait', 'landscape']} visible={blockedChannel} onRequestClose={() => setBlockedChannel(false)}> <Modal animationType="fade" transparent={true} supportedOrientations={['portrait', 'landscape']} visible={blockedChannel} onRequestClose={() => setBlockedChannel(false)}>
<View style={styles.modal}> <View style={styles.modal}>
<BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" /> <BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" />
<Surface elevation={3} mode="flat" style={styles.blockedSurface}> <Surface elevation={4} mode="flat" style={styles.blockedSurface}>
<View style={styles.blockedHeader}> <View style={styles.blockedHeader}>
<Text style={styles.blockedTitle}>{ state.strings.blockedTopics }</Text> <Text style={styles.blockedTitle}>{ state.strings.blockedTopics }</Text>
<IconButton style={styles.blockedClose} icon="close" size={24} onPress={() => setBlockedChannel(false)} /> <IconButton style={styles.blockedClose} icon="close" size={24} onPress={() => setBlockedChannel(false)} />
@ -1182,7 +1182,7 @@ export function Settings({showLogout}: {showLogout: boolean}) {
<Modal animationType="fade" transparent={true} supportedOrientations={['portrait', 'landscape']} visible={blockedContact} onRequestClose={() => setBlockedContact(false)}> <Modal animationType="fade" transparent={true} supportedOrientations={['portrait', 'landscape']} visible={blockedContact} onRequestClose={() => setBlockedContact(false)}>
<View style={styles.modal}> <View style={styles.modal}>
<BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" /> <BlurView style={styles.blur} blurType="dark" blurAmount={2} reducedTransparencyFallbackColor="dark" />
<Surface elevation={3} mode="flat" style={styles.blockedSurface}> <Surface elevation={4} mode="flat" style={styles.blockedSurface}>
<View style={styles.blockedHeader}> <View style={styles.blockedHeader}>
<Text style={styles.blockedTitle}>{ state.strings.blockedContacts }</Text> <Text style={styles.blockedTitle}>{ state.strings.blockedContacts }</Text>
<IconButton style={styles.blockedClose} icon="close" size={24} onPress={() => setBlockedContact(false)} /> <IconButton style={styles.blockedClose} icon="close" size={24} onPress={() => setBlockedContact(false)} />