@fluentui/react-northstar
Version:
A themable React component library.
34 lines (33 loc) • 1.74 kB
JavaScript
import { pxToRem } from '../../../../utils';
import { DAYS_IN_WEEK } from '../../../../utils/date-time-utilities';
export var datepickerVariables = function datepickerVariables(siteVars) {
return {
calendarCellBorder: 'none',
calendarCellHeight: pxToRem(34),
calendarCellWidth: pxToRem(34),
calendarCellPadding: pxToRem(0),
calendarCellMargin: pxToRem(0),
calendarCellBackgroundColor: siteVars.colorScheme.default.background,
calendarCellColor: 'inherit',
calendarCellQuietColor: siteVars.colorScheme.default.foreground2,
calendarCellSelectedColor: siteVars.colorScheme.brand.background4,
calendarCellSelectedBackgroundColor: siteVars.colorScheme.brand.borderActive1,
calendarCellTodayBackgroundColor: siteVars.colorScheme.brand.backgroundFocus,
calendarCellTodayColor: siteVars.colorScheme.white.foreground,
calendarCellTodayBorderRadius: '50%',
calendarCellHoverBackgroundColor: siteVars.colorScheme.brand.backgroundHover2,
calendarCellHoverColor: 'inherit',
calendarCellDisabledColor: siteVars.colorScheme.brand.foregroundDisabled,
calendarCellDisabledBackgroundColor: siteVars.colorScheme.default.background,
calendarHeaderCellFontWeight: siteVars.fontWeightRegular,
calendarHeaderCellHeight: pxToRem(32),
calendarHeaderCellPadding: pxToRem(2) + " " + pxToRem(0) + " " + pxToRem(2) + " " + pxToRem(0),
calendarHeaderCellWidth: "calc(100%/" + DAYS_IN_WEEK + ")",
calendarHeaderPaddingTop: pxToRem(5),
calendarHeaderPaddingBottom: pxToRem(5),
calendarHeaderLabelPaddingLeft: pxToRem(10),
calendarHeaderLabelFontWeight: siteVars.fontWeightBold,
calendarMinHeight: pxToRem(282)
};
};
//# sourceMappingURL=datepickerVariables.js.map