@fluentui/react-northstar
Version:
A themable React component library.
75 lines (73 loc) • 3.85 kB
JavaScript
"use strict";
exports.__esModule = true;
exports.buttonVariables = void 0;
var _utils = require("../../../../utils");
var buttonVariables = function buttonVariables(siteVars) {
return {
padding: "0 " + (0, _utils.pxToRem)(20),
height: (0, _utils.pxToRem)(32),
minWidth: (0, _utils.pxToRem)(96),
loadingMinWidth: (0, _utils.pxToRem)(118),
maxWidth: (0, _utils.pxToRem)(280),
borderRadius: siteVars.borderRadiusMedium,
contentFontSize: siteVars.fontSizes.medium,
contentFontWeight: siteVars.fontWeightSemibold,
contentLineHeight: siteVars.lineHeightMedium,
color: siteVars.colorScheme.default.foreground,
colorHover: siteVars.colorScheme.default.foregroundHover,
colorActive: siteVars.colorScheme.default.foregroundPressed,
colorDisabled: siteVars.colorScheme.brand.foregroundDisabled,
colorFocus: undefined,
iconSize: (0, _utils.pxToRem)(16),
backgroundColor: siteVars.colorScheme.default.background,
backgroundColorActive: siteVars.colorScheme.default.backgroundPressed,
backgroundColorHover: siteVars.colorScheme.default.backgroundHover1,
backgroundColorFocus: undefined,
backgroundColorDisabled: siteVars.colorScheme.default.backgroundDisabled,
borderColor: siteVars.colorScheme.default.border,
borderColorHover: siteVars.colorScheme.default.borderHover,
borderColorFocus: undefined,
borderColorActive: siteVars.colorScheme.default.borderPressed,
borderColorDisabled: 'transparent',
backgroundColorIconOnlyHover: siteVars.colorScheme.default.backgroundHover2,
primaryColor: siteVars.colorScheme.brand.foreground4,
primaryColorHover: siteVars.colorScheme.brand.foreground4,
primaryBackgroundColor: siteVars.colorScheme.brand.background,
primaryBackgroundColorActive: siteVars.colorScheme.brand.backgroundPressed,
primaryBackgroundColorHover: siteVars.colorScheme.brand.backgroundHover,
primaryBackgroundColorDisabled: siteVars.colorScheme.default.backgroundDisabled,
primaryBackgroundColorFocus: undefined,
primaryBorderColor: 'transparent',
tintedColor: siteVars.colorScheme.brand.foreground,
tintedColorHover: siteVars.colorScheme.brand.foregroundHover,
tintedBackgroundColor: siteVars.colorScheme.default.background,
tintedBackgroundColorActive: siteVars.colorScheme.brand.backgroundHover1,
tintedBackgroundColorHover: siteVars.colorScheme.brand.backgroundHover1,
tintedBorderColor: siteVars.colorScheme.brand.border1,
tintedBorderColorHover: siteVars.colorScheme.brand.borderHover,
circularBorderRadius: (0, _utils.pxToRem)(999),
textColor: siteVars.colorScheme.default.foreground1,
textColorHover: siteVars.colorScheme.brand.foreground1,
textPrimaryColor: siteVars.colorScheme.brand.foreground,
textPrimaryColorHover: siteVars.colorScheme.brand.foreground1,
textColorDisabled: siteVars.colorScheme.brand.foregroundDisabled1,
textColorIconOnlyHover: siteVars.colorScheme.brand.foregroundHover,
primaryBoxShadow: siteVars.shadowLevel1Dark,
boxShadow: siteVars.shadowLevel1,
loaderBorderSize: (0, _utils.pxToRem)(2),
loaderSize: (0, _utils.pxToRem)(20),
loaderSvgHeight: (0, _utils.pxToRem)(20),
loaderSvgAnimationHeight: (0, _utils.pxToRem)(-1200),
sizeSmallContentFontSize: siteVars.fontSizes.small,
sizeSmallContentLineHeight: siteVars.lineHeightSmall,
sizeSmallHeight: (0, _utils.pxToRem)(24),
sizeSmallMinWidth: (0, _utils.pxToRem)(72),
sizeSmallPadding: "0 " + (0, _utils.pxToRem)(8),
sizeSmallLoaderBorderSize: (0, _utils.pxToRem)(2),
sizeSmallLoaderSize: (0, _utils.pxToRem)(15),
sizeSmallLoaderSvgHeight: (0, _utils.pxToRem)(15),
sizeSmallLoaderSvgAnimationHeight: (0, _utils.pxToRem)(-880)
};
};
exports.buttonVariables = buttonVariables;
//# sourceMappingURL=buttonVariables.js.map