@fluentui/react-northstar
Version:
A themable React component library.
124 lines (123 loc) • 2.96 kB
JavaScript
export var getIntentColorsFromProps = function getIntentColorsFromProps(p, v) {
if (p.danger) {
return {
color: v.dangerColor,
backgroundColor: v.dangerBackgroundColor,
borderColor: v.dangerBorderColor
};
}
if (p.info) {
return {
color: v.color,
backgroundColor: v.backgroundColor,
borderColor: v.borderColor
};
}
if (v.oof) {
return {
color: v.oofColor,
backgroundColor: v.oofBackgroundColor,
borderColor: v.oofBorderColor
};
}
if (v.urgent) {
return {
color: v.urgentColor,
backgroundColor: v.urgentBackgroundColor,
borderColor: v.urgentBorderColor
};
}
if (p.success) {
return {
color: v.successColor,
backgroundColor: v.successBackgroundColor,
borderColor: v.successBorderColor
};
}
if (p.warning) {
return {
color: v.warningColor,
backgroundColor: v.warningBackgroundColor,
borderColor: v.warningBorderColor
};
}
return {
color: v.color,
backgroundColor: v.backgroundColor,
borderColor: v.borderColor
};
};
export var alertStyles = {
root: function root(_ref) {
var p = _ref.props,
v = _ref.variables,
siteVariables = _ref.theme.siteVariables;
return Object.assign({
display: 'flex',
alignItems: 'center',
position: 'relative',
borderStyle: v.borderStyle,
borderWidth: v.borderWidth,
borderRadius: v.borderRadius,
minHeight: v.minHeight,
padding: v.padding,
fontWeight: v.fontWeight,
visibility: 'visible',
boxSizing: 'border-box'
}, getIntentColorsFromProps(p, v), (p.attached === 'top' || p.attached === true) && {
borderRadius: v.borderRadius + " " + v.borderRadius + " 0 0"
}, p.attached === 'bottom' && {
borderRadius: "0 0 " + v.borderRadius + " " + v.borderRadius
}, p.fitted && {
display: 'inline-flex'
}, p.dismissible && {
padding: v.dismissiblePadding
}, !p.visible && {
visibility: 'hidden'
});
},
actions: function actions(_ref2) {
var v = _ref2.variables;
return {
margin: v.actionsMargin
};
},
header: function header(_ref3) {
var v = _ref3.variables;
return {
fontWeight: v.headerFontWeight,
margin: v.headerMargin
};
},
body: function body() {
return {
display: 'flex',
flexGrow: 1
};
},
content: function content() {
return {
flexGrow: 1
};
},
icon: function icon(_ref4) {
var v = _ref4.variables;
return {
display: 'inline-flex',
alignItems: 'center',
justifyContent: 'center',
width: v.iconSize,
height: v.iconSize,
'& > :first-child': {
height: '100%',
width: '100%',
'& svg': {
height: '100%',
width: '100%'
}
},
margin: v.iconMargin
};
}
};
//# sourceMappingURL=alertStyles.js.map