pantoken / css-in-js

css-in-js ​

Kokeellinen

@pantoken/css-in-js — Instructure-teemaobjekti ajonaikaisille CSS-in-JS-kirjastoille.

Toimii minkä tahansa kirjaston kanssa, joka lukee teeman props.theme:sta — Emotion, styled-components ja Stitches noudattavat samaa käytäntöä. pantokenTheme on valmiiksi tehty rebrand-objekti, var()-tuettu, joten vaalea/tumma-vaihto kulkee @pantoken/css:n kautta. toStyledTheme rakentaa sellaisen mistä tahansa IR:stä (ja voi koventaa konkreettiset arvot { resolve }).

Esimerkki ​

styled-components

tsx
import { ThemeProvider } from "styled-components";
import { pantokenTheme } from "@pantoken/css-in-js";
<ThemeProvider theme={pantokenTheme}>...</ThemeProvider>;
// const Btn = styled.button`background: ${({ theme }) => theme.colorBackgroundBrand};`;

Rajapinnat ​

Tyyppialiasit ​

Muuttujat ​

Funktionit ​

Viittaukset ​

Mode ​

Vie uudelleen Mode

default ​

Nimeää uudelleen ja uudelleenvie pantokenTheme