prisme-components-react
Version:
React components for the Prisme Design System
58 lines (39 loc) • 1.31 kB
Markdown
# prisme-components-react
[](https://www.npmjs.com/package/prisme-components-react)
> React components for the [Prisme Design System][].
[Prisme Design System]: https://github.com/halcyonnouveau/prisme
## Getting Started
Run the following command using npm:
```
npm install -S prisme-components-react
```
Or using yarn:
```
yarn add prisme-components-react
```
## ThemeProvider
Wrap the root of your application with the `ThemeProvider` component, which adds
the Design System theme to context for use in styled-components and sets
typographic defaults. This should only be included once in your application.
The ThemeProvider is a wrapper around styled-components' `ThemeProvider`.
```
import React from 'react';
import { ThemeProvider } from 'prisme-components-react';
class App extends React.Component {
render() {
return (
<ThemeProvider>
<h1>Hello</h1>
</ThemeProvider>
)
}
}
```
## Fonts
Prisme uses the `Roboto` and `Fira Sans` fonts, be sure to include a link in
your document `<head>`.
```
<link href="https://fonts.googleapis.com/css?family=Fira+Sans:400,700|Roboto:100,400&display=swap" rel="stylesheet">
```
## Components
View them [here](https://react.systemdesigndespris.me/).