@qn-pandora/pandora-component 3.1.1 → 4.0.1

package/lib/style/theme.less

@@ -1,379 +1,389 @@
-@ant-prefix: ant;
-
-// classname前后缀变量=========================================================
-@sdk-prefix: pandora-sdk; // 多个使用
-
-// 基础颜色变量=========================================================
-// antd覆盖色
-@black: #000000; // phoenix antd
-// pandora色
-@gray-bg-color: #f4f5f7; // pandora-component pandora-visualization phoenix
-
-// 基础功能色变量=========================================================
-
-// 主题色------------------------
-// antd覆盖色
-@primary-color: #7a869a; // pandora-component antd phoenix
-@normal-color: #ffffff; // pandora-component antd 多 phoenix
-// pandora色
-@second-primary-color: #7a869b; // pandora-component 多
-@theme-color: #2c6dd2; // pandora-component 多 phoenix
-@theme-color-005: fade(
-  @theme-color,
-  5%
-); // pandora-component pandora-visualization phoenix
-@theme-color-008: fade(@theme-color, 8%);
-@theme-color-010: fade(@theme-color, 10%); // pandora-component 多 phoenix
-@theme-color-015: fade(@theme-color, 15%); // pandora-component 多 phoenix
-@theme-color-020: fade(
-  @theme-color,
-  20%
-); // pandora-component pandora-visualization phoenix
-@theme-color-060: fade(
-  @theme-color,
-  60%
-); // pandora-component pandora-visualization phoenix
-@theme-color-070: fade(@theme-color, 70%); // pandora-component 多 phoenix
-@theme-color-080: fade(
-  @theme-color,
-  80%
-); // pandora-component pandora-visualization phoenix
-@theme-color-030: fade(@theme-color, 30%); // 多个
-@theme-color-050: fade(@theme-color, 50%); // 多个
-@theme-color-090: fade(@theme-color, 90%); // 多个
-
-// 背景阴影色------------------------
-@transparent-bg: transparent; // phoenix
-@background-secondary: @normal-color; // phoenix
-@shadow-bg-color: rgba(0, 0, 0, 0.4); // phoenix
-// 深色主题
-@dark-background-color: #19202b; // 多个
-@dark-item-background-color: #2c2c31; // pandora-visualization
-
-// 字体------------------------
-// antd覆盖色
-@text-color: fade(#000, 65%); // 默认字体颜色 // pandora-component antd phoenix
-@font-size-base: 14px; // phoenix antd
-@text-color-secondary: fade(@black, 45%); // phoenix 跟antd一样
-// pandora色
-@font-color-1: #232c3b; // pandora-component 多 phoenix
-@font-color-2: #42526e; // pandora-component pandora-visualization phoenix
-@font-color-3: #7a869a; // pandora-component 多 phoenix
-@font-disable-color: #d9d9d9; // pandora-component 多 phoenix
-@font-disable-color-2: #bfbfbf;
-@font-color-4: #b3bac5; // 多个
-@font-color-5: #8d9199; // phoenix
-@font-color-6: #666;
-@font-color-9: #999;
-@font-color-7: #333;
-@secondary-font-color: #c1c7d0; // phoenix
-@disabled-text-color: #9eaec5; // pandora-visualization pheonix
-@log-font-family: 'Droid Sans Mono', 'Consolas', 'Monaco', 'Courier New',
-  Courier, monospace; // pandora-app-component phoenix
-
-// 布局------------------------
-// antd覆盖色
-@body-background: @normal-color; // pandora-component antd pandora-app-component phoenix
-@component-background: @normal-color; // pandora-component antd phoenix
-// pandora色
-@content-color: #42526e; // pandora-component pandora-visualization phoenix
-@title-color: rgba(35, 44, 59, 1); // pandora-component phoenix
-@title-dark-color: #c1c7d0; // pandora-app-component!!!!!!!
-@heading-color: #333;
-@off-color: #ebecf0; // phoenix
-
-// 提示------------------------
-// antd覆盖色
-@error-color: #f5222d; // pandora-component antd 多 phoenix
-@warning-color: #f0a818; // pandora-component antd phoenix
-@success-color: #20c997; // pandora-component antd pandora-visualization phoenix
-@highlight-color: @warning-color; // phoenix antd
-// pandora色
-@delete-color: #ff6b6b; // pandora-component 多 phoenix
-@delete-color-030: rgba(255, 107, 107, 0.3); // phoenix
-@delete-color-010: rgba(255, 107, 107, 0.1); // pandora-app-component phoenix
-@font-warning-color: #faad14; // phoenix
-
-// 边框------------------------
-// antd覆盖色
-@border-color-base: #e5e5e5; // pandora-component antd 多 phoenix
-@border-radius-base: 2px; // antd
-@border-radius-sm: 2px; // antd
-@border-color-split: @border-color-base; // antd
-// pandora色
-@border-color-normal: #e5e5e5;
-@border-color-1: #d9d9d9;
-@modal-header-border-color: rgba(0, 0, 0, 0.09);
-
-// icon------------------------
-// antd覆盖色
-@icon-color: #bfbfbf; // pandora-component antd 多 phoenix
-// pandora色
-@icon-color-2: rgba(
-  66,
-  82,
-  110,
-  1
-); // pandora-component pandora-visualization phoenix
-
-// z-index------------------------
-// antd覆盖色
-@zindex-modal: 1200; // pandora-app-component phoenix antd
-@zindex-modal-mask: 1200; // antd
-@zindex-popover: 1200; // antd
-@zindex-tooltip: 1300; // antd
-// pandora色
-@zindex-layout-navbar: 1100; // phoenix
-@zindex-layout-sidebar: 1000; // phoenix
-@zindex-toaster: 3000; // app-platform phoenix
-
-// 组件色变量=========================================================
-
-// Common Button------------------------
-// antd覆盖色
-@btn-primary-color: @normal-color; // antd
-@btn-primary-bg: @theme-color; // antd
-@btn-default-color: rgba(0, 0, 0, 0.65); // antd
-@btn-default-bg: @body-background; // antd
-@btn-disable-color: rgb(238, 238, 238); // antd
-@btn-disable-bg: @theme-color-070; // antd
-// pandora色
-@button-disabled-bg: #eee; // pandora-component pandora-visualization phoenix
-@button-disabled-color: #bfbfbf; // pandora-component pandora-visualization phoenix
-@button-disabled-border-color: #eee; // pandora-component pandora-visualization phoenix
-@button-default-bg: @normal-color; // pandora-component pandora-visualization phoenix
-@button-default-color: rgba(
-  0,
-  0,
-  0,
-  0.65
-); // pandora-component pandora-visualization phoenix
-@button-default-border-color: @input-border-color; // pandora-component pandora-visualization phoenix
-@button-default-hover-bg: @table-thead-bg; // pandora-component pandora-visualization phoenix
-@button-default-hover-color: @theme-color; // pandora-component pandora-visualization phoenix
-@button-default-hover-border-color: @input-border-color; // pandora-component pandora-visualization phoenix
-@button-primary-bg: @theme-color; // pandora-component pandora-visualization phoenix
-@button-primary-color: @normal-color; // pandora-component pandora-visualization phoenix
-@button-primary-border-color: @theme-color; // pandora-component pandora-visualization phoenix
-@button-primary-hover-bg: @theme-color-080; // pandora-component pandora-visualization phoenix
-@button-primary-hover-color: @normal-color; // pandora-component pandora-visualization phoenix
-@button-primary-hover-border-color: @theme-color-080; // pandora-component pandora-visualization phoenix
-@button-ghost-bg: transparent; // pandora-component pandora-visualization phoenix
-@button-ghost-color: @theme-color; // pandora-component pandora-visualization phoenix
-@button-ghost-border-color: @theme-color; // pandora-component pandora-visualization phoenix
-@button-ghost-hover-bg: @theme-color; // pandora-component pandora-visualization phoenix
-@button-ghost-hover-color: @normal-color; // pandora-component pandora-visualization phoenix
-@button-ghost-hover-border-color: @theme-color; // pandora-component pandora-visualization phoenix
-@btn-cancel-color: @theme-color; // pandora-component 多 phoenix
-@btn-cancel-bg: #e9f0fa; // pandora-component 多 phoenix
-
-// Input和label------------------------
-// antd覆盖色
-@input-placeholder-color: #bfbfbf; // pandora-component antd 多 phoenix
-@input-border-color: #bfbfbf; // pandora-component antd
-@input-height-base: 32px; // phoenix antd
-@input-height-lg: 40px; // antd
-@input-height-sm: 26px; // antd
-@input-padding-vertical-base: 4px;
-@input-bg: transparent; // 多个 antd
-@input-disabled-bg: #f5f5f5; // antd
-@input-disabled-border-color: #d9d9d9; // pandora-app-component
-@input-color: #333333; // antd
-@input-hover-border-color: @theme-color; // 本文件 antd
-// pandora色
-@input-error-color: fade(@delete-color, 15); // phoenix
-@input-light-bg: #c1c7d0; // pandora-app-component
-@input-dark-bg: rgba(44, 109, 210, 0.1); // pandora-app-component
-@label-dark-bg: rgba(44, 109, 210, 0.3); // pandora-app-component
-
-// Select------------------------
-// antd覆盖色
-@select-border-color: @input-border-color; // antd
-// pandora色
-@select-bg: @input-bg; // pandora-component pandora-visualization phoenix
-@select-popover-hover-color: @theme-color-005; // pandora-component pandora-visualization phoenix
-@select-item-selected-bg: @select-popover-hover-color;
-@select-item-active-bg: @select-popover-hover-color;
-@select-dropdown-line-height: 24px;
-@item-hover-bg: @select-popover-hover-color;
-@select-dropdown-edge-child-vertical-padding: 4px;
-@select-selection-bg: #f5f5f5;
-
-// Table------------------------
-// antd覆盖色
-// TODO: 暂时写死，后续通过函数计算@theme-color-010得到
-@table-row-hover-bg: #e9f0fa;
-@table-selected-row-bg: @theme-color; // antd
-@table-padding-vertical: 14px; // antd
-@table-padding-horizontal: 12px; // antd
-// pandora色
-@table-row-odd-bg: @normal-color; // pandora-component phoenix
-@table-row-even-bg: #fafafa; // pandora-component phoenix
-@table-thead-color: #333; // pandora-component phoenix
-@table-thead-bg: #fafafa; // pandora-component
-@table-link-color: @theme-color; // pandora-component phoenix
-@table-border-color: rgba(235, 236, 240, 1); // phoenix
-@table-search-icon-color: #bfbfbf; // phoenix
-@table-sorter-icon-color: #bfbfbf; // phoenix
-
-// Tabs------------------------
-@tabs-ink-bar-color: @theme-color;
-@tabs-highlight-color: @theme-color;
-@tabs-hover-color: @theme-color;
-@tabs-active-color: @theme-color;
-
-// Tag------------------------
-// antd覆盖色
-// pandora色
-@tag-green: @success-color; // pandora-component phoenix
-@tag-primary: @theme-color; // pandora-component phoenix
-@tag-yellow: @warning-color; // pandora-component phoenix
-@tag-blue: #03a9f4; // pandora-component phoenix
-@tag-grey: #ebecf0; // pandora-component phoenix
-@tag-bg-primary-color: @success-color; // phoenix
-
-//移动端绝对时间选择组件------------------------
-// antd覆盖色
-// pandora色
-@time-absolute-sub-title: rgba(235, 236, 240, 1); // pandora-component
-@time-absolute-am-picker-col-indicator: rgba(
-  235,
-  236,
-  240,
-  0.5
-); // pandora-component
-@time-absolute-picker-title-div: #939393; // pandora-component
-
-// sidebar------------------------
-@layout-sidebar-width: 240px; // phoenix
-@layout-sidebar-collapsed-width: 0px; // phoenix
-@layout-navbar-height: 52px; // phoenix
-@layout-navbar-sub-height: 56px; // phoenix
-// 深色主题
-@side-bar-active-color: #6ac73c; // pandora-visualization
-
-// Tooltip------------------------
-// antd覆盖色
-@tooltip-bg: fade(@font-color-1, 80); // antd
-@tooltip-color: @normal-color; // 跟antd一样
-@tooltip-arrow-color: @tooltip-bg; // antd
-// pandora色
-@tooltip-shadow-color-1: rgba(35, 44, 59, 0.2); // phoenix
-
-// toaster // pheonix app-platform均有一份toaster组件，其实都差不多的------------------------
-// antd覆盖色
-// pandora色
-@toaster-error-bg: rgba(250, 100, 100, 0.8);
-@toaster-success-bg: rgba(32, 201, 151, 0.8);
-@toaster-warning-bg: rgba(252, 196, 25, 0.8);
-@toaster-info-bg: @theme-color-080;
-@toaster-error-shadow: rgba(255, 107, 107, 0.3);
-@toaster-success-shadow: rgba(32, 201, 151, 0.3);
-@toaster-warning-shadow: rgba(252, 196, 25, 0.3);
-@toaster-info-shadow: rgba(44, 109, 210, 0.3);
-
-// tree------------------------
-// antd覆盖色
-@tree-title-height: 24px; // antd
-@tree-child-padding: 8px; // antd
-@tree-node-hover-bg: @theme-color-005; // pheonix antd
-@tree-node-selected-bg: @theme-color-005; // pheonix antd
-// pandora色
-@tree-node-hover-color: @theme-color; // pheonix
-@tree-node-selected-color: @theme-color; // pheonix
-
-// pagination------------------------
-// antd覆盖色
-@pagination-item-size: 32px; // 跟antd一样
-// pandora色
-@pagination-item-text-color: @font-color-6;
-@pagination-item-border-color: @border-color-1;
-
-// form------------------------
-// antd覆盖色
-@form-item-margin-bottom: 20px; // antd
-// pandora色
-
-// outline------------------------
-// antd覆盖色
-@outline-color: @input-hover-border-color; // antd
-// pandora色
-
-// Slider // antd------------------------
-// antd覆盖色
-@slider-rail-background-color: @input-bg; // antd
-@slider-rail-background-color-hover: @input-bg; // antd
-@slider-track-background-color: @theme-color-090; // antd
-@slider-track-background-color-hover: @theme-color;
-@slider-handle-color: @theme-color-090;
-@slider-handle-color-hover: @theme-color;
-@slider-handle-color-focus: @theme-color;
-@slider-handle-color-focus-shadow: @theme-color;
-@slider-handle-color-tooltip-open: @theme-color;
-// pandora色
-
-// Card------------------------
-@card-padding-base: 20px;
-@card-radius: 2px;
-
-// Checkbox-------------------------------------------
-// antd覆盖色
-@checkbox-color: @theme-color; // antd
-@checkbox-check-color: #fff; // antd
-// pandora色
-
-// Breadcrumb-------------------------------------------
-// antd覆盖色
-@breadcrumb-font-size: 16px;
-@breadcrumb-icon-font-size: @breadcrumb-font-size;
-@breadcrumb-base-color: #999999; // antd
-@breadcrumb-last-item-color: rgba(0, 0, 0, 0.85); // antd
-@breadcrumb-link-color: @breadcrumb-base-color; // antd
-@breadcrumb-link-color-hover: @breadcrumb-base-color; // antd
-// pandora色
-
-// LINK-------------------------------------------
-// antd覆盖色
-@link-color: @primary-color; // antd
-@link-hover-color: @theme-color; // antd
-@link-active-color: @theme-color; // phoenix antd
-@link-decoration: none; // antd
-@link-hover-decoration: none; // antd
-// pandora色
-
-// Menu-------------------------------------------
-// antd覆盖色
-@menu-inline-toplevel-item-height: 32px; // antd
-@menu-item-height: 32px; // antd
-@menu-collapsed-width: 100px; // antd
-@menu-bg: @component-background; // antd
-@menu-item-color: @font-color-3; // antd
-@menu-highlight-color: @theme-color; // antd
-@menu-item-active-bg: rgba(255, 255, 255, 0.1); // antd
-@menu-item-group-title-color: @icon-color; // antd
-@menu-item-hover-bg: #ccd3d9; // phoenix
-// pandora色
-@menu-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
-// dark theme
-@menu-dark-color: @normal-color; // antd
-@menu-dark-bg: @theme-color; // phoenix antd
-@menu-dark-arrow-color: @normal-color; // antd
-@menu-dark-submenu-bg: #2967c7; // antd
-@menu-dark-highlight-color: @normal-color; // antd
-@menu-dark-item-active-bg: rgba(255, 255, 255, 0.1); // phoenix antd
-
-.@{ant-prefix}-btn {
-  padding: 4px 15px;
-}
-.@{ant-prefix}-btn-sm {
-  padding: 0 7px;
-}
-
-@icon-hover-color: rgba(19, 107, 255, 0.1);
-
-// radio--------------
-// antd覆盖色
-@radio-dot-color: @theme-color;
-@radio-button-color: @heading-color;
-@radio-button-active-color: @theme-color;
-@radio-button-hover-color: @theme-color;
+@ant-prefix: ant;
+
+@root-entry-name: 'default';
+
+// classname前后缀变量=========================================================
+@sdk-prefix: pandora-sdk; // 多个使用
+
+// 基础颜色变量=========================================================
+// antd覆盖色
+@black: #000000; // phoenix antd
+// pandora色
+@gray-bg-color: #f4f5f7; // pandora-component pandora-visualization phoenix
+
+// 基础功能色变量=========================================================
+
+// 主题色------------------------
+// antd覆盖色
+@primary-color: #7a869a; // pandora-component antd phoenix
+@normal-color: #ffffff; // pandora-component antd 多 phoenix
+// pandora色
+@second-primary-color: #7a869b; // pandora-component 多
+@theme-color: #2c6dd2; // pandora-component 多 phoenix
+@theme-color-005: fade(
+  @theme-color,
+  5%
+); // pandora-component pandora-visualization phoenix
+@theme-color-008: fade(@theme-color, 8%);
+@theme-color-010: fade(@theme-color, 10%); // pandora-component 多 phoenix
+@theme-color-015: fade(@theme-color, 15%); // pandora-component 多 phoenix
+@theme-color-020: fade(
+  @theme-color,
+  20%
+); // pandora-component pandora-visualization phoenix
+@theme-color-060: fade(
+  @theme-color,
+  60%
+); // pandora-component pandora-visualization phoenix
+@theme-color-070: fade(@theme-color, 70%); // pandora-component 多 phoenix
+@theme-color-080: fade(
+  @theme-color,
+  80%
+); // pandora-component pandora-visualization phoenix
+@theme-color-030: fade(@theme-color, 30%); // 多个
+@theme-color-050: fade(@theme-color, 50%); // 多个
+@theme-color-090: fade(@theme-color, 90%); // 多个
+
+// hover时背景颜色
+@hover-bg: #f3f7fd;
+
+// 背景阴影色------------------------
+@transparent-bg: transparent; // phoenix
+@background-secondary: @normal-color; // phoenix
+@shadow-bg-color: rgba(0, 0, 0, 0.4); // phoenix
+@shadow-bg-color-light: rgba(51, 51, 51, 0.08); // phoenix
+// 深色主题
+@dark-background-color: #19202b; // 多个
+@dark-item-background-color: #2c2c31; // pandora-visualization
+
+// 字体------------------------
+// antd覆盖色
+@text-color: fade(#000, 65%); // 默认字体颜色 // pandora-component antd phoenix
+@font-size-base: 14px; // phoenix antd
+@text-color-secondary: fade(@black, 45%); // phoenix 跟antd一样
+// pandora色
+@font-color-1: #232c3b; // pandora-component 多 phoenix
+@font-color-2: #42526e; // pandora-component pandora-visualization phoenix
+@font-color-3: #7a869a; // pandora-component 多 phoenix
+@font-disable-color: #d9d9d9; // pandora-component 多 phoenix
+@font-disable-color-2: #bfbfbf;
+@font-color-4: #b3bac5; // 多个
+@font-color-5: #8d9199; // phoenix
+@font-color-6: #666;
+@font-color-9: #999;
+@font-color-7: #333;
+@secondary-font-color: #c1c7d0; // phoenix
+@disabled-text-color: #9eaec5; // pandora-visualization pheonix
+@log-font-family: 'Droid Sans Mono', 'Consolas', 'Monaco', 'Courier New',
+  Courier, monospace; // pandora-app-component phoenix
+
+// 布局------------------------
+// antd覆盖色
+@body-background: @normal-color; // pandora-component antd pandora-app-component phoenix
+@component-background: @normal-color; // pandora-component antd phoenix
+// pandora色
+@content-color: #42526e; // pandora-component pandora-visualization phoenix
+@title-color: rgba(35, 44, 59, 1); // pandora-component phoenix
+@title-dark-color: #c1c7d0; // pandora-app-component!!!!!!!
+@heading-color: #333;
+@off-color: #ebecf0; // phoenix
+
+// 提示------------------------
+// antd覆盖色
+@error-color: #f5222d; // pandora-component antd 多 phoenix
+@warning-color: #f0a818; // pandora-component antd phoenix
+@success-color: #20c997; // pandora-component antd pandora-visualization phoenix
+@highlight-color: @warning-color; // phoenix antd
+// pandora色
+@delete-color: #ff6b6b; // pandora-component 多 phoenix
+@delete-color-030: rgba(255, 107, 107, 0.3); // phoenix
+@delete-color-010: rgba(255, 107, 107, 0.1); // pandora-app-component phoenix
+@font-warning-color: #faad14; // phoenix
+
+// 边框------------------------
+// antd覆盖色
+@border-color-base: #e5e5e5; // pandora-component antd 多 phoenix
+@border-radius-base: 2px; // antd
+@border-radius-sm: 2px; // antd
+@border-color-split: @border-color-base; // antd
+// pandora色
+@border-color-normal: #e5e5e5;
+@border-color-1: #d9d9d9;
+@modal-header-border-color: rgba(0, 0, 0, 0.09);
+
+// icon------------------------
+// antd覆盖色
+@icon-color: #bfbfbf; // pandora-component antd 多 phoenix
+// pandora色
+@icon-color-2: rgba(
+  66,
+  82,
+  110,
+  1
+); // pandora-component pandora-visualization phoenix
+
+// z-index------------------------
+// antd覆盖色
+@zindex-modal: 1200; // pandora-app-component phoenix antd
+@zindex-modal-mask: 1200; // antd
+@zindex-popover: 1200; // antd
+@zindex-tooltip: 1300; // antd
+// pandora色
+@zindex-layout-navbar: 1100; // phoenix
+@zindex-layout-sidebar: 1000; // phoenix
+@zindex-toaster: 3000; // app-platform phoenix
+
+// 组件色变量=========================================================
+
+// Common Button------------------------
+// antd覆盖色
+@btn-primary-color: @normal-color; // antd
+@btn-primary-bg: @theme-color; // antd
+@btn-default-color: rgba(0, 0, 0, 0.65); // antd
+@btn-default-bg: @body-background; // antd
+@btn-disable-color: rgb(238, 238, 238); // antd
+@btn-disable-bg: @theme-color-070; // antd
+// pandora色
+@button-disabled-bg: #eee; // pandora-component pandora-visualization phoenix
+@button-disabled-color: #bfbfbf; // pandora-component pandora-visualization phoenix
+@button-disabled-border-color: #eee; // pandora-component pandora-visualization phoenix
+@button-default-bg: @normal-color; // pandora-component pandora-visualization phoenix
+@button-default-color: rgba(
+  0,
+  0,
+  0,
+  0.65
+); // pandora-component pandora-visualization phoenix
+@button-default-border-color: @input-border-color; // pandora-component pandora-visualization phoenix
+@button-default-hover-bg: @table-thead-bg; // pandora-component pandora-visualization phoenix
+@button-default-hover-color: @theme-color; // pandora-component pandora-visualization phoenix
+@button-default-hover-border-color: @input-border-color; // pandora-component pandora-visualization phoenix
+@button-primary-bg: @theme-color; // pandora-component pandora-visualization phoenix
+@button-primary-color: @normal-color; // pandora-component pandora-visualization phoenix
+@button-primary-border-color: @theme-color; // pandora-component pandora-visualization phoenix
+@button-primary-hover-bg: @theme-color-080; // pandora-component pandora-visualization phoenix
+@button-primary-hover-color: @normal-color; // pandora-component pandora-visualization phoenix
+@button-primary-hover-border-color: @theme-color-080; // pandora-component pandora-visualization phoenix
+@button-ghost-bg: transparent; // pandora-component pandora-visualization phoenix
+@button-ghost-color: @theme-color; // pandora-component pandora-visualization phoenix
+@button-ghost-border-color: @theme-color; // pandora-component pandora-visualization phoenix
+@button-ghost-hover-bg: @theme-color; // pandora-component pandora-visualization phoenix
+@button-ghost-hover-color: @normal-color; // pandora-component pandora-visualization phoenix
+@button-ghost-hover-border-color: @theme-color; // pandora-component pandora-visualization phoenix
+@btn-cancel-color: @theme-color; // pandora-component 多 phoenix
+@btn-cancel-bg: #e9f0fa; // pandora-component 多 phoenix
+
+// Input和label------------------------
+// antd覆盖色
+@input-placeholder-color: #bfbfbf; // pandora-component antd 多 phoenix
+@input-border-color: #bfbfbf; // pandora-component antd
+@input-height-base: 32px; // phoenix antd
+@input-height-lg: 40px; // antd
+@input-height-sm: 26px; // antd
+@input-padding-vertical-base: 4px;
+@input-bg: transparent; // 多个 antd
+@input-disabled-bg: #f5f5f5; // antd
+@input-disabled-border-color: #d9d9d9; // pandora-app-component
+@input-color: #333333; // antd
+@input-hover-border-color: @theme-color; // 本文件 antd
+// pandora色
+@input-error-color: fade(@delete-color, 15); // phoenix
+@input-light-bg: #c1c7d0; // pandora-app-component
+@input-dark-bg: rgba(44, 109, 210, 0.1); // pandora-app-component
+@label-dark-bg: rgba(44, 109, 210, 0.3); // pandora-app-component
+
+// Select------------------------
+// antd覆盖色
+@select-border-color: @input-border-color; // antd
+// pandora色
+@select-bg: @input-bg; // pandora-component pandora-visualization phoenix
+@select-popover-hover-color: @theme-color-005; // pandora-component pandora-visualization phoenix
+@select-item-selected-bg: @select-popover-hover-color;
+@select-item-active-bg: @select-popover-hover-color;
+@select-dropdown-line-height: 24px;
+@item-hover-bg: @select-popover-hover-color;
+@select-dropdown-edge-child-vertical-padding: 4px;
+@select-selection-bg: #f5f5f5;
+
+// Table------------------------
+// antd覆盖色
+// TODO: 暂时写死，后续通过函数计算@theme-color-010得到
+@table-row-hover-bg: @hover-bg;
+@table-selected-row-bg: @theme-color; // antd
+@table-padding-vertical: 14px; // antd
+@table-padding-horizontal: 12px; // antd
+// pandora色
+@table-row-odd-bg: @normal-color; // pandora-component phoenix
+@table-row-even-bg: #fafafa; // pandora-component phoenix
+@table-thead-color: #333; // pandora-component phoenix
+@table-thead-bg: #fafafa; // pandora-component
+@table-link-color: @theme-color; // pandora-component phoenix
+@table-border-color: rgba(235, 236, 240, 1); // phoenix
+@table-search-icon-color: #bfbfbf; // phoenix
+@table-sorter-icon-color: #bfbfbf; // phoenix
+
+// Tabs------------------------
+@tabs-ink-bar-color: @theme-color;
+@tabs-highlight-color: @theme-color;
+@tabs-hover-color: @theme-color;
+@tabs-active-color: @theme-color;
+
+// Tag------------------------
+// antd覆盖色
+// pandora色
+@tag-green: @success-color; // pandora-component phoenix
+@tag-primary: @theme-color; // pandora-component phoenix
+@tag-yellow: @warning-color; // pandora-component phoenix
+@tag-blue: #03a9f4; // pandora-component phoenix
+@tag-grey: #ebecf0; // pandora-component phoenix
+@tag-bg-primary-color: @success-color; // phoenix
+
+//移动端绝对时间选择组件------------------------
+// antd覆盖色
+// pandora色
+@time-absolute-sub-title: rgba(235, 236, 240, 1); // pandora-component
+@time-absolute-am-picker-col-indicator: rgba(
+  235,
+  236,
+  240,
+  0.5
+); // pandora-component
+@time-absolute-picker-title-div: #939393; // pandora-component
+
+// sidebar------------------------
+@layout-sidebar-width: 240px; // phoenix
+@layout-sidebar-collapsed-width: 0px; // phoenix
+@layout-navbar-height: 52px; // phoenix
+@layout-navbar-sub-height: 56px; // phoenix
+// 深色主题
+@side-bar-active-color: #6ac73c; // pandora-visualization
+
+// Tooltip------------------------
+// antd覆盖色
+@tooltip-bg: fade(@font-color-1, 80); // antd
+@tooltip-color: @normal-color; // 跟antd一样
+@tooltip-arrow-color: @tooltip-bg; // antd
+// pandora色
+@tooltip-shadow-color-1: rgba(35, 44, 59, 0.2); // phoenix
+
+// toaster // pheonix app-platform均有一份toaster组件，其实都差不多的------------------------
+// antd覆盖色
+// pandora色
+@toaster-error-bg: rgba(250, 100, 100, 0.8);
+@toaster-success-bg: rgba(32, 201, 151, 0.8);
+@toaster-warning-bg: rgba(252, 196, 25, 0.8);
+@toaster-info-bg: @theme-color-080;
+@toaster-error-shadow: rgba(255, 107, 107, 0.3);
+@toaster-success-shadow: rgba(32, 201, 151, 0.3);
+@toaster-warning-shadow: rgba(252, 196, 25, 0.3);
+@toaster-info-shadow: rgba(44, 109, 210, 0.3);
+
+// tree------------------------
+// antd覆盖色
+@tree-title-height: 24px; // antd
+@tree-child-padding: 8px; // antd
+@tree-node-hover-bg: @theme-color-005; // pheonix antd
+@tree-node-selected-bg: @theme-color-005; // pheonix antd
+// pandora色
+@tree-node-hover-color: @theme-color; // pheonix
+@tree-node-selected-color: @theme-color; // pheonix
+
+// pagination------------------------
+// antd覆盖色
+@pagination-item-size: 32px; // 跟antd一样
+// pandora色
+@pagination-item-text-color: @font-color-6;
+@pagination-item-border-color: @border-color-1;
+
+// form------------------------
+// antd覆盖色
+@form-item-margin-bottom: 20px; // antd
+// pandora色
+
+// outline------------------------
+// antd覆盖色
+@outline-color: @input-hover-border-color; // antd
+// pandora色
+
+// Slider // antd------------------------
+// antd覆盖色
+@slider-rail-background-color: @input-bg; // antd
+@slider-rail-background-color-hover: @input-bg; // antd
+@slider-track-background-color: @theme-color-090; // antd
+@slider-track-background-color-hover: @theme-color;
+@slider-handle-color: @theme-color-090;
+@slider-handle-color-hover: @theme-color;
+@slider-handle-color-focus: @theme-color;
+@slider-handle-color-focus-shadow: @theme-color;
+@slider-handle-color-tooltip-open: @theme-color;
+// pandora色
+
+// Card------------------------
+@card-padding-base: 20px;
+@card-radius: 2px;
+
+// Checkbox-------------------------------------------
+// antd覆盖色
+@checkbox-color: @theme-color; // antd
+@checkbox-check-color: #fff; // antd
+// pandora色
+
+// Breadcrumb-------------------------------------------
+// antd覆盖色
+@breadcrumb-font-size: 16px;
+@breadcrumb-icon-font-size: @breadcrumb-font-size;
+@breadcrumb-base-color: #999999; // antd
+@breadcrumb-last-item-color: rgba(0, 0, 0, 0.85); // antd
+@breadcrumb-link-color: @breadcrumb-base-color; // antd
+@breadcrumb-link-color-hover: @breadcrumb-base-color; // antd
+// pandora色
+
+// LINK-------------------------------------------
+// antd覆盖色
+@link-color: @primary-color; // antd
+@link-hover-color: @theme-color; // antd
+@link-active-color: @theme-color; // phoenix antd
+@link-decoration: none; // antd
+@link-hover-decoration: none; // antd
+// pandora色
+
+// Menu-------------------------------------------
+// antd覆盖色
+@menu-inline-toplevel-item-height: 32px; // antd
+@menu-item-height: 32px; // antd
+@menu-collapsed-width: 100px; // antd
+@menu-bg: @component-background; // antd
+@menu-item-color: @font-color-3; // antd
+@menu-highlight-color: @theme-color; // antd
+@menu-item-active-bg: rgba(255, 255, 255, 0.1); // antd
+@menu-item-group-title-color: @icon-color; // antd
+@menu-item-hover-bg: #ccd3d9; // phoenix
+// pandora色
+@menu-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+// dark theme
+@menu-dark-color: @normal-color; // antd
+@menu-dark-bg: @theme-color; // phoenix antd
+@menu-dark-arrow-color: @normal-color; // antd
+@menu-dark-submenu-bg: #2967c7; // antd
+@menu-dark-highlight-color: @normal-color; // antd
+@menu-dark-item-active-bg: rgba(255, 255, 255, 0.1); // phoenix antd
+
+.@{ant-prefix}-btn {
+  padding: 4px 15px;
+}
+.@{ant-prefix}-btn-sm {
+  padding: 0 7px;
+}
+
+@icon-hover-color: rgba(19, 107, 255, 0.1);
+
+// radio--------------
+// antd覆盖色
+@radio-dot-color: @theme-color;
+@radio-button-color: @heading-color;
+@radio-button-active-color: @theme-color;
+@radio-button-hover-color: @theme-color;
+
+@editor-nav-background-color: #f5f5f5;
+@editor_nav_border_color: #d8d8d8;
+@editor_nav_line_color: #fcce72;