@chaoswise/ui 3.0.1 → 3.0.3

package/config/theme/chart.dark.js

@@ -0,0 +1,394 @@
+export default {
+  "color": [
+    "#2194ff",
+    "#f28941",
+    "#7a56e8",
+    "#00c7cc",
+    "#f44a4a",
+    "#5955ff",
+    "#ffe164",
+    "#d854ef",
+    "#4fe063"
+  ],
+  "backgroundColor": "#333333",
+  "textStyle": {},
+  "title": {
+    "textStyle": {
+      "color": "#ffffff"
+    },
+    "subtextStyle": {
+      "color": "#aaaaaa"
+    }
+  },
+  "line": {
+    "itemStyle": {
+      "borderWidth": "1"
+    },
+    "lineStyle": {
+      "width": "2"
+    },
+    "symbolSize": "0",
+    "symbol": "circle",
+    "smooth": false
+  },
+  "radar": {
+    "itemStyle": {
+      "borderWidth": "1"
+    },
+    "lineStyle": {
+      "width": "2"
+    },
+    "symbolSize": "0",
+    "symbol": "circle",
+    "smooth": false
+  },
+  "bar": {
+    "itemStyle": {
+      "barBorderWidth": "0",
+      "barBorderColor": "#ccc"
+    }
+  },
+  "pie": {
+    "itemStyle": {
+      "borderWidth": "0",
+      "borderColor": "#ccc"
+    }
+  },
+  "scatter": {
+    "itemStyle": {
+      "borderWidth": "0",
+      "borderColor": "#ccc"
+    }
+  },
+  "boxplot": {
+    "itemStyle": {
+      "borderWidth": "0",
+      "borderColor": "#ccc"
+    }
+  },
+  "parallel": {
+    "itemStyle": {
+      "borderWidth": "0",
+      "borderColor": "#ccc"
+    }
+  },
+  "sankey": {
+    "itemStyle": {
+      "borderWidth": "0",
+      "borderColor": "#ccc"
+    }
+  },
+  "funnel": {
+    "itemStyle": {
+      "borderWidth": "0",
+      "borderColor": "#ccc"
+    }
+  },
+  "gauge": {
+    "itemStyle": {
+      "borderWidth": "0",
+      "borderColor": "#ccc"
+    }
+  },
+  "candlestick": {
+    "itemStyle": {
+      "color": "#fd1050",
+      "color0": "#0cf49b",
+      "borderColor": "#fd1050",
+      "borderColor0": "#0cf49b",
+      "borderWidth": 1
+    }
+  },
+  "graph": {
+    "itemStyle": {
+      "borderWidth": "0",
+      "borderColor": "#ccc"
+    },
+    "lineStyle": {
+      "width": 1,
+      "color": "#aaa"
+    },
+    "symbolSize": "0",
+    "symbol": "circle",
+    "smooth": false,
+    "color": [
+      "#2194ff",
+      "#f28941",
+      "#7a56e8",
+      "#00c7cc",
+      "#f44a4a",
+      "#5955ff",
+      "#ffe164",
+      "#d854ef",
+      "#4fe063"
+    ],
+    "label": {
+      "color": "#cccccc"
+    }
+  },
+  "map": {
+    "itemStyle": {
+      "areaColor": "#eee",
+      "borderColor": "#444",
+      "borderWidth": 0.5
+    },
+    "label": {
+      "color": "#000"
+    },
+    "emphasis": {
+      "itemStyle": {
+        "areaColor": "rgba(255,215,0,0.8)",
+        "borderColor": "#444",
+        "borderWidth": 1
+      },
+      "label": {
+        "color": "rgb(100,0,0)"
+      }
+    }
+  },
+  "geo": {
+    "itemStyle": {
+      "areaColor": "#eee",
+      "borderColor": "#444",
+      "borderWidth": 0.5
+    },
+    "label": {
+      "color": "#000"
+    },
+    "emphasis": {
+      "itemStyle": {
+        "areaColor": "rgba(255,215,0,0.8)",
+        "borderColor": "#444",
+        "borderWidth": 1
+      },
+      "label": {
+        "color": "rgb(100,0,0)"
+      }
+    }
+  },
+  "categoryAxis": {
+    "axisLine": {
+      "show": true,
+      "lineStyle": {
+        "color": "#282828"
+      }
+    },
+    "axisTick": {
+      "show": true,
+      "lineStyle": {
+        "color": "#282828"
+      }
+    },
+    "axisLabel": {
+      "show": true,
+      "color": "#cccccc"
+    },
+    "splitLine": {
+      "show": true,
+      "lineStyle": {
+        "color": [
+          "#282828"
+        ]
+      }
+    },
+    "splitArea": {
+      "show": false,
+      "areaStyle": {
+        "color": [
+          "#eeeeee"
+        ]
+      }
+    }
+  },
+  "valueAxis": {
+    "axisLine": {
+      "show": true,
+      "lineStyle": {
+        "color": "#282828"
+      }
+    },
+    "axisTick": {
+      "show": true,
+      "lineStyle": {
+        "color": "#282828"
+      }
+    },
+    "axisLabel": {
+      "show": true,
+      "color": "#cccccc"
+    },
+    "splitLine": {
+      "show": true,
+      "lineStyle": {
+        "color": [
+          "#282828"
+        ]
+      }
+    },
+    "splitArea": {
+      "show": false,
+      "areaStyle": {
+        "color": [
+          "#eeeeee"
+        ]
+      }
+    }
+  },
+  "logAxis": {
+    "axisLine": {
+      "show": true,
+      "lineStyle": {
+        "color": "#282828"
+      }
+    },
+    "axisTick": {
+      "show": true,
+      "lineStyle": {
+        "color": "#282828"
+      }
+    },
+    "axisLabel": {
+      "show": true,
+      "color": "#cccccc"
+    },
+    "splitLine": {
+      "show": true,
+      "lineStyle": {
+        "color": [
+          "#282828"
+        ]
+      }
+    },
+    "splitArea": {
+      "show": false,
+      "areaStyle": {
+        "color": [
+          "#eeeeee"
+        ]
+      }
+    }
+  },
+  "timeAxis": {
+    "axisLine": {
+      "show": true,
+      "lineStyle": {
+        "color": "#282828"
+      }
+    },
+    "axisTick": {
+      "show": true,
+      "lineStyle": {
+        "color": "#282828"
+      }
+    },
+    "axisLabel": {
+      "show": true,
+      "color": "#cccccc"
+    },
+    "splitLine": {
+      "show": true,
+      "lineStyle": {
+        "color": [
+          "#282828"
+        ]
+      }
+    },
+    "splitArea": {
+      "show": false,
+      "areaStyle": {
+        "color": [
+          "#eeeeee"
+        ]
+      }
+    }
+  },
+  "toolbox": {
+    "iconStyle": {
+      "borderColor": "#999"
+    },
+    "emphasis": {
+      "iconStyle": {
+        "borderColor": "#666"
+      }
+    }
+  },
+  "legend": {
+    "textStyle": {
+      "color": "#cccccc"
+    }
+  },
+  "tooltip": {
+    "axisPointer": {
+      "lineStyle": {
+        "color": "#eeeeee",
+        "width": "1"
+      },
+      "crossStyle": {
+        "color": "#eeeeee",
+        "width": "1"
+      }
+    }
+  },
+  "timeline": {
+    "lineStyle": {
+      "color": "#eeeeee",
+      "width": 1
+    },
+    "itemStyle": {
+      "color": "#dd6b66",
+      "borderWidth": 1
+    },
+    "controlStyle": {
+      "color": "#eeeeee",
+      "borderColor": "#eeeeee",
+      "borderWidth": 0.5
+    },
+    "checkpointStyle": {
+      "color": "#e43c59",
+      "borderColor": "#c23531"
+    },
+    "label": {
+      "color": "#eeeeee"
+    },
+    "emphasis": {
+      "itemStyle": {
+        "color": "#a9334c"
+      },
+      "controlStyle": {
+        "color": "#eeeeee",
+        "borderColor": "#eeeeee",
+        "borderWidth": 0.5
+      },
+      "label": {
+        "color": "#eeeeee"
+      }
+    }
+  },
+  "visualMap": {
+    "color": [
+      "#bf444c",
+      "#d88273",
+      "#f6efa6"
+    ]
+  },
+  "dataZoom": {
+    "backgroundColor": "rgba(47,69,84,0)",
+    "dataBackgroundColor": "rgba(255,255,255,0.3)",
+    "fillerColor": "rgba(167,183,204,0.4)",
+    "handleColor": "#a7b7cc",
+    "handleSize": "100%",
+    "textStyle": {
+      "color": "#eeeeee"
+    }
+  },
+  "markPoint": {
+    "label": {
+      "color": "#cccccc"
+    },
+    "emphasis": {
+      "label": {
+        "color": "#cccccc"
+      }
+    }
+  }
+}

package/config/theme/chart.light.js

@@ -0,0 +1,3 @@
+import theme from './CWTheme';
+
+export default theme;

package/config/theme/common.less

@@ -0,0 +1,161 @@
+// 通用
+@border-radius-base: 2px;
+@border-radius-sm: 2px;
+@vertical-margin: 3px; // 组件上下基础间距
+@font-size-base: 12px; // 基础字号
+@font-size-lg:16px; // 大号字体
+@btn-font-size-lg:14px;
+// 基础布局
+@layout-sider-shadow: none; // 布局左侧阴影
+@layout-header-height: 48px; // 头部高度
+// 按钮
+@btn-font-size-lg:14px; // 大尺寸按钮字体大小
+@btn-shadow: none;
+@btn-text-shadow: none;
+@btn-height-base: 28px; //默认按钮高度
+@btn-padding-lg: 0 15px; //大尺寸按钮内间距
+@btn-padding-base: 0 11px; //默认按钮内间距
+@btn-primary-shadow: none;
+@btn-padding-main: 0 23px;
+
+// 菜单
+@menu-split-border-color: transparent; // 菜单分割线颜色
+@menu-icon-size: 16px; // 连同字体
+@menu-item-font-size: 14px; 
+@menu-item-boundary-margin: 0;
+@menu-collapsed-width: 40px;
+@menu-wrapper-padding: 4px 7px 8px 8px;
+@menu-item-border-radius: 4px;
+@menu-item-paddding-left: 8px;
+@menu-item-margin: 4px 0 0 0;
+@menu-arrow-right: 8px;
+// 提示框
+@tooltip-arrow-width:8.5px;
+@tooltip-distance: 6px;
+
+// 下拉菜单
+@dropdown-edge-child-vertical-padding: 4px; // 下拉菜单上下padding
+@control-padding-horizontal: 10px; // 下拉菜item左右padding
+@dropdown-line-height: 20px; // 下拉菜item行高
+
+// 抽屉
+@drawer-header-padding: 0 24px; // UI规范
+
+// input
+@input-height-base: 28px; // 输入框高度
+@input-padding-horizontal-base: 9px; // 输入框水平方向padding
+@input-padding-vertical-base: 3px; // 输入框垂直方向padding
+@input-padding-vertical-lg: 8px;
+@input-padding-horizontal-lg: 11px;
+// @input-addon-bg:@component-background;
+
+// Form
+@form-item-margin-bottom: 24px; // form item下边距
+@form-component-max-height: @input-height-base;
+@form-vertical-label-padding: 0 0 4px;
+@form-explain-precision:0; // 帮助文本中间计算处理值原先为1px
+@form-explain-height:20px; // 帮助文本高度
+@form-help-margin-top:4px; // 帮助文本上间距
+// 分页
+@pagination-item-size: 28px; // 分页大小
+
+// Tabs
+@tabs-horizontal-padding: 10px 0px;
+@tabs-horizontal-padding-lg: 15px 0px;
+@tabs-title-font-size: 14px;
+@tabs-title-font-size-lg: 14px; // 大号、小号字体大小均为14px
+@tabs-card-horizontal-padding: 8px 15px;
+// Switch
+@switch-height: 20px;
+
+// 徽标数
+@badge-dot-size: 4px;
+@badge-status-size: 8px;
+
+// 表格
+@table-padding-vertical: 12px;
+@table-padding-horizontal: 12px;
+
+// Popover
+@popover-min-width: 180px;
+
+// Radio
+@radio-default-width: 298px; // 容器默认宽度
+@radio-default-height: 124px; // 容器默认高度
+@radio-padding-level: 23px; // 容器水平内间距
+@radio-padding-vertical: 15px; // 容器垂直内间距
+@radio-margin-right: 16px; // 容器的右边距
+@radio-margin-bottom: 12px; // 容器的下边距
+@radio-icon-width: 48px; // icon存放位置宽度
+@radio-icon-height: 48px; // icon存放位置高度
+@radio-icon-padding-right: 16px; // icon与内容区域间距
+@radio-title-fontSize: 16px; // 内容标题部分字体大小
+@radio-title-height: 24px; // 内容标题部分高度与行高
+@radio-describe-fontSize: 12px; // 内容描述区字体大小
+@radio-describe-marginTop: 8px; // 内容描述区与标题垂直间距
+@radio-describe-lineHeight: 20px; // 内容描述区行高
+
+
+// Checkbox
+@checkbox-default-width: 242px; // 容器默认宽度
+@checkbox-default-height: 104px; // 容器默认高度
+@checkbox-yes-width: 24px; // 对勾宽高
+
+
+// message
+@message-wrapper-content-padding:-10px -16px; // 与父元素的padding间距相互抵消
+@message-wrapper-content-padding-vertical: 9px;   // 自定义父容器的默认垂直方向边距
+@message-wrapper-content-padding-level:16px;    // 自定义父容器的默认水平方向边距
+@message-wrapper-content-padding-bottom-hasDec: 12px;   // 自定义父容器当存在描述内容时的下边距
+@message-wrapper-max-width:400px; // 自定义父容器的最大宽度
+@message-wrapper-icon-width:16px;  // icon宽高
+@message-wrapper-img-x-width:8px;  // icon关闭按钮宽高
+@message-wrapper-title-fontSize:14px; // 标题字体大小
+@message-wrapper-title-lineHeight:22px; // 标题行高
+@message-wrapper-distance-x:16px;   // 距离关闭图标的距离
+@message-wrapper-dec-padding-left:@message-wrapper-content-padding-level + 8px; // 描述区域距离容器内边距的距离
+@message-wrapper-dec-padding-right:@message-wrapper-content-padding-level + @message-wrapper-distance-x; // 描述区域距离容器右侧的距离
+@message-wrapper-dec-fontSize:14px; // 描述字体大小
+@message-wrapper-dec-lineHeight:22px; // 描述行高
+@message-wrapper-dec-marginTop:6px; // 描述距离标题的间距
+
+
+// Slider
+@slider-margin:10px 8px;
+@slider-wrapper-rail-width:6px; // 轨道宽高
+@silder-wrapper-circle-width:18px; // 滑块宽高因为采用怪异盒子所有加上了边框宽度实际内容区16px
+@slider-wrapper-circle-inner-width:4px; // 滑块区域内部的图片宽度
+@slider-wrapper-circle-inner-height:6px;  // 滑块区域内部的图片高度
+@silder-wrapper-handle-level-margin-top:-6px; // 水平状态下滑块位置修正
+@slider-wrapper-mark-vertical-margin-left:-3px; // 垂直状态下mark刻度标记位置修正
+@slider-wrapper-handle-vertical-margin-left:-6px; // 垂直状态下滑块位置修正
+
+// breadcrumb
+// @breadcrumb-separator-margin: 0 10px;
+
+
+// collapse
+@collapse-header-padding-extra: 40px; // collapse header 左边距 默认40px
+@collapse-content-padding: 16px; // 内容区padding
+@collapse-header-padding:7px 16px; // collapse header 内间距
+
+// layoutWrapper
+@layout-footer-height: 52px;
+// @layout-header-height: 58px;
+@layout-wrapper-header-height: 58px;
+@layout-wrapper-basic-padding: 20px;
+
+// Steps
+@steps-icon-size: 24px; // UI新规范
+
+// AbreastLayout
+@abreast-layout-content-padding: 0 20px 0 16px; // 左右布局内容区域padding
+
+// CWMessage
+@cw-message-content-padding: 0 24px; // 公共消息组件内容区域padding
+
+
+@processing-color: @primary-color;
+
+// notification
+@zindex-notification: 950;