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

styling ringing modal

Browse Source
This commit is contained in:
balzack 2023-10-05 23:26:24 -07:00
parent ffb44c1f5d
commit 46dd40ed9c
2 changed files with 12 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/mobile/src/session/Session.jsx
View File

@ -32,6 +32,7 @@ import lightSplash from 'images/session.png';
import darkSplash from 'images/darksess.png'; import darkSplash from 'images/darksess.png';
import { useNavigate } from 'react-router-dom'; import { useNavigate } from 'react-router-dom';
import { getLanguageStrings } from 'constants/Strings'; import { getLanguageStrings } from 'constants/Strings';
import { BlurView } from "@react-native-community/blur";
const ConversationStack = createStackNavigator(); const ConversationStack = createStackNavigator();
const ProfileStack = createStackNavigator(); const ProfileStack = createStackNavigator();
@ -379,8 +380,8 @@ export function Session({ sharing, clearSharing }) {
)} )}
{ name == null && contactNode != null && ( { name == null && contactNode != null && (
<View style={styles.ringName}> <View style={styles.ringName}>
<Text numberOfLines={1} ellipsizeMode={'tail'}>{ handle }</Text> <Text style={styles.ringText} numberOfLines={1} ellipsizeMode={'tail'}>{ handle }</Text>
<Text numberOfLines={1} ellipsizeMode={'tail'}>{ contactNode }</Text> <Text styles={styles.ringText} numberOfLines={1} ellipsizeMode={'tail'}>{ contactNode }</Text>
</View> </View>
)} )}
{ name == null && contactNode == null && ( { name == null && contactNode == null && (
@ -486,6 +487,7 @@ export function Session({ sharing, clearSharing }) {
supportedOrientations={['portrait', 'landscape']} supportedOrientations={['portrait', 'landscape']}
> >
<View style={styles.ringBase}> <View style={styles.ringBase}>
<BlurView style={styles.ringBase} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black" />
<View style={styles.ringFrame}> <View style={styles.ringFrame}>
{ ringing } { ringing }
</View> </View>

10
app/mobile/src/session/Session.styled.js
View File

@ -148,10 +148,15 @@ export const styles = StyleSheet.create({
height: '100%', height: '100%',
alignItems: 'center', alignItems: 'center',
justifyContent: 'center', justifyContent: 'center',
backgroundColor: 'rgba(52, 52, 52, 0.8)' },
ringText: {
color: Colors.text,
}, },
ringFrame: { ringFrame: {
backgroundColor: Colors.areaBase, position: 'absolute',
backgroundColor: Colors.modalBase,
borderColor: Colors.modalBorder,
borderWidth: 1,
padding: 16, padding: 16,
width: '90%', width: '90%',
maxWidth: 400, maxWidth: 400,
@ -168,6 +173,7 @@ export const styles = StyleSheet.create({
flexGrow: 1, flexGrow: 1,
paddingLeft: 8, paddingLeft: 8,
paddingRight: 8, paddingRight: 8,
color: Colors.text,
}, },
ringIgnore: { ringIgnore: {
borderWidth: 1, borderWidth: 1,