[github/bastienwirtz/homer.git] / docs / development.md

## Development

```sh
# Using yarn (recommended)
yarn install
yarn serve

# **OR** Using npm
npm install
npm run serve
```

### Themes

Themes are meant to be simple customization (written in [scss](https://sass-lang.com/documentation/syntax)).
To add a new theme, just add a file in the theme directory, and put all style in the `body #app.theme-<name>` scope. Then import it in the main style file.

```scss
// `src/assets/themes/my-awesome-theme.scss`
body #app.theme-my-awesome-theme. { ... }
```

```scss
// `src/assets/app.scss`
// Themes import
@import "./themes/sui.scss";
...
@import "./themes/my-awesome-theme.scss";
```
Commit	Line	Data
2662b170	1	## Development
1bc75494 BW	2
	3	```sh
	4	# Using yarn (recommended)
	5	yarn install
	6	yarn serve
	7
	8	# OR Using npm
	9	npm install
	10	npm run serve
	11	```
	12
	13	### Themes
	14
	15	Themes are meant to be simple customization (written in [scss](https://sass-lang.com/documentation/syntax)).
2662b170	16	To add a new theme, just add a file in the theme directory, and put all style in the `body #app.theme-<name>` scope. Then import it in the main style file.
1bc75494 BW	17
	18	```scss
	19	// `src/assets/themes/my-awesome-theme.scss`
	20	body #app.theme-my-awesome-theme. { ... }
	21	```
	22
	23	```scss
	24	// `src/assets/app.scss`
	25	// Themes import
	26	@import "./themes/sui.scss";
	27	...
	28	@import "./themes/my-awesome-theme.scss";
	29	```