Element UI - Class customisation.
Can you please show an example on how I can modify the Element-plus's sass variables? I've tried so many ways. I'm using
el-dialog
el-dialog__body
Replies (1)
Hi,
You can override all sass variables in a separate sass file.
Create new sass file and include variables which you want to override and ~element-ui/packages/theme-chalk/src/index style import then include this file in main.ts or App.vue.
/* theme color */
$--color-primary: teal;/* icon font path, required */
$--font-path: '~element-ui/lib/theme-chalk/fonts';
@import "~element-ui/packages/theme-chalk/src/index";
If you will use a separate file to override variables do not forget to remove our default element-ui style import from App.vue.
Please check Element UI official doc for more info.
https://element.eleme.io/#/en-US/component/custom-theme#changing-theme-color