Styled utility functions package

Styled utility functions package.md

Styled utility functions package

I try and resist putting stuff in this package. But its just for overflow when theme/markup doesn't cut it, and if I CONTINUALLY reuse some styles.

Package structure

.
├── defaultTheme
│   └── index.js
├── index.js
└── render
    └── index.js

defaultTheme.js

import { setLightness } from 'polished';
import c from '@project/colors';

export default {
  page: {
    background: {
      color: setLightness(0.9, c.brand.grey),
    },
    color: c.brand.black,
    colorSecondary: c.brandLight.black,
  },
 ....etc...

render/index.js

import c from '@project/colors';

export const error = ({ error = false }) => (error
  ? `
  color: ${c.brand.error};
`
  : EMPTY);

....etc...