reactive-theme v0.0.1

Theme - class Theme

NOTE: This theme works best with styled-components.

The purpose of this package is to equip the user/developer with a theme designed to ease UI development. The reasoning behind it is to abstract visuals away from the development process. Such an approach allows for faster development due to the fact that devs can focus on core functionality rathar than on looks.

Abstraction of visuals allows for easier maintainability of the code base. This approach allows different devs to work on the same project simultaniously withot worrying that they'd be stepping over each others feet; Development can be done in parallel.

Usage

NOTE: The theme can be used in two different ways - as a plain object (theme.raw) or by using the class' interface/api.

Raw Theme (theme.raw)

{
  materialPalettes: { amber: { ... }, blue: { ... }, ... },
  mediaBreakpoints: { xs: { ... }, sm: { ... }, ... },
  mediaQueries: { xs: "@media (max-width: 0px)", ... },
  palette: { primary: { ... }, secondary: { ... }, ... },
  shadows: ["", "0px 1px 3px 0px rgba(0,0,0,0.2), ...", ...],
  spacings: { xs: "2px", sm: "4px", ... },
  typographies: { body: { ... }, button: { ... }, ... },
}

Theme Interface/API

Coming soon...