martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-05-05 07:55:15 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

styling for light mode

Browse Source
This commit is contained in:
balzack 2025-01-16 21:53:56 -08:00
parent 01dba5b8de
commit 48d017f170
7 changed files with 19 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/client/mobile/src/constants/Strings.ts
View File

@ -104,7 +104,7 @@ export const en = {
password: 'Password', password: 'Password',
newPassword: 'New Password', newPassword: 'New Password',
confirmPassword: 'Confirm Password', confirmPassword: 'Confirm Password',
deleteKey: "Type 'delete' to remove key", deleteKey: 'Enter \'delete\' to remove key',
delete: 'delete', delete: 'delete',
remove: 'Delete', remove: 'Delete',
username: 'Username', username: 'Username',

2
app/client/mobile/src/contacts/Contacts.styled.ts
View File

@ -11,6 +11,7 @@ export const styles = StyleSheet.create({
}, },
button: { button: {
borderRadius: 8, borderRadius: 8,
marginRight: 4,
}, },
indicator: { indicator: {
borderRightWidth: 2, borderRightWidth: 2,
@ -39,6 +40,7 @@ export const styles = StyleSheet.create({
marginRight: 8, marginRight: 8,
marginLeft: 4, marginLeft: 4,
display: 'flex', display: 'flex',
borderRadius: 8,
}, },
input: { input: {
flexGrow: 1, flexGrow: 1,

2
app/client/mobile/src/contacts/Contacts.tsx
View File

@ -36,7 +36,7 @@ export function Contacts({openRegistry, openContact, callContact, textContact}:
<SafeAreaView style={styles.header}> <SafeAreaView style={styles.header}>
<IconButton style={styles.sort} mode="contained" icon={state.sortAsc ? 'sort-descending' : 'sort-ascending'} size={24} onPress={actions.toggleSort} /> <IconButton style={styles.sort} mode="contained" icon={state.sortAsc ? 'sort-descending' : 'sort-ascending'} size={24} onPress={actions.toggleSort} />
<Surface mode="flat" style={styles.inputSurface}> <Surface mode="flat" elevation={3} style={styles.inputSurface}>
<TextInput <TextInput
dense={true} dense={true}
style={styles.input} style={styles.input}

1
app/client/mobile/src/content/Content.styled.ts
View File

@ -60,7 +60,6 @@ export const styles = StyleSheet.create({
height: 40, height: 40,
marginRight: 8, marginRight: 8,
marginLeft: 4, marginLeft: 4,
marginBottom: 4,
display: 'flex', display: 'flex',
borderRadius: 8, borderRadius: 8,
}, },

2
app/client/mobile/src/session/Session.tsx
View File

@ -73,7 +73,7 @@ export function Session() {
return ( return (
<View style={styles.session}> <View style={styles.session}>
{state.layout !== 'large' && ( {state.layout !== 'large' && (
<Surface elevation={2}> <Surface elevation={3}>
<SafeAreaView style={styles.full}> <SafeAreaView style={styles.full}>
<View style={styles.screen}> <View style={styles.screen}>
<View <View

3
app/client/mobile/src/settings/Settings.styled.ts
View File

@ -345,6 +345,7 @@ export const styles = StyleSheet.create({
display: 'flex', display: 'flex',
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center', alignItems: 'center',
paddingTop: 8,
}, },
blockedTitle: { blockedTitle: {
flexGrow: 1, flexGrow: 1,
@ -353,6 +354,8 @@ export const styles = StyleSheet.create({
}, },
blockedClose: { blockedClose: {
backgroundColor: 'transparent', backgroundColor: 'transparent',
padding: 0,
margin: 0,
}, },
blockedDone: { blockedDone: {
width: '100%', width: '100%',

22
app/client/mobile/src/settings/Settings.tsx
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={5} mode="flat" style={styles.surface}> <Surface elevation={3} 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={1} mode="flat" style={styles.surface}> <Surface elevation={3} 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={5} mode="flat" style={styles.surface}> <Surface elevation={3} 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={5} mode="flat" style={styles.surface}> <Surface elevation={3} 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={5} mode="flat" style={styles.surface}> <Surface elevation={3} 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
@ -1053,7 +1053,7 @@ export function Settings({showLogout}: {showLogout: boolean}) {
{state.strings.cancel} {state.strings.cancel}
</Button> </Button>
<Button mode="contained" loading={savingChange} disabled={state.password === '' || state.password !== state.confirm || state.taken || !state.checked} onPress={saveChange}> <Button mode="contained" loading={savingChange} disabled={state.password === '' || state.password !== state.confirm || state.taken || !state.checked} onPress={saveChange}>
{state.strings.update} {state.strings.save}
</Button> </Button>
</View> </View>
</Surface> </Surface>
@ -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={5} mode="flat" style={styles.surface}> <Surface elevation={3} 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={5} mode="flat" style={styles.surface}> <Surface elevation={3} 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)} />
@ -1100,7 +1100,7 @@ export function Settings({showLogout}: {showLogout: boolean}) {
autoComplete="off" autoComplete="off"
autoCorrect={false} autoCorrect={false}
value={state.remove} value={state.remove}
label={state.strings.typeDelete} label={state.strings.deleteKey}
left={<TextInput.Icon style={styles.icon} icon="delete-outline" />} left={<TextInput.Icon style={styles.icon} icon="delete-outline" />}
onChangeText={value => actions.setRemove(value)} onChangeText={value => actions.setRemove(value)}
/> />
@ -1109,8 +1109,8 @@ export function Settings({showLogout}: {showLogout: boolean}) {
<Button mode="outlined" onPress={() => setRemove(false)}> <Button mode="outlined" onPress={() => setRemove(false)}>
{state.strings.cancel} {state.strings.cancel}
</Button> </Button>
<Button mode="contained" loading={applyingRemove} disabled={state.remove !== state.strings.deleteKey} style={styles.remove} onPress={applyRemove}> <Button mode="contained" loading={applyingRemove} disabled={state.remove !== state.strings.delete} style={styles.remove} onPress={applyRemove}>
{state.strings.delete} {state.strings.remove}
</Button> </Button>
</View> </View>
</Surface> </Surface>