Onlaw UI

Goals

• Accessibility
• Allow for theming (with emotion)

Installation

yarn add emotion-theming @emotion/core @onlaw/ui

Use

Import components as needed from @onlaw/ui. With Onlaw UI you have to use emotion's jsx pragma:

/** @jsx jsx */
import { jsx } from '@emotion/core'
import { Logo } from '@onlaw/ui'

const Component = () => <Logo />

Note

@onlaw/ui uses emotion (v10) for styling and theming. You must set up a <ThemeProvider /> to give the components access to the theme:

import { ThemeProvider } from 'emotion-theming'
import { theme } from '@onlaw/ui'

const App = () => (
  <ThemeProvider theme={theme}>
    <Component />
  </ThemeProvider>
)