@iscdev/uikit v1.0.10

UI-kit

uikit整合了一些常用的css样式类，还加入了一套针对ElementPlus的主题

安装

yarn add @iscdev/uikit

整合的样式类有如下

• border 边框相关的常用样式
• flex flex弹性盒相关的常用样式
• font 字体相关的常用样式
• offset margin和padding的常用样式
• reset 兼容各浏览器样式差异的重置样式
• size 尺寸相关的常用样式
• text 文本相关的常用样式

使用

1. 需要先安装uikit库
2. 在适当的地方导入uikit，import '@iscdev/uikit'，尽量靠前
3. 即可直接用于

css变量

整合的功能色以及各颜色的亮度色和暗度色

• primary 品牌色
• success 成功
• warning 警告
• danger 危险

若干灰度色

• 00 黑色
• 19 特殊黑
• 33 标题正文
• 66 辅助图标
• 80 中性灰
• 99 小副标题、图标
• b3 占用文字、辅助文字
• d9 禁用文字、输入框悬浮
• e6 边框
• f2 背景色、描边
• ff 白色

使用

需要在待应用的节点上增加一个名为use-isc-color-var的属性，即可在其节点和子节点中使用这些css变量

• 使用原色，如使用品牌原色：var(--isc-color-primary)
• 使用1-5级亮度色，如使用品牌色2级亮度：var(--isc-color-primary-lighten2)
• 使用1级暗度色，如使用品牌色2级亮度：var(--isc-color-primary-darken1)

主题

主题基于ElementPlus，有明亮模式和暗色模式两套主题

使用

1. 需要先安装uikit库
2. 若要使用亮色主题，则在待应用的节点导航增加一个名为use-isc-light-theme的属性
3. 若要使用暗色主题，则在待应用的节点导航增加一个名为use-isc-dark-theme的属性