182 lines
4.1 KiB
JavaScript
182 lines
4.1 KiB
JavaScript
import { ColorPalette, createStyleSheet } from '../../base/styles';
|
|
import BaseTheme from '../../base/ui/components/BaseTheme';
|
|
|
|
const NOTIFICATION_SIZE = 55;
|
|
|
|
/**
|
|
* The styles of the React {@code Component}s of the feature meeting-list i.e.
|
|
* {@code CalendarList}.
|
|
*/
|
|
export default createStyleSheet({
|
|
|
|
/**
|
|
* Button style of the open settings button.
|
|
*/
|
|
noPermissionMessageButton: {
|
|
backgroundColor: ColorPalette.blue,
|
|
borderColor: ColorPalette.blue,
|
|
borderRadius: 4,
|
|
borderWidth: 1,
|
|
height: 30,
|
|
justifyContent: 'center',
|
|
margin: 15,
|
|
paddingHorizontal: 20
|
|
},
|
|
|
|
/**
|
|
* Text style of the open settings button.
|
|
*/
|
|
noPermissionMessageButtonText: {
|
|
color: ColorPalette.white
|
|
},
|
|
|
|
/**
|
|
* Text style of the no permission message.
|
|
*/
|
|
noPermissionMessageText: {
|
|
backgroundColor: 'transparent',
|
|
color: 'rgba(255, 255, 255, 0.6)',
|
|
textAlign: 'center'
|
|
},
|
|
|
|
/**
|
|
* Top level view of the no permission message.
|
|
*/
|
|
noPermissionMessageView: {
|
|
alignItems: 'center',
|
|
flex: 1,
|
|
flexDirection: 'column',
|
|
justifyContent: 'center',
|
|
padding: 20
|
|
},
|
|
|
|
/**
|
|
* The top level container of the notification.
|
|
*/
|
|
notificationContainer: {
|
|
alignSelf: 'flex-start',
|
|
flexDirection: 'row',
|
|
justifyContent: 'center',
|
|
overflow: 'hidden',
|
|
position: 'absolute'
|
|
},
|
|
|
|
/**
|
|
* Additional style for the container when the notification is displayed
|
|
* on the side (narrow view).
|
|
*/
|
|
notificationContainerSide: {
|
|
top: 100
|
|
},
|
|
|
|
/**
|
|
* Additional style for the container when the notification is displayed
|
|
* on the top (wide view).
|
|
*/
|
|
notificationContainerTop: {
|
|
justifyContent: 'center',
|
|
left: 0,
|
|
right: 0,
|
|
top: 0
|
|
},
|
|
|
|
/**
|
|
* The top level container of the notification.
|
|
*/
|
|
notificationContent: {
|
|
alignSelf: 'flex-start',
|
|
flexDirection: 'row',
|
|
height: NOTIFICATION_SIZE,
|
|
justifyContent: 'center',
|
|
paddingHorizontal: 10
|
|
},
|
|
|
|
/**
|
|
* Color for upcoming meeting notification.
|
|
*/
|
|
notificationContentNext: {
|
|
backgroundColor: '#eeb231'
|
|
},
|
|
|
|
/**
|
|
* Color for already ongoing meeting notifications.
|
|
*/
|
|
notificationContentPast: {
|
|
backgroundColor: 'red'
|
|
},
|
|
|
|
/**
|
|
* Additional style for the content when the notification is displayed
|
|
* on the side (narrow view).
|
|
*/
|
|
notificationContentSide: {
|
|
borderBottomRightRadius: NOTIFICATION_SIZE,
|
|
borderTopRightRadius: NOTIFICATION_SIZE
|
|
},
|
|
|
|
/**
|
|
* Additional style for the content when the notification is displayed
|
|
* on the top (wide view).
|
|
*/
|
|
notificationContentTop: {
|
|
borderBottomLeftRadius: NOTIFICATION_SIZE / 2,
|
|
borderBottomRightRadius: NOTIFICATION_SIZE / 2,
|
|
paddingHorizontal: 20
|
|
},
|
|
|
|
/**
|
|
* The icon of the notification.
|
|
*/
|
|
notificationIcon: {
|
|
color: 'white',
|
|
fontSize: 25
|
|
},
|
|
|
|
/**
|
|
* The container that contains the icon.
|
|
*/
|
|
notificationIconContainer: {
|
|
alignItems: 'center',
|
|
flexDirection: 'row',
|
|
height: NOTIFICATION_SIZE,
|
|
justifyContent: 'center'
|
|
},
|
|
|
|
/**
|
|
* A single line of text of the notification.
|
|
*/
|
|
notificationText: {
|
|
color: 'white',
|
|
fontSize: 13
|
|
},
|
|
|
|
/**
|
|
* The container for all the lines if the norification.
|
|
*/
|
|
notificationTextContainer: {
|
|
flexDirection: 'column',
|
|
height: NOTIFICATION_SIZE,
|
|
justifyContent: 'center'
|
|
},
|
|
|
|
/**
|
|
* The touchable component.
|
|
*/
|
|
touchableView: {
|
|
flexDirection: 'row'
|
|
},
|
|
|
|
calendarSync: {
|
|
backgroundColor: BaseTheme.palette.uiBackground,
|
|
flex: 1,
|
|
overflow: 'hidden'
|
|
},
|
|
|
|
calendarSyncDisabled: {
|
|
backgroundColor: BaseTheme.palette.uiBackground,
|
|
flex: 1,
|
|
opacity: 0.8,
|
|
overflow: 'hidden'
|
|
}
|
|
});
|