react-openfin-mat-impl
Version:
Materialize UI implementation of react-openfin
137 lines • 4.78 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const styles_1 = require("@material-ui/core/styles");
const colorManipulator_1 = require("@material-ui/core/styles/colorManipulator");
const openfin_starter_constant_1 = require("../openfin-starter-constant");
const launchBtnHeight = 64;
const launchBtnContainerMaxWidth = 576;
const launchBarStyle = (theme) => styles_1.createStyles({
toolBar: {
height: 64,
padding: '0 0',
},
firstAppBarContainer: {
width: 64,
height: 64,
"-webkit-user-select": "none",
"-webkit-app-region": "drag",
},
appLogoImg: {
width: 40,
height: 40,
margin: 12,
"-webkit-user-select": "none",
"-webkit-app-region": "drag",
},
undockCtrlBtn: {
position: 'absolute',
top: 2,
left: launchBtnHeight - 18,
},
buttonContainer: {
maxWidth: `${launchBtnContainerMaxWidth}px`,
whiteSpace: 'nowrap',
height: `${launchBtnHeight}px`,
background: colorManipulator_1.darken(openfin_starter_constant_1.default.primaryColor, 0.2),
},
buttonContainerCollapse: {
width: '0px !important',
},
baseButton: {
color: 'white',
borderRadius: '0%',
height: launchBtnHeight,
width: launchBtnHeight,
"&:hover": {
background: colorManipulator_1.darken(openfin_starter_constant_1.default.primaryColor, 0.4),
},
'& $svg': {
fontSize: '50px',
},
},
svgButton: {
borderRadius: '0%',
height: launchBtnHeight,
width: launchBtnHeight,
"&:hover": {
background: colorManipulator_1.darken(openfin_starter_constant_1.default.primaryColor, 0.4),
},
'& $img': {
height: 36,
width: 36,
},
},
controlPanelContainer: {
margin: '0 4px',
display: 'flex',
flexDirection: 'column',
},
controlBtn: {
width: 16,
height: 16,
minHeight: 16,
borderRadius: 4,
'& $svg': {
width: 16,
height: 16,
}
},
controlBtnPrimary: {
color: '#ffffff',
backgroundColor: openfin_starter_constant_1.default.primaryColor,
"&:hover,&:focus": {
background: openfin_starter_constant_1.default.primaryColor,
border: `1px solid ${colorManipulator_1.lighten(openfin_starter_constant_1.default.primaryColor, 0.5)}`
},
},
controlBtnWarning: {
color: '#ffffff',
backgroundColor: openfin_starter_constant_1.default.warningColor,
"&:hover,&:focus": {
background: openfin_starter_constant_1.default.warningColor,
border: `1px solid ${colorManipulator_1.lighten(openfin_starter_constant_1.default.warningColor, 0.5)}`
},
},
controlBtnSuccess: {
color: '#ffffff',
backgroundColor: openfin_starter_constant_1.default.successColor,
"&:hover,&:focus": {
background: openfin_starter_constant_1.default.successColor,
border: `1px solid ${colorManipulator_1.lighten(openfin_starter_constant_1.default.successColor, 0.5)}`
},
},
controlBtnInfo: {
color: '#ffffff',
backgroundColor: openfin_starter_constant_1.default.infoColor,
"&:hover,&:focus": {
background: openfin_starter_constant_1.default.infoColor,
border: `1px solid ${colorManipulator_1.lighten(openfin_starter_constant_1.default.infoColor, 0.5)}`
},
},
controlBtnRose: {
color: '#ffffff',
backgroundColor: openfin_starter_constant_1.default.roseColor,
"&:hover,&:focus": {
background: openfin_starter_constant_1.default.roseColor,
border: `1px solid ${colorManipulator_1.lighten(openfin_starter_constant_1.default.roseColor, 0.5)}`
},
},
controlBtnGrey: {
color: '#ffffff',
backgroundColor: openfin_starter_constant_1.default.greyColor,
"&:hover,&:focus": {
background: openfin_starter_constant_1.default.greyColor,
border: `1px solid ${colorManipulator_1.lighten(openfin_starter_constant_1.default.greyColor, 0.5)}`
},
},
controlBtnDanger: {
color: '#ffffff',
backgroundColor: openfin_starter_constant_1.default.dangerColor,
"&:hover,&:focus": {
background: openfin_starter_constant_1.default.dangerColor,
border: `1px solid ${colorManipulator_1.lighten(openfin_starter_constant_1.default.dangerColor, 0.5)}`
},
},
});
exports.default = launchBarStyle;
//# sourceMappingURL=launchBarLayout.style.js.map