martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-02-12 03:29:16 +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 { useNavigate } from 'react-router-dom';
import { getLanguageStrings } from 'constants/Strings';
import { BlurView } from "@react-native-community/blur";
const ConversationStack = createStackNavigator();
const ProfileStack = createStackNavigator();
@ -379,8 +380,8 @@ export function Session({ sharing, clearSharing }) {
)}
{ name == null && contactNode != null && (
<View style={styles.ringName}>
<Text numberOfLines={1} ellipsizeMode={'tail'}>{ handle }</Text>
<Text numberOfLines={1} ellipsizeMode={'tail'}>{ contactNode }</Text>
<Text style={styles.ringText} numberOfLines={1} ellipsizeMode={'tail'}>{ handle }</Text>
<Text styles={styles.ringText} numberOfLines={1} ellipsizeMode={'tail'}>{ contactNode }</Text>
</View>
)}
{ name == null && contactNode == null && (
@ -486,6 +487,7 @@ export function Session({ sharing, clearSharing }) {
supportedOrientations={['portrait', 'landscape']}
>
<View style={styles.ringBase}>
<BlurView style={styles.ringBase} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black" />
<View style={styles.ringFrame}>
{ ringing }
</View>

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

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