Skip to content

jondotblack/styled-system-emotion-grid-system

Repository files navigation

Styled System + Emotion Grid System

A simple flexbox grid system using Styled System and Emotion.

Stack

- React
- Emotion
- Styled System
- Jest
- React Testing Library

See it in use on https://www.jon.black
View blog post at https://www.jon.black/blog/react-grid-system-using-emotion-and-styled-system
View Storybook at https://jondotblack.github.io/styled-system-emotion-grid-system/

Getting started

To get up and running;

$ npm install

# after installation finishes run,
$ npm run storybook

A unique local URL will be generated and displayed in the terminal.

Running Tests

There are currently only a few tests added to demonstrate the testing utils that help with using Emotion's ThemeProvider.

$ npm run test

# to see a breakdown of which lines are covered by tests
$ npm run test:coverage