@up-group-ui/react-controls
Version:
Up shared react controls
78 lines • 3 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.getStyles = void 0;
var tslib_1 = require("tslib");
var typestyle_1 = require("typestyle");
var utils_1 = require("../../../Common/theming/utils");
var getStyles = function (props) {
var tooltipStyle = props.displayMode === 'row'
? { position: 'absolute', bottom: (0, utils_1.toRem)(15) }
: {
position: 'absolute',
top: (0, utils_1.toRem)(-5),
right: (0, utils_1.toRem)(-20),
};
return (0, typestyle_1.style)({
border: '1px solid #DEDDDD',
borderRadius: '4px',
padding: (0, utils_1.toRem)(25) + " " + (0, utils_1.toRem)(30) + " " + (0, utils_1.toRem)(13.5) + " " + (0, utils_1.toRem)(50),
$nest: {
'& .panel-body': {
display: 'flex',
flexWrap: 'wrap',
marginLeft: (0, utils_1.toRem)(14),
position: 'relative',
},
'& .panel-col': {
display: 'flex',
flexDirection: props.displayMode ? props.displayMode : {},
marginRight: (0, utils_1.toRem)(37),
marginBottom: (0, utils_1.toRem)(8),
position: 'relative',
alignItems: props.displayMode === 'row' ? 'center' : 'normal',
},
'& .panel-col-label': {
color: props.theme.colorMap.gray6,
fontSize: (0, utils_1.toRem)(14),
lineHeight: 1.15,
},
'& .panel-col-value': {
color: props.theme.colorMap.grey1,
marginLeft: props.displayMode === 'row' ? (0, utils_1.toRem)(4) : '',
fontSize: (0, utils_1.toRem)(14),
lineHeight: 1.15,
},
'& .panel-title': {
marginBottom: (0, utils_1.toRem)(30),
},
'& .panel-title-general': {
fontSize: (0, utils_1.toRem)(18),
fontWeight: 'bold',
color: '#4B5C59',
},
'& .panel-title-specific': {
fontSize: (0, utils_1.toRem)(18),
fontWeight: 'bold',
color: '#4B5C59',
marginLeft: (0, utils_1.toRem)(4),
},
'& .col-tooltip': (0, tslib_1.__assign)({}, tooltipStyle),
'& .panel-actions': {
position: 'absolute',
right: 0,
bottom: 4,
display: 'flex',
justifyContent: 'space-evenly',
alignSelf: 'center',
$nest: {
'& .up-btn ,& .up-btn svg': {
width: (0, utils_1.toRem)(44) + " !important",
height: (0, utils_1.toRem)(44) + " !important",
},
},
},
},
});
};
exports.getStyles = getStyles;
//# sourceMappingURL=styles.js.map