OneView UI Tokens

Design tokens for OneView project.

Installation

With NPM

$ npm install @one-view/tokens

With Yarn

$ yarn add @one-view/tokens

Usage

Simply import the tokens and use it in your JSS.

import React from "react"
import { createUseStyles } from "react-jss"
import * as tokens from "@one-view/tokens"

const useStyles = createUseStyles({
  myButton: {
    color: tokens.colors.white,
    backgroundColor: tokens.colors.blue,
    padding: tokens.spacing[2]
  }
})

const Button = (props) => {
  const classes = useStyles();

  return (<button className={ classes.myButton }>{ props.children }</button>)
}

export default Button

Available Tokens

[TODO] Add documentation link

• tokens.colors
• tokens.fontSize
• tokens.fontWeight
• tokens.weight