Convex admin manages all scss files in app-assets folder and it also allows users to add their own scss files inside assets folder. Both app-assets and assets folders can be found in root of the downloaded package.
Grunt command for scss compile will generate all css files in app-assets/css.
It is not recommend you to change any scss files inside app-assets core files as it will get replace in next updates.
SCSS files structure for convex assets.
convex-html/
├── src/
| ├── sass/
| | ├── scss/
| | | ├── bootstrap/
| | | ├── bootstrap-extended/
| | | ├── core/
| | | ├── mixins/
| | | ├── pages/
| | | ├── plugins/
| | ├── app-variables.scss
| | ├── plugins.scss
| ├── app.scss
Following is the details of what all scss folders.
| # | Folder/Files | Details |
|---|---|---|
| 1 | bootstrap | bootstrap/ folder contain Bootstrap 4 core scss files, that can be updated with future bootstrap updates. |
| 2 | bootstrap-extended | bootstrap-extended/ folder contain customized bootstrap scss files for convex admin. |
| 3 | core | core/ folder contain colors, layouts, menu, mixins and variables folder. |
| 4 | pages | pages/ folder contains all page related scss files. |
| 5 | plugins | plugins/ folder contains all vendors scss files. |
| 6 | mixins | mixins/ folder contains all the mixins scss files. |
SCSS files structure for assets.
Users can add their changes or new scss files in assets/scss folder to avoid any unwanted behavior. We recommend you to not change any files in app-assets for future release safe updates.
Grunt command for scss compile will generate all css files in assets/css.
convex-html/
├── assets/
| ├── scss/
| | ├── variables/
| | ├── colors/
Use the variables/ and colors/ folder for in code assets/scss folder for template variable customization, it will override code scss variables.
For theme customization use variables & colors scss files to override bootstrap, convex and colors variables.