@fluentui/react-northstar
Version:
A themable React component library.
58 lines (56 loc) • 2.75 kB
JavaScript
;
exports.__esModule = true;
exports.menuColorAreas = exports.carouselNavigationVariables = void 0;
var _utils = require("../../../../utils");
var _colorUtils = require("../../../colorUtils");
var menuColorAreas = (0, _utils.stringLiteralsArray)('border', 'borderActive', 'foregroundActive', 'foregroundFocus', 'foregroundHover', 'backgroundHover', 'backgroundActive', 'backgroundFocus', 'foregroundDisabled');
exports.menuColorAreas = menuColorAreas;
var carouselNavigationVariables = function carouselNavigationVariables(siteVars) {
return {
width: 300,
colorScheme: (0, _colorUtils.pickValuesFromColorScheme)((0, _colorUtils.extendColorScheme)(siteVars.colorScheme, {
default: {
borderActive: siteVars.colorScheme.default.border2,
backgroundActive: siteVars.colorScheme.default.backgroundActive1,
backgroundFocus: siteVars.colorScheme.default.backgroundFocus1,
foregroundDisabled: siteVars.colorScheme.default.foregroundDisabled1
},
brand: {
foregroundHover: siteVars.colors.white,
backgroundHover: siteVars.colors.brand[300],
foregroundActive: siteVars.colors.white,
borderActive: siteVars.colors.brand[600],
backgroundActive: siteVars.colors.brand[500],
// it's 600 in the color scheme
foregroundFocus: siteVars.colors.white,
backgroundFocus: siteVars.colors.brand[300],
foregroundDisabled: siteVars.colorScheme.brand.foregroundDisabled1
}
}), menuColorAreas),
color: siteVars.colors.grey[500],
colorActive: siteVars.colors.black,
borderColor: undefined,
borderColorActive: undefined,
borderColorFocus: siteVars.colors.white,
outlineColorFocus: siteVars.colors.black,
backgroundColor: undefined,
backgroundColorFocus: undefined,
backgroundColorHover: undefined,
backgroundColorActive: undefined,
iconOnlyColorActive: siteVars.colors.brand[600],
lineHeightBase: siteVars.lineHeightMedium,
horizontalPadding: (0, _utils.pxToRem)(14) + " " + (0, _utils.pxToRem)(18),
verticalBackgroundColor: siteVars.colors.white,
verticalItemPadding: (0, _utils.pxToRem)(7) + " " + (0, _utils.pxToRem)(14),
verticalItemBorderWidth: (0, _utils.pxToRem)(2),
verticalItemBorderColor: 'transparent',
verticalBackgroundColorFocus: siteVars.colors.grey[150],
primaryBorderColor: siteVars.colorScheme.default.border2,
indicatorBackgroundColor: siteVars.colors.grey[500],
indicatorActiveBackgroundColor: siteVars.colors.brand[600],
borderWidth: (0, _utils.pxToRem)(1),
thumbnailWidth: 75
};
};
exports.carouselNavigationVariables = carouselNavigationVariables;
//# sourceMappingURL=carouselNavigationVariables.js.map