npm’s 2019 JavaScript ecosystem survey analysis is now available!Get your copy here »

styletron-standard

2.0.3 • Public • Published 15 days ago

styletron-standard

Opinionated, standard interfaces for Styletron.

Check our documentation at styletron.org.

Installation

yarn add styletron-standard

API

Style object interface

import type {StyleObject} from "styletron-standard";

styletron-standard defines a specific style object interface (along with corresponding Flow type definitions).

Camel case properties

CSS property names are camel cased.

const style: StyleObject = {
  textAlign: "center"
};

Pseudo classes

Nesting is used for pseudo selectors.

const style: StyleObject = {
  textAlign: "center"
  ":hover": {
    color: "red"
  }
};

Media queries

To define styles that correspond to media queries, use nested style object.

const style: StyleObject = {
  textAlign: "center"
  "@media (max-width: 800px)": {
    color: "red"
  }
};

Declarative `@keyframes`

The animationName property takes a string, but declarative animation is also supported.

import type {KeyframesObject} from "styletron-standard";
 
const animation: KeyframesObject = {
  to: {},
  from: {}
};
 
const style: KeyframesObject = {
  animationName: animation
};

Declarative `@font-face`

The fontFamily property takes a string, fonts can also be used declaratively.

import type {FontFaceObject} from "styletron-standard";
 
const font: FontFaceObject = {
  src: "url(/path/to/font.woff)"
};
 
const style: StyleObject = {
  fontFamily: font
};

Engine interface

import type {StandardEngine} from "styletron-standard";

styletron-standard also defines a standard engine interface.

interface StandardEngine {
  renderStyle,
  renderKeyframes,
  renderFontFace,
};

Driver

import type {StandardEngine} from "styletron-standard";

Keywords

none

install

npm i styletron-standard

weekly downloads

36,428

version

2.0.3

license

MIT

homepage

github.com

repository

github

last publish

15 days ago

collaborators

Test with RunKit

Report a vulnerability