36 lines
889 B
TypeScript
36 lines
889 B
TypeScript
import type { Integration, IntegrationContext } from "../contracts/index.ts";
|
|
import { compileCss } from "../views/css/index.ts";
|
|
|
|
export interface ResponsivityOptions {
|
|
breakpoints?: Record<string, string>;
|
|
route?: string;
|
|
}
|
|
|
|
export const DEFAULT_BREAKPOINTS = {
|
|
sm: "40rem",
|
|
md: "48rem",
|
|
lg: "64rem",
|
|
xl: "80rem",
|
|
};
|
|
|
|
/** Adds mobile-first `@responsive name {}` blocks to STCSS. */
|
|
export function responsivityIntegration(
|
|
options: ResponsivityOptions = {},
|
|
): Integration {
|
|
const breakpoints = { ...DEFAULT_BREAKPOINTS, ...options.breakpoints };
|
|
return {
|
|
name: "responsivity",
|
|
setup(context: IntegrationContext) {
|
|
context.loader("responsive-stcss", {
|
|
name: "responsive-stcss",
|
|
extensions: [".responsive.stcss"],
|
|
load(file) {
|
|
return {
|
|
data: { breakpoints },
|
|
content: compileCss(file.source, { breakpoints }),
|
|
};
|
|
},
|
|
});
|
|
},
|
|
};
|
|
}
|