sfm-uikit-react-native/src/style/EnxConfirmationViewStyle.js

It is a react native component for SmartFloMeet users.

import { StyleSheet} from 'react-native';
import {Dimensions} from "react-native";

const styles = StyleSheet.create({
    floatingButton: {
        position: 'absolute',
        top: 20, // Adjust the top position as needed
        left: 20, // Adjust the left position as needed
        backgroundColor: 'transparent', // Button background color
        padding: 10, // Button padding
        borderRadius: 25, // Button border radius
        elevation: 5, // Shadow for Android
        shadowColor: '#000', // Shadow color for iOS
        shadowOffset: { width: 0, height: 2 }, // Shadow offset for iOS
        shadowOpacity: 0.8, // Shadow opacity for iOS
        shadowRadius: 2, // Shadow radius for iOS
        zIndex: 1000, // Ensure the button is on top
    },
      containerPortrate: {
        flex: 1,
        flexDirection : "column",
      },
      containerLandScape: {
        flex: 1,
        flexDirection : "row",
      },
      firstPart : {
        backgroundColor : "#f0f0f0",
        justifyContent : "center",
        alignItems : "center"
      },
      secondPart : {
        backgroundColor : "#F4FAFC",
        justifyContent : "center",
        alignItems : "center",
      },

      noVideoPreview: {
        flex: 1,
      },
      videoContainer: {
        position: "absolute",
        width: '100%', 
        height: '100%',
      },
      bottomOptionContainerPrortare: {
        width: (Dimensions.get("window").width > 400) ? 400 : (Dimensions.get("window").width * .95),
        backgroundColor : "#f3f6f4",
        bottom: 0,
        left: 0,
        right: 0,
        borderTopLeftRadius: 20, // Optional for rounded corners
        borderTopRightRadius: 20, // Optional for rounded corners
        overflow: "hidden",
        borderColor: "grey", 
        alignSelf: "center", 
        marginTop : 10,
        marginBottom : 10,
      },
      bottomOptionContainerLandScape: {
        width : 300,
        height : 160,
        backgroundColor : "#f3f6f4",
        borderRadius: 20,
        overflow: "hidden",
        borderColor: "grey", 
        alignSelf: "center", 
      },
      bottomOptTopContainerPrortare: {
        flexDirection:'row', 
        margin : 20, 
        alignItems: 'center',
        justifyContent: 'center',
        borderColor: "grey", 
        borderWidth: 1, 
        borderRadius: 10
      },
      bottomOptTopContainerlandScape: {
        width:280,
        flexDirection:'row', 
        alignItems: 'center',
        justifyContent: 'center',
        borderColor: "grey", 
        borderWidth: 1, 
        borderRadius: 10,
        marginTop : 30,
        alignSelf: "center", 
      },
      bottonOptAudio: {
        flex:1,
      },
      bottonOptVideo:{
        flex:1,
        borderLeftWidth:1,
      },
      bottonOptAudioOnly: {
        flex:1.5,
      },
      bottonOptInSideAudioOnly: {
        flexDirection:'row', 
        borderLeftWidth:1, 
        alignItems: 'center',
        justifyContent: 'center'
      },
      bottonAudioOnlyInSide: {
        width: 40, 
        alignSelf: "center", 
        height: 40,
      },

      joinNowContainerPortrate: {
        height: 40,
        width: 120,
        borderColor: "grey",
        backgroundColor: "#e60073",
        borderWidth: 1,
        borderRadius: 20,
        marginBottom: 10,
        alignSelf: "center"
    },
    joinNowContainerlandScape: {
      height: 40,
      width: 120,
      borderColor: "grey",
      backgroundColor: "#e60073",
      borderWidth: 1,
      borderRadius: 20,
      marginTop: 20,
      alignSelf: "center"
  },
    joinNowtext: {
        color: "white", 
        fontSize: 16, 
        fontWeight:"600", 
        marginTop:5, 
        textAlign:"center",
    }

})
export { styles }