UNPKG

@fluentui/react-northstar

Version:
77 lines (75 loc) 2.31 kB
"use strict"; exports.__esModule = true; exports.pillStyles = void 0; var _getBorderFocusStyles = require("../../getBorderFocusStyles"); var pillStyles = { root: function root(_ref) { var p = _ref.props, v = _ref.variables, siteVariables = _ref.theme.siteVariables; return Object.assign({ display: 'inline-flex', width: 'fit-content', position: 'relative', height: v.height, maxHeight: v.height, borderRadius: v.borderRadius, background: v.background, margin: v.margin, minWidth: v.minWidth, ':hover': { background: v.backgroundHover } }, p.rectangular && Object.assign({ borderRadius: v.roundedBorderRadius }, (p.size === 'small' || p.size === 'smaller') && { borderRadius: v.smallerRoundedBorderRadius }), p.size === 'smaller' && { minWidth: v.smallerMinWidth, margin: v.smallerMargin, height: v.smallerHeight, maxHeight: v.smallerHeight }, p.size === 'small' && { minWidth: v.smallMinWidth, margin: v.smallMargin, height: v.smallHeight, maxHeight: v.smallHeight }, p.disabled && { pointerEvents: 'none', cursor: 'not-allowed', background: v.disabledBackground, color: v.disabledColor, ':hover': { background: v.disabledBackground } }, p.appearance === 'outline' && Object.assign({ borderWidth: '1px', borderStyle: 'solid', background: v.outlineBackground, borderColor: v.outlineBorderColor, ':hover': { background: v.outlineBackground } }, p.disabled && { borderColor: v.outlineDisabledborder }), p.appearance === 'inverted' && Object.assign({ background: v.invertedBackground, ':hover': { background: v.invertedBackground } }, p.disabled && { background: v.disabledBackground }), p.selectable && Object.assign({ cursor: 'pointer' }, p.selected && { background: 'transparent', boxShadow: "inset " + v.selectedIconColor + " 0px 0px 0px 1px" }), p.actionable && { cursor: 'pointer' }, (0, _getBorderFocusStyles.getBorderFocusStyles)({ variables: siteVariables })); } }; exports.pillStyles = pillStyles; //# sourceMappingURL=pillStyles.js.map