@fluentui/react-northstar
Version:
A themable React component library.
32 lines (31 loc) • 1.43 kB
JavaScript
import { pxToRem } from '../../../../utils';
export var listItemVariables = function listItemVariables(siteVariables) {
return {
minHeight: pxToRem(48),
rootPadding: "0 " + pxToRem(18) + " 0 " + pxToRem(20),
gap: pxToRem(8),
zIndex: siteVariables.zIndexes.foreground,
// Header
// TODO: prod app uses 17.5px here, it should be 16px per the design guide!
headerLineHeight: siteVariables.lineHeightSmall,
headerFontSize: siteVariables.fontSizes.medium,
// Header Media
headerMediaFontSize: siteVariables.fontSizes.small,
// TODO: prod app uses 17.5px here, it should be 16px per the design guide!
headerMediaLineHeight: siteVariables.lineHeightSmall,
importantFontWeight: siteVariables.fontWeightBold,
// Content
contentFontSize: siteVariables.fontSizes.small,
contentLineHeight: siteVariables.lineHeightSmall,
// Content Media
contentMediaFontSize: siteVariables.fontSizes.small,
contentMediaLineHeight: siteVariables.lineHeightSmall,
// Selectable
selectableFocusHoverColor: siteVariables.colorScheme.default.foregroundHover,
selectableFocusHoverBackgroundColor: siteVariables.colorScheme.default.backgroundHover,
// Selected
selectedColor: siteVariables.colorScheme.default.foregroundPressed,
selectedBackgroundColor: siteVariables.colorScheme.default.backgroundActive1
};
};
//# sourceMappingURL=listItemVariables.js.map