3

vanilla-extract — Zero-runtime Stylesheets-in-TypeScript.

 3 years ago
source link: https://vanilla-extract.style/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client
vanilla-extract — Zero-runtime Stylesheets-in-TypeScript.

Zero-runtime
Stylesheets in
TypeScript.

Use TypeScript as your preprocessor. Write type‑safe, locally scoped classes, variables and themes, then generate static CSS files at build time.
npm install @vanilla-extract/css
styles.css.ts
import { createTheme, style } from '@vanilla-extract/css';

export const [themeClass, vars] = createTheme({
  color: {
    brand: 'blue',
    white: '#fff'
  },
  space: {
    small: '4px',
    medium: '8px',
  }
});

export const hero = style({
  backgroundColor: vars.color.brandd,
  color: vars.color.white,
  padding: vars.space.large
});

report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK