README
PX Blue themes for Eaton applications
These packages provide theming support for Eaton applications using the PX Blue design system. It includes resources for developers using:
- Angular w/ Angular Material
- React w/ Material UI
- React Native w/ @pxblue/react-native-components
The PX Blue theme packages come with two theme options: a Blue theme (standard) and a Dark theme. Read more about the designs of those themes on our website.
Installation
Previously, these themes were published together as @pxblue/themes, but they have since been separated into distinct packages for each framework for better versioning and dependency management. Get started by installing the appropriate package for your chosen framework:
yarn add @pxblue/angular-themes
yarn add @pxblue/react-themes
yarn add @pxblue/react-native-themes
NOTE: We also have a theme package for theming storybook documentation applications in a PX Blue style (@pxblue/storybook-themes).
Usage
Depending on the framework that you are using, PX Blue themes are applied in different ways. Please follow the instructions for your chosen framework for integrating the themes into your application:
Demos
| Framework | Live Examples |
|---|---|
| Angular | View on Stackblitz |
| React | View on Code Sandbox |
| React Native | Coming Soon |