stile

a simple tool to help you using inline-styles with react

install

$ npm install --save stile

modules

import {
  createStyleSheet,
  em,
  rem,
  percent,
  deg,
  vw,
  vh,
  join,
  list,
} from "stile"

api

object createStyleSheet(styles: object)

Prefixes and freezes your style declaration.

const styles = createStyleSheet({
  title: {
    color: "red",
  },
})

string em(value: number)

Adds the em unit to your value

em(1.5) // "1.5em"

string rem(value: number)

Adds the rem unit to your value

rem(1.5) // "1.5rem"

string percent(value: number)

Adds the % unit to your value

percent(1.5) // "1.5%"

string deg(value: number)

Adds the deg unit to your value

deg(1.5) // "1.5deg"

string vw(value: number)

Adds the vw unit to your value

vw(1.5) // "1.5vw"

string vh(value: number)

Adds the vh unit to your value

vh(1.5) // "1.5vh"

string join(...values)

Joins values with a space

join(0, 0, rem(1)) // "0 0 1rem"

string list(...values)

Joins values with a comma

list("300ms linear color", "200ms linear height") // "300ms linear color, 200ms linear height"