Meet npm Pro: unlimited public & private packages + package-based permissions.Learn more »

cx-theme-material

18.7.0 • Public • Published

Material Theme

This is a package that enables Material Design like appearance for the CxJS framework. Take a look at the theme preview and compare it to the other themes here.

Usage

In order to use the theme, install its npm package:

npm install cx-theme-material

Import theme's JavaScript. If you want material design label and validation behavior, do the following:

import { enableMaterialLabelPlacement, enableMaterialHelpPlacement } from "cx-theme-material";

enableMaterialLabelPlacement();
enableMaterialHelpPlacement();

otherwise, just import the theme:

import "cx-theme-material";

Then, import theme styles from the package by adding the following snippet to one of your SCSS files:

// theme variables can be overridden here

@import "~cx-theme-material/src/variables";

// theme state-style-maps can be overridden here, before importing css

@import "~cx-theme-material/src/index";

// add custom CSS here

If you are using cx-scaffold to start, be sure to replace the line under the comment inside config/webpack.config.js:

//add here any ES6 based library
include: /[\\\/](app|cx|cx-react)[\\\/]/,

with the following:

//add here any ES6 based library
include: /[\\\/](app|cx|cx-react|cx-theme-material)[\\\/]/,

Finally, don't forget to add material icons to your project, as described here.

To learn more about Cx styling and how to customize it, click here.

Keywords

none

Install

npm i cx-theme-material

DownloadsWeekly Downloads

22

Version

18.7.0

License

SEE LICENSE.md

Unpacked Size

206 kB

Total Files

13

Last publish

Collaborators

  • avatar