braid-design-system
Version:
Themeable design system for the SEEK Group
20 lines (19 loc) • 740 B
JavaScript
import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
import { style } from "@vanilla-extract/css";
import { calc } from "@vanilla-extract/css-utils";
import { pageBlockGutters } from "../PageBlock/pageBlockGutters.mjs";
import { toastWidth } from "./consts.mjs";
import { vars } from "../../themes/vars.css.mjs";
setFileScope("src/lib/components/useToast/Toaster.css.ts", "braid-design-system");
const screenWidth = calc("100vw").subtract(calc(2).multiply(vars.space[pageBlockGutters.mobile]));
const toaster = style({
left: 0,
right: 0,
marginInline: "auto",
bottom: vars.space.xsmall,
maxWidth: `min(${vars.contentWidth[toastWidth]}, ${screenWidth})`
}, "toaster");
endFileScope();
export {
toaster
};