# Themes

[![NPM version][badge-npm]][info-npm]

The themes folder contains configurations that provide scaffolding for products and components within each of the supported brands:

- Springer Nature
- Nature

## Using `themes` in your product

If you are working on a project with the **Springer Nature** theme then include the theme like this:

- Import the `core` theme into your core styles
```css
@import '../../node_modules/@springernature/elements/themes/springernature/scss/core.scss';
```
- Import the `enhanced` theme into your enhanced styles

```css
@import '../../node_modules/@springernature/elements/themes/springernature/scss/enhanced.scss';
```

- If you need them, import the `utilities` of the theme into your styles as a single import for all of them

```css
@import '../../node_modules/@springernature/elements/themes/springernature/scss/utilities.scss';
```

If you are working on a project with the **Nature** theme then include the theme like this:

- Import the `core` theme into your core styles
```css
@import '../../node_modules/@springernature/elements/themes/nature/scss/core.scss';
```
- Import the `enhanced` theme into your enhanced styles

```css
@import '../../node_modules/@springernature/elements/themes/nature/scss/enhanced.scss';
```

- If you need them, import the `utilities` of the theme into your styles as a single import for all of them

```css
@import '../../node_modules/@springernature/elements/themes/nature/scss/utilities.scss';
```

## License

[MIT License][info-license] &copy; 2020, Springer Nature
