braid-design-system
Version:
Themeable design system for the SEEK Group
71 lines (70 loc) • 2.56 kB
JavaScript
"use strict";
const fileScope = require("@vanilla-extract/css/fileScope");
const css = require("@vanilla-extract/css");
const lib_css_colorModeStyle_cjs = require("../../../css/colorModeStyle.cjs");
const lib_themes_vars_css_cjs = require("../../../themes/vars.css.cjs");
fileScope.setFileScope("src/lib/components/private/Keyline/Keyline.css.ts", "braid-design-system");
const keylineVars = css.createThemeContract({
promote: null,
info: null,
positive: null,
caution: null,
critical: null,
formAccent: null
});
const lightModeVars = {
vars: css.assignVars(keylineVars, {
promote: lib_themes_vars_css_cjs.vars.borderColor.promote,
info: lib_themes_vars_css_cjs.vars.borderColor.info,
positive: lib_themes_vars_css_cjs.vars.borderColor.positive,
caution: lib_themes_vars_css_cjs.vars.borderColor.caution,
critical: lib_themes_vars_css_cjs.vars.borderColor.critical,
formAccent: lib_themes_vars_css_cjs.vars.borderColor.formAccent
})
};
const darkModeVars = {
vars: css.assignVars(keylineVars, {
promote: lib_themes_vars_css_cjs.vars.borderColor.promoteLight,
info: lib_themes_vars_css_cjs.vars.borderColor.infoLight,
positive: lib_themes_vars_css_cjs.vars.borderColor.positiveLight,
caution: lib_themes_vars_css_cjs.vars.borderColor.cautionLight,
critical: lib_themes_vars_css_cjs.vars.borderColor.criticalLight,
formAccent: lib_themes_vars_css_cjs.vars.borderColor.formAccentLight
})
};
const tone = css.styleVariants(keylineVars, (_, name) => ({
background: keylineVars[name]
}), "tone");
const lightMode = css.styleVariants({
light: lib_css_colorModeStyle_cjs.colorModeStyle({
lightMode: lightModeVars
}),
dark: lib_css_colorModeStyle_cjs.colorModeStyle({
lightMode: darkModeVars
})
}, "lightMode");
const darkMode = css.styleVariants({
light: lib_css_colorModeStyle_cjs.colorModeStyle({
darkMode: lightModeVars
}),
dark: lib_css_colorModeStyle_cjs.colorModeStyle({
darkMode: darkModeVars
})
}, "darkMode");
const noRadiusOnRight = css.style({
borderTopRightRadius: "0 !important",
borderBottomRightRadius: "0 !important"
}, "noRadiusOnRight");
const largestWidth = css.style({
width: lib_themes_vars_css_cjs.vars.borderRadius.xlarge
}, "largestWidth");
const width = css.style({
width: lib_themes_vars_css_cjs.vars.grid
}, "width");
fileScope.endFileScope();
exports.darkMode = darkMode;
exports.largestWidth = largestWidth;
exports.lightMode = lightMode;
exports.noRadiusOnRight = noRadiusOnRight;
exports.tone = tone;
exports.width = width;