UNPKG

@fluentui/react-northstar

Version:
144 lines (135 loc) 5.76 kB
"use strict"; exports.__esModule = true; exports.zIndexes = exports.transparentColors = exports.shadowLevel4 = exports.shadowLevel3 = exports.shadowLevel2 = exports.shadowLevel1Dark = exports.shadowLevel1 = exports.shadow8 = exports.shadow64 = exports.shadow4 = exports.shadow28 = exports.shadow2 = exports.shadow16 = exports.primitiveColors = exports.naturalColors = exports.lineHeightSmaller = exports.lineHeightSmall = exports.lineHeightMedium = exports.lineHeightLargest = exports.lineHeightLarger = exports.lineHeightLarge = exports.lineHeightDefault = exports.fontWeightSemilight = exports.fontWeightSemibold = exports.fontWeightRegular = exports.fontWeightLight = exports.fontWeightBold = exports.fontSizes = exports.focusOuterBorderColor = exports.focusInnerBorderColor = exports.contextualColors = exports.colorScheme = exports.categoryColors = exports.categoryColorScheme = exports.borderWidth = exports.borderRadiusXLarge = exports.borderRadiusSmall = exports.borderRadiusMedium = exports.bodyPadding = exports.bodyMargin = exports.bodyLineHeight = exports.bodyFontSize = exports.bodyFontFamily = exports.bodyColor = exports.bodyBackground = void 0; var _utils = require("../../utils"); var _colors = require("./colors"); exports.colors = _colors.colors; exports.contextualColors = _colors.contextualColors; exports.naturalColors = _colors.naturalColors; exports.primitiveColors = _colors.primitiveColors; exports.colorScheme = _colors.colorScheme; exports.transparentColors = _colors.transparentColors; var _categoryColors = require("./categoryColors"); exports.categoryColors = _categoryColors.categoryColors; exports.categoryColorScheme = _categoryColors.categoryColorScheme; // // COLORS // // // BORDER STYLES // var borderWidth = '1px'; exports.borderWidth = borderWidth; var borderRadiusSmall = '2px'; // input focus states exports.borderRadiusSmall = borderRadiusSmall; var borderRadiusMedium = '4px'; // default border radius exports.borderRadiusMedium = borderRadiusMedium; var borderRadiusXLarge = '8px'; // X Large Border Radius exports.borderRadiusXLarge = borderRadiusXLarge; var focusInnerBorderColor = _colors.colors.white; exports.focusInnerBorderColor = focusInnerBorderColor; var focusOuterBorderColor = _colors.colors.black; // // SHADOW LEVELS // exports.focusOuterBorderColor = focusOuterBorderColor; var shadowLevel1 = '0 .2rem .4rem -.075rem rgba(0, 0, 0, .1)'; exports.shadowLevel1 = shadowLevel1; var shadowLevel2 = '0 .4rem .7rem -.1rem rgba(0, 0, 0, .1)'; exports.shadowLevel2 = shadowLevel2; var shadowLevel3 = '0 .8rem 1rem -.2rem rgba(0, 0, 0, .1)'; exports.shadowLevel3 = shadowLevel3; var shadowLevel4 = '0 1.6rem 1.8rem -.4rem rgba(0, 0, 0, .1)'; exports.shadowLevel4 = shadowLevel4; var shadowLevel1Dark = '0 .2rem .4rem -.075rem rgba(0, 0, 0, .25)'; exports.shadowLevel1Dark = shadowLevel1Dark; var shadow2 = '0 0 2px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .14)'; exports.shadow2 = shadow2; var shadow4 = '0 0 2px rgba(0, 0, 0, .12), 0 2px 4px rgba(0, 0, 0, .14)'; exports.shadow4 = shadow4; var shadow8 = '0 0 2px rgba(0, 0, 0, .12), 0 4px 8px rgba(0, 0, 0, .14)'; exports.shadow8 = shadow8; var shadow16 = '0 0 2px rgba(0, 0, 0, .12), 0 8px 16px rgba(0, 0, 0, .14)'; exports.shadow16 = shadow16; var shadow28 = '0 0 8px rgba(0, 0, 0, .20), 0 14px 28px rgba(0, 0, 0, .24)'; exports.shadow28 = shadow28; var shadow64 = '0 0 8px rgba(0, 0, 0, .20), 0 32px 64px rgba(0, 0, 0, .24)'; // // FONT SIZES // exports.shadow64 = shadow64; var fontSizes = { smaller: (0, _utils.pxToRem)(10), small: (0, _utils.pxToRem)(12), medium: (0, _utils.pxToRem)(14), large: (0, _utils.pxToRem)(18), larger: (0, _utils.pxToRem)(24), largest: (0, _utils.pxToRem)(28) }; // // FONT WEIGHTS // exports.fontSizes = fontSizes; var fontWeightLight = 200; exports.fontWeightLight = fontWeightLight; var fontWeightSemilight = 300; exports.fontWeightSemilight = fontWeightSemilight; var fontWeightRegular = 400; exports.fontWeightRegular = fontWeightRegular; var fontWeightSemibold = 600; exports.fontWeightSemibold = fontWeightSemibold; var fontWeightBold = 700; // // LINE HEIGHTS // exports.fontWeightBold = fontWeightBold; var lineHeightDefault = 1; exports.lineHeightDefault = lineHeightDefault; var lineHeightSmaller = 1.2; exports.lineHeightSmaller = lineHeightSmaller; var lineHeightSmall = 1.3333; exports.lineHeightSmall = lineHeightSmall; var lineHeightMedium = 1.4286; exports.lineHeightMedium = lineHeightMedium; var lineHeightLarge = 1.3333; exports.lineHeightLarge = lineHeightLarge; var lineHeightLarger = 1.3333; exports.lineHeightLarger = lineHeightLarger; var lineHeightLargest = 1.3333; // // Z-INDEX // Used to maintain proper stack order of components // exports.lineHeightLargest = lineHeightLargest; var zIndexes = { background: 0, // Default value foreground: 1, // Put a component in front menuItem: 2, // Currently used only for menu item beak element overlay: 1000, // Dialog/popup/menu overlays overlayPriority: 1001, // for nested overlays, like tooltip in dialog. debug: 999999999 // for debug purposes }; // // SEMANTIC ASSIGNMENTS // exports.zIndexes = zIndexes; var bodyPadding = 0; exports.bodyPadding = bodyPadding; var bodyMargin = 0; exports.bodyMargin = bodyMargin; var bodyFontFamily = '"Segoe UI", system-ui, "Apple Color Emoji", "Segoe UI Emoji", sans-serif'; exports.bodyFontFamily = bodyFontFamily; var bodyFontSize = fontSizes.medium; exports.bodyFontSize = bodyFontSize; var bodyBackground = _colors.colors.white; exports.bodyBackground = bodyBackground; var bodyColor = _colors.colors.grey[750]; exports.bodyColor = bodyColor; var bodyLineHeight = lineHeightMedium; exports.bodyLineHeight = bodyLineHeight; //# sourceMappingURL=siteVariables.js.map