@croud-ui/element-plus-theme

Croud control element plus theme and reset stylesheet built using the @croud-ui/tokens package.

Install

You can install this theme from the npm registry:

yarn add @croud-ui/element-plus-theme --dev

This package doesn't do much on its own. You will also need to install sass and element-plus:

element-plus:

yarn add element-plus

sass:

yarn add sass --dev

Usage

Use element theme

To use the custom element-plus theme you will need to import this package before element-plus's chalk-theme sass files.

SCSS:

// import theme before elements theme-chalk import
@use "@croud-ui/element-plus-theme";

// import theme-chalk sass files
@use "element-plus/theme-chalk/src/index";

JavaScript (ESM):

// import theme before elements theme-chalk import
import "@croud-ui/element-plus-theme/src/theme.scss";

// import theme-chalk sass files
import "element-plus/theme-chalk/src/index.scss";

Please refer to element-plus documentation for more complete theme configuration instructions.

Reset styles (recommended)

We also recommend importing our reset stylesheet that provides sensible browser resets and default styling for native elements.

SCSS:

// import reset stylesheet globally
@use "@croud-ui/element-plus-theme/src/reset"

JavaScript (ESM):

// import reset stylesheet globally
import "@croud-ui/element-plus-theme/src/reset.scss";

Note: our reset stylesheet is an extension of elements theme-chalk reset stylesheet so you don't need to import both here.

License

Licensed under the MIT License