gov-theme

常用的主题变量

@primary-color: #1890ff;                         // 全局主色
@link-color: #1890ff;                            // 链接色
@success-color: #52c41a;                         // 成功色
@warning-color: #faad14;                         // 警告色
@error-color: #f5222d;                           // 错误色
@font-size-base: 14px;                           // 主字号
@heading-color: rgba(0, 0, 0, .85);              // 标题色
@text-color: rgba(0, 0, 0, .65);                 // 主文本色
@text-color-secondary : rgba(0, 0, 0, .45);      // 次文本色
@disabled-color : rgba(0, 0, 0, .25);            // 失效色
@border-radius-base: 4px;                        // 组件/浮层圆角
@border-color-base: #d9d9d9;                     // 边框色
@box-shadow-base: 0 2px 8px rgba(0, 0, 0, .15);  // 浮层阴影

所有变量在这里可以找到，所有变量

试用方法

1. 首先工程根目录创建.npmrc配置文件，写入如下内容

  @gov:registry=https://lib.yonyougov.top/repository/crux-npm

1. 然后试用如下命令引入主题包

 npm install gov-theme -S

1. 假设你有如下目录解构

 - src
   - style
     - index.less
   - MyComponent.js

你可以在index.less文件中引入主题包

 @import "~gove-theme/index"

 .my-header {
   background-color: @primary-color;
   padding: @card-head-padding;
 }

TODO

• 增加交互式主题包发布流程