@fluentui/react-northstar
Version:
A themable React component library.
55 lines (54 loc) • 2.86 kB
JavaScript
import _get from "lodash/get";
import { pxToRem } from '../../../../utils';
var toggleMovementDistance = pxToRem(20);
var padding = pxToRem(2);
var defaultValue = 'red';
export var checkboxVariables = function checkboxVariables(siteVars) {
return {
checkboxColor: 'transparent',
toggleBackground: 'transparent',
toggleBorderColor: siteVars.colors.grey[300],
toggleBorderStyle: "solid",
toggleBorderWidth: pxToRem(1),
toggleIndicatorColor: 'inherit',
checkboxCheckedColor: siteVars.colors.grey[500],
checkboxToggleCheckedBackground: 'transparent',
checkboxToggleCheckedBorderColor: siteVars.colors.grey[500],
checkboxToggleCheckedColor: 'inherit',
disabledColor: siteVars.colors.grey[300],
disabledCheckboxColor: siteVars.colors.grey[300],
disabledToggleBackground: 'transparent',
disabledToggleBorderColor: siteVars.colors.grey[200],
textColor: _get(siteVars, 'colorScheme.default.foreground1', defaultValue),
background: 'transparent',
borderColor: _get(siteVars, 'colorScheme.default.foreground1', defaultValue),
borderStyle: 'solid',
borderRadius: siteVars.borderRadiusSmall,
borderWidth: pxToRem(1),
indicatorColor: 'transparent',
gap: pxToRem(12),
margin: pxToRem(2.8) + " 0 0 0",
padding: padding,
rootPadding: '3px 5px',
textColorHover: _get(siteVars, 'colorScheme.default.foreground', defaultValue),
borderColorHover: _get(siteVars, 'colorScheme.default.foreground', defaultValue),
checkedBackgroundHover: _get(siteVars, 'colorScheme.brand.backgroundHover', defaultValue),
toggleBorderRadius: pxToRem(999),
toggleIndicatorSize: pxToRem(14),
toggleMargin: '0',
togglePadding: padding + " " + toggleMovementDistance + " " + padding + " " + padding,
toggleWidth: pxToRem(38),
toggleHeight: pxToRem(20),
checkedTextColor: _get(siteVars, 'colorScheme.default.foreground', defaultValue),
checkedBackground: _get(siteVars, 'colorScheme.brand.backgroundActive1', defaultValue),
checkedBorderColor: _get(siteVars, 'colorScheme.brand.backgroundActive1', defaultValue),
checkedIndicatorColor: _get(siteVars, 'colorScheme.default.background', defaultValue),
toggleCheckedPadding: padding + " " + padding + " " + padding + " " + toggleMovementDistance,
disabledBackground: _get(siteVars, 'colorScheme.default.background', defaultValue),
disabledBackgroundChecked: _get(siteVars, 'colorScheme.default.backgroundDisabled', defaultValue),
disabledBorderColor: _get(siteVars, 'colorScheme.default.foregroundDisabled1', defaultValue),
disabledCheckedIndicatorColor: _get(siteVars, 'colorScheme.default.foregroundDisabled', defaultValue),
disabledToggleIndicatorColor: _get(siteVars, 'colorScheme.default.foregroundDisabled', defaultValue)
};
};
//# sourceMappingURL=checkboxVariables.js.map