定制主题

在1.0.0及其以上的版本实现了定制主题功能，尽管目前提供支持的有限，但相信在未来它会得到补充完善。

ZBaseUI 在设计规范上支持一定程度的样式定制，以满足业务和品牌上多样化的视觉需求，包括但不限于主色、圆角、边框和部分组件的视觉定制。

样式变量

ZBaseUI的样式使用了 less，来实现并定义了一系列的样式变量，你可以根据需求进行相应调整。

以下是一些常用的通用变量。

@primary: #409eff; // 全局主色
@success: #67c23a; // 成功
@warning: #e6a23c; // 警告
@danger: #f56c6c; // 危险
@info: #909399; // 普通
@textColor: #303133; // 主文本色
@borderWidth: 1px; // 边框宽度
@borderStyle: solid; // 边框样式
@borderRadiusBase: 4px; // 边框圆角
@borderRadiusSmall: 2px; // 边框圆角

定制方式

建立一个单独的 less 变量文件，在这个文件中引入 theme.less，并对它进行覆盖，然后再 main.ts 或 main.js 中引入这个less文件。

@import "@import "@d7ee/z-base-ui/dist/style/theme";

@primary: #ce93d8;