2021-05-14 16:03:23 +00:00
|
|
|
import BaseTheme from '../../../base/ui/components/BaseTheme.native';
|
|
|
|
|
2021-05-26 08:29:21 +00:00
|
|
|
/**
|
|
|
|
* The style for participant list description.
|
|
|
|
*/
|
|
|
|
const participantListDescription = {
|
2021-06-09 12:41:00 +00:00
|
|
|
...BaseTheme.typography.heading6,
|
|
|
|
color: BaseTheme.palette.text02,
|
2021-05-26 10:03:12 +00:00
|
|
|
paddingBottom: BaseTheme.spacing[3],
|
|
|
|
paddingTop: BaseTheme.spacing[3],
|
2021-05-26 08:29:21 +00:00
|
|
|
position: 'relative',
|
|
|
|
width: '55%'
|
|
|
|
};
|
|
|
|
|
2021-05-21 15:35:36 +00:00
|
|
|
/**
|
|
|
|
* The style for content.
|
|
|
|
*/
|
|
|
|
const flexContent = {
|
|
|
|
alignItems: 'center',
|
|
|
|
color: BaseTheme.palette.icon01,
|
|
|
|
display: 'flex',
|
|
|
|
flex: 1
|
|
|
|
};
|
|
|
|
|
2021-07-02 13:43:52 +00:00
|
|
|
/**
|
|
|
|
* The style for the context menu items text.
|
|
|
|
*/
|
|
|
|
const contextMenuItemText = {
|
|
|
|
...BaseTheme.typography.bodyShortRegularLarge,
|
|
|
|
color: BaseTheme.palette.text01
|
|
|
|
};
|
|
|
|
|
2021-05-19 10:08:30 +00:00
|
|
|
/**
|
|
|
|
* The style of the participants pane buttons.
|
|
|
|
*/
|
2021-06-29 14:05:11 +00:00
|
|
|
export const button = {
|
2021-05-19 10:08:30 +00:00
|
|
|
display: 'flex',
|
2021-07-06 19:07:52 +00:00
|
|
|
flexDirection: 'row',
|
2021-05-19 10:08:30 +00:00
|
|
|
justifyContent: 'center'
|
|
|
|
};
|
|
|
|
|
2021-06-03 16:23:18 +00:00
|
|
|
/**
|
|
|
|
* The style of the context menu pane items.
|
|
|
|
*/
|
|
|
|
const contextMenuItem = {
|
2021-07-06 19:07:52 +00:00
|
|
|
alignItems: 'center',
|
|
|
|
display: 'flex',
|
2021-06-03 16:23:18 +00:00
|
|
|
flexDirection: 'row',
|
2021-07-06 19:07:52 +00:00
|
|
|
height: BaseTheme.spacing[7],
|
2021-09-22 14:05:42 +00:00
|
|
|
marginLeft: BaseTheme.spacing[3]
|
2021-06-03 16:23:18 +00:00
|
|
|
};
|
|
|
|
|
2021-05-14 16:03:23 +00:00
|
|
|
/**
|
|
|
|
* The styles of the native components of the feature {@code participants}.
|
|
|
|
*/
|
|
|
|
export default {
|
2021-05-19 10:08:30 +00:00
|
|
|
|
2021-06-03 16:23:18 +00:00
|
|
|
participantActionsButtonAdmit: {
|
2022-11-25 11:59:45 +00:00
|
|
|
marginRight: BaseTheme.spacing[3],
|
|
|
|
position: 'absolute',
|
|
|
|
right: 88
|
|
|
|
},
|
|
|
|
|
|
|
|
participantActionsButtonReject: {
|
2021-06-09 12:41:00 +00:00
|
|
|
marginRight: BaseTheme.spacing[3],
|
2021-05-24 18:23:41 +00:00
|
|
|
position: 'absolute',
|
2022-07-07 12:29:18 +00:00
|
|
|
right: 0
|
2021-05-24 11:08:58 +00:00
|
|
|
},
|
|
|
|
|
2022-07-07 12:29:18 +00:00
|
|
|
admitAllButtonLabel: {
|
2021-06-03 16:23:18 +00:00
|
|
|
color: BaseTheme.palette.link01,
|
2022-07-07 12:29:18 +00:00
|
|
|
marginRight: BaseTheme.spacing[6],
|
|
|
|
marginTop: 14
|
2021-05-14 16:03:23 +00:00
|
|
|
},
|
|
|
|
|
2021-05-19 10:08:30 +00:00
|
|
|
participantContainer: {
|
2021-05-14 16:03:23 +00:00
|
|
|
alignItems: 'center',
|
|
|
|
display: 'flex',
|
2021-05-20 16:06:52 +00:00
|
|
|
flexDirection: 'row',
|
2021-05-26 10:03:12 +00:00
|
|
|
height: BaseTheme.spacing[9],
|
2021-06-09 12:41:00 +00:00
|
|
|
paddingLeft: BaseTheme.spacing[3],
|
|
|
|
paddingRight: BaseTheme.spacing[3],
|
2021-05-24 18:23:41 +00:00
|
|
|
width: '100%'
|
2021-05-14 16:03:23 +00:00
|
|
|
},
|
|
|
|
|
2021-05-19 10:08:30 +00:00
|
|
|
participantContent: {
|
2021-05-21 15:35:36 +00:00
|
|
|
alignItems: 'center',
|
2022-11-25 11:59:45 +00:00
|
|
|
borderBottomColor: BaseTheme.palette.field01Hover,
|
|
|
|
borderBottomWidth: 2.4,
|
2021-05-21 15:35:36 +00:00
|
|
|
display: 'flex',
|
|
|
|
flexDirection: 'row',
|
2021-05-26 07:15:37 +00:00
|
|
|
height: '100%',
|
2021-05-19 10:08:30 +00:00
|
|
|
overflow: 'hidden',
|
2021-05-20 16:06:52 +00:00
|
|
|
width: '100%'
|
2021-05-19 10:08:30 +00:00
|
|
|
},
|
|
|
|
|
2021-09-22 14:05:42 +00:00
|
|
|
participantDetailsContainer: {
|
|
|
|
display: 'flex',
|
|
|
|
flexDirection: 'column',
|
2021-11-24 07:46:01 +00:00
|
|
|
width: '73%'
|
|
|
|
},
|
|
|
|
|
|
|
|
participantDetailsContainerRaisedHand: {
|
|
|
|
width: '65%'
|
2021-09-22 14:05:42 +00:00
|
|
|
},
|
|
|
|
|
2021-05-19 10:08:30 +00:00
|
|
|
participantNameContainer: {
|
2021-05-14 16:03:23 +00:00
|
|
|
display: 'flex',
|
2021-05-20 16:06:52 +00:00
|
|
|
flexDirection: 'row',
|
2021-05-21 15:35:36 +00:00
|
|
|
overflow: 'hidden',
|
2021-07-30 09:46:49 +00:00
|
|
|
paddingLeft: BaseTheme.spacing[3],
|
2021-09-22 14:05:42 +00:00
|
|
|
width: '100%'
|
2021-05-19 10:08:30 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
participantName: {
|
|
|
|
overflow: 'hidden',
|
2021-05-20 16:06:52 +00:00
|
|
|
color: BaseTheme.palette.text01
|
|
|
|
},
|
|
|
|
|
2021-09-22 14:05:42 +00:00
|
|
|
moderatorLabel: {
|
|
|
|
color: BaseTheme.palette.text03,
|
|
|
|
alignSelf: 'flex-start',
|
|
|
|
paddingLeft: BaseTheme.spacing[3],
|
|
|
|
paddingTop: BaseTheme.spacing[1]
|
|
|
|
},
|
|
|
|
|
2021-05-21 15:35:36 +00:00
|
|
|
participantStatesContainer: {
|
|
|
|
display: 'flex',
|
2021-05-26 07:15:37 +00:00
|
|
|
flexDirection: 'row',
|
2021-06-03 16:23:18 +00:00
|
|
|
marginLeft: 'auto',
|
2021-06-09 12:41:00 +00:00
|
|
|
width: '15%'
|
2021-05-21 15:35:36 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
participantStateVideo: {
|
2021-06-09 12:41:00 +00:00
|
|
|
paddingRight: BaseTheme.spacing[3]
|
2021-05-19 10:08:30 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
raisedHandIndicator: {
|
|
|
|
backgroundColor: BaseTheme.palette.warning02,
|
|
|
|
borderRadius: BaseTheme.shape.borderRadius / 2,
|
2021-05-26 10:03:12 +00:00
|
|
|
height: BaseTheme.spacing[4],
|
2021-11-24 07:46:01 +00:00
|
|
|
width: BaseTheme.spacing[4],
|
|
|
|
marginLeft: 'auto',
|
|
|
|
marginRight: BaseTheme.spacing[2]
|
2021-05-19 10:08:30 +00:00
|
|
|
},
|
|
|
|
|
2021-05-21 15:35:36 +00:00
|
|
|
raisedHandIcon: {
|
|
|
|
...flexContent,
|
2021-12-20 08:44:22 +00:00
|
|
|
top: BaseTheme.spacing[1],
|
|
|
|
color: BaseTheme.palette.uiBackground
|
2021-05-21 15:35:36 +00:00
|
|
|
},
|
2021-07-30 09:46:49 +00:00
|
|
|
|
2022-01-12 16:29:58 +00:00
|
|
|
lobbyListContent: {
|
2022-11-25 11:59:45 +00:00
|
|
|
height: '24%'
|
|
|
|
},
|
|
|
|
|
|
|
|
lobbyButtonAdmit: {
|
|
|
|
position: 'absolute',
|
|
|
|
right: 16
|
|
|
|
},
|
|
|
|
|
|
|
|
lobbyButtonReject: {
|
|
|
|
position: 'absolute',
|
|
|
|
right: 104
|
2021-05-26 08:29:21 +00:00
|
|
|
},
|
|
|
|
|
2021-10-20 19:29:21 +00:00
|
|
|
lobbyListDescription: {
|
2022-01-12 16:29:58 +00:00
|
|
|
fontSize: 15,
|
|
|
|
color: BaseTheme.palette.text01,
|
|
|
|
fontWeight: 'bold',
|
|
|
|
marginTop: BaseTheme.spacing[2]
|
2021-05-24 18:23:41 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
lobbyListDetails: {
|
|
|
|
alignItems: 'center',
|
|
|
|
display: 'flex',
|
|
|
|
flexDirection: 'row',
|
2021-06-03 16:23:18 +00:00
|
|
|
justifyContent: 'space-between',
|
2021-05-26 07:15:37 +00:00
|
|
|
overflow: 'hidden',
|
|
|
|
position: 'relative',
|
2021-05-24 18:23:41 +00:00
|
|
|
width: '100%'
|
|
|
|
},
|
2021-05-21 15:35:36 +00:00
|
|
|
|
2022-04-12 11:45:27 +00:00
|
|
|
notLocalModeratorContainer: {
|
|
|
|
height: '100%'
|
|
|
|
},
|
|
|
|
|
2021-10-20 19:29:21 +00:00
|
|
|
meetingListContainer: {
|
2022-11-25 11:59:45 +00:00
|
|
|
height: '56%'
|
2022-03-25 09:09:55 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
meetingListFullContainer: {
|
2022-11-25 11:59:45 +00:00
|
|
|
height: '80%'
|
2021-05-26 08:29:21 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
meetingListDescription: {
|
2021-06-09 12:41:00 +00:00
|
|
|
...participantListDescription,
|
|
|
|
marginLeft: BaseTheme.spacing[3]
|
2021-05-19 10:08:30 +00:00
|
|
|
},
|
|
|
|
|
2022-01-12 16:29:58 +00:00
|
|
|
collapsibleRoomContainer: {
|
2022-11-25 11:59:45 +00:00
|
|
|
height: '32%'
|
2022-01-12 16:29:58 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
participantsPaneContainer: {
|
|
|
|
backgroundColor: BaseTheme.palette.ui01,
|
|
|
|
flex: 1,
|
|
|
|
justifyContent: 'center'
|
|
|
|
},
|
|
|
|
|
|
|
|
participantsPaneFooter: {
|
2021-05-26 07:15:37 +00:00
|
|
|
alignItems: 'center',
|
2022-01-12 16:29:58 +00:00
|
|
|
backgroundColor: BaseTheme.palette.ui01,
|
|
|
|
bottom: 0,
|
2021-05-26 07:15:37 +00:00
|
|
|
flexDirection: 'row',
|
2022-01-12 16:29:58 +00:00
|
|
|
height: BaseTheme.spacing[12],
|
2022-04-29 09:30:49 +00:00
|
|
|
justifyContent: 'flex-end',
|
2022-01-12 16:29:58 +00:00
|
|
|
left: 0,
|
|
|
|
right: 0,
|
|
|
|
position: 'absolute',
|
|
|
|
paddingBottom: BaseTheme.spacing[2],
|
|
|
|
paddingLeft: BaseTheme.spacing[3],
|
|
|
|
paddingRight: BaseTheme.spacing[3]
|
2021-10-20 19:29:21 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
headerCloseIcon: {
|
|
|
|
marginLeft: 12
|
2021-05-19 10:08:30 +00:00
|
|
|
},
|
|
|
|
|
2021-05-26 07:15:37 +00:00
|
|
|
inviteButton: {
|
2021-06-09 12:41:00 +00:00
|
|
|
marginLeft: BaseTheme.spacing[3],
|
2022-01-12 16:29:58 +00:00
|
|
|
marginRight: BaseTheme.spacing[3],
|
|
|
|
marginVertical: BaseTheme.spacing[3]
|
2021-05-26 07:15:37 +00:00
|
|
|
},
|
|
|
|
|
2021-06-03 16:23:18 +00:00
|
|
|
moreButton: {
|
2022-07-07 12:29:18 +00:00
|
|
|
marginLeft: BaseTheme.spacing[2]
|
2021-06-03 16:23:18 +00:00
|
|
|
},
|
|
|
|
|
2021-06-04 15:07:18 +00:00
|
|
|
contextMenuItem: {
|
2021-06-03 16:23:18 +00:00
|
|
|
...contextMenuItem
|
|
|
|
},
|
|
|
|
|
2021-06-04 15:07:18 +00:00
|
|
|
contextMenuItemSection: {
|
2021-06-09 12:41:00 +00:00
|
|
|
...contextMenuItem
|
2021-06-03 16:23:18 +00:00
|
|
|
},
|
|
|
|
|
2021-07-02 13:43:52 +00:00
|
|
|
contextMenuItemSectionAvatar: {
|
2021-07-30 09:46:49 +00:00
|
|
|
alignItems: 'center',
|
|
|
|
backgroundColor: BaseTheme.palette.bottomSheet,
|
|
|
|
borderBottomColor: BaseTheme.palette.dividerColor,
|
|
|
|
borderBottomWidth: 1,
|
|
|
|
borderTopLeftRadius: BaseTheme.spacing[3],
|
|
|
|
borderTopRightRadius: BaseTheme.spacing[3],
|
|
|
|
flexDirection: 'row',
|
|
|
|
height: BaseTheme.spacing[7],
|
|
|
|
paddingLeft: BaseTheme.spacing[3]
|
2021-07-02 13:43:52 +00:00
|
|
|
},
|
|
|
|
|
2021-06-03 16:23:18 +00:00
|
|
|
contextMenuItemText: {
|
2021-07-02 13:43:52 +00:00
|
|
|
...contextMenuItemText,
|
2021-06-04 15:07:18 +00:00
|
|
|
marginLeft: BaseTheme.spacing[3]
|
|
|
|
},
|
|
|
|
|
2021-09-22 14:05:42 +00:00
|
|
|
contextMenuItemTextNoIcon: {
|
|
|
|
...contextMenuItemText,
|
|
|
|
marginLeft: BaseTheme.spacing[6]
|
|
|
|
},
|
|
|
|
|
2021-06-04 15:07:18 +00:00
|
|
|
contextMenuItemName: {
|
2021-07-30 09:46:49 +00:00
|
|
|
color: BaseTheme.palette.text04,
|
|
|
|
flexShrink: 1,
|
|
|
|
fontSize: BaseTheme.spacing[3],
|
|
|
|
marginLeft: BaseTheme.spacing[3],
|
|
|
|
opacity: 0.90
|
2021-06-09 12:41:00 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
divider: {
|
2021-07-30 09:46:49 +00:00
|
|
|
backgroundColor: BaseTheme.palette.dividerColor
|
2021-10-21 11:58:44 +00:00
|
|
|
},
|
|
|
|
|
2022-07-26 10:58:28 +00:00
|
|
|
inputContainer: {
|
|
|
|
marginLeft: BaseTheme.spacing[3],
|
|
|
|
marginRight: BaseTheme.spacing[3],
|
|
|
|
marginBottom: BaseTheme.spacing[4]
|
|
|
|
},
|
|
|
|
|
|
|
|
centerInput: {
|
|
|
|
paddingRight: BaseTheme.spacing[3],
|
|
|
|
textAlign: 'center'
|
2021-05-14 16:03:23 +00:00
|
|
|
}
|
|
|
|
};
|