sdc-workflow-designer-ui/src/app/paletx/assets/themes/default/theme.less

   1 //-------------------common start------------------------
   2 // -------- Colors start-----------
   3 //配置说明：通常primary-color和primary-color-guide相同，某些产品需要有特别引导用户操作的按钮时，可以单独定义primary-color-guide
   4 @primary-color: #00abff; //主色，用于重点按钮底色，普通按钮文字色、tab页的选中横条色、进度条色、分组标题竖线等， 应用开发需要关注搭配class plx-btn-primary t
   5 @guide-color: @primary-color; //引导色，搭配class plx-btn-guide
   6 @success-color: #73cf22; //搭配class plx-btn-success
   7 @warning-color: #f7c515; //搭配class plx-btn-warning
   8 @error-color: #ff5b55; //搭配class plx-btn-error
   9 @common-color: #fff; //搭配class plx-btn
  10 //Colors-hover
  11 @primary-color-hover: #009dea;
  12 @primary-color-guide-hover: @primary-color-hover;
  13 @success-color-hover: #65bf16;
  14 @warning-color-hover: #e5b717;
  15 @error-color-hover: #ee403a;
  16 @common-color-hover: #fff;
  17 @btn-common-color-text-hover: @primary-color;
  18 @btn-common-color-border-hover: @primary-color;
  19
  20 //colors-click
  21 @primary-color-click: #008fd5;
  22 @primary-color-guide-click: @primary-color-click;
  23 @success-color-click: #59af0c;
  24 @warning-color-click: #d4a606;
  25 @error-color-click: #e02a23;
  26 @common-color-click: #fff;
  27 @btn-common-color-text-click: @primary-color-click;
  28 @btn-common-color-border-click: @primary-color-click;
  29
  30 //opacity-disable
  31 @opacity-disable: 0.5;
  32 //text-color-scenes，在按钮或tab上的文字色
  33 @scene-textcolor: #fff; //用于有底色时的文字颜色，搭配class plx-btn-primary，plx-btn-*
  34 @common-textcolor: @primary-color; //用于普通按钮和链接上的文字颜色，应用关注搭配 class plx-btn
  35 //text color
  36 @text-color: #595959; //普通文字颜色，不需要专用class
  37 @title-text-color: #404040; //用于标题文字颜色
  38 @disabled-text-color: #bfbfbf; //用于禁用状态文字
  39 @light-text-color: #737373; //较浅色
  40 @unselected-text-color: #999; //用于未选中文字颜色、placeholder文字颜色
  41 @form-label:#737373;//用于表单标签颜色
  42 // Background color for `<body>`
  43 @body-bg: #fff;
  44 // Base background color for most components
  45 @component-bg: #fff;
  46 @hover-bg-color: #ebf6fd; //用于菜单 、列表项、树项、表格行的hover背景色
  47 @selected-bg-color: #f5f5f5; //用于菜单 、列表项、树项、表格行的选中背景色
  48 @input-bg-color-disabled: #f5f5f5; //用于输入框禁用状态背景色
  49 //边框
  50 @border-color-base: #d9d9d9; // base border outline a component 搭配class: plx-border
  51 @border-color-split: #e9e9e9; // split border inside a component 搭配class: plx-split
  52 //字体图标
  53 @fonticon-color: #999; //字体图标颜色，搭配class: plx-icon-*
  54 @fonticon-bg-color-hover: @hover-bg-color; //一般字体图标hover时背景色变化
  55 @fonticon-color-hover: @primary-color; //当字体图标本身有背景色的时候，使用图标颜色本身加深的hover颜色。
  56 // Shadow
  57 @shadow-color: rgba(0, 0, 0, .2); //阴影颜色，个别组件需要，无需搭配固定class
  58
  59 // -------- Colors end-------------
  60 // -------- font start-------------
  61 @font-family: "Helvetica Neue","PingFang SC",Tahoma,"Microsoft Yahei";
  62 @font-size-spacing:20px; //用于间距定义
  63 @font-size: 12px; //正文文字
  64 @font-size-title-level1: @font-size + 8px; //一级标题
  65 @font-size-title-level2: @font-size + 4px; //二级标题
  66 @font-size-title-group: @font-size + 2px; //分组标题
  67 // -------- font end---------------
  68 // -------- radius start-------------
  69 @radius: 3px; //圆角
  70 @radius-sm: 2px; //小按钮圆角，用于下拉多选框的已选项的圆角
  71 @radius-lg: 20px; //用于标签，搭配class:plx-tag
  72 // -------- radius start-------------
  73 //size
  74 //checkbos
  75 @checkbox-size: @font-size+2px; //复选框高度
  76 //btn
  77 @btn-height: 32px; //按钮高度
  78 @btn-height-sm: 28px; //小尺寸按钮，搭配class:plx-btn-sm
  79 @btn-height-xs: 24px; //加小尺寸按钮，搭配class:plx-btn-xs
  80 // Input
  81 @input-height: 32px; //输入框高度
  82 @input-height-sm: 28px; //小尺寸输入框，搭配class:plx-input-sm
  83 //iuiframecolor
  84 @iuiframe-head-bg-color: #2c3e50; //head背景色
  85 @iuiframe-sidebar-bg-color: #fff; //sidebar背景色
  86 @iuiframe-hor-menu-bg-color: #fff; //横向菜单背景色
  87 @iuiframe-head-bg-color-hover: #3d546b; //head菜单项hover背景色
  88 @iuiframe-sidebar-bg-color-hover: @hover-bg-color; //sidebar菜单项hover背景色
  89 @iuiframe-head-bg-color-active: #33495f; //head菜单项选中背景色
  90 @iuiframe-sidebar-bg-color-active: #f0f9fc; //sidebar一级菜单项选中背景色
  91 @iuiframe-head-font-color: #fff; //head菜单文字颜色
  92 @iuiframe-sidebar-font-color: @text-color; //sidebar文字颜色
  93 @iuiframe-sidebar-font-color-active: @primary-color; //sidebar选中文字颜色
  94 @iuiframe-hor-menu-font-color: @text-color; //横菜单文字颜色
  95 @iuiframe-hor-menu-font-color-hover: @primary-color; //横向菜单项hover文字颜色
  96 @iuiframe-hor-menu-font-color-active: @primary-color; //横菜单选中文字颜色
  97 @iuiframe-hor-menu-split-color: #e9e9e9; //横菜单分割线颜色
  98 @iuiframe-sidebar-split-color: #fff; //sidebar菜单分割线颜色
  99 @iuiframe-bg-color:#e9ecf3; //框架右侧的背景色
 100 @iuiframe-bg-img:none; //框架右侧的背景图
 101 //iframeColor
 102 @iframe-bg-color: #e9ecf3; //iframe背景色
 103 @iframe-bg-img: none; //iframe背景图片
 104
 105
 106 @import "../common.less";
 107 @import "./NIV-theme.less";