packages-theme/console-base-theme/doc/css/console-base.less

// generated by generate-code-css-vars.ts

// 仅做参考，且放在仓库里 IDE 可以有提示
:root {
  --cb-color-text-transparent: transparent;
  --cb-color-text-white: #fff;
  --cb-color-text-black: #000;
  --cb-color-text-inverse: #fff;
  --cb-color-text-brand: #ff6a00;
  --cb-color-text-brand-hover: #ff6a00;
  --cb-color-text-brand-active: #e50;
  --cb-color-text-accent: #0064c8;
  --cb-color-text-accent-hover: #0064c8;
  --cb-color-text-accent-active: #0050a0;
  --cb-color-text-primary: #333;
  --cb-color-text-secondary: #666;
  --cb-color-text-tertiary: #999;
  --cb-color-text-disabled: #c0c6cc;
  --cb-color-text-help: #888;
  --cb-color-text-info: #0064c8;
  --cb-color-text-success: #1e8e3e;
  --cb-color-text-warning: #ffc440;
  --cb-color-text-error: #d93026;
  --cb-color-text-danger: #c80000;
  --cb-color-text-emphasis: #ff6a00;
  --cb-color-text-code: #39f;
  --cb-color-bg-transparent: transparent;
  --cb-color-bg-white: #fff;
  --cb-color-bg-black: #000;
  --cb-color-bg-inverse: #000;
  --cb-color-bg-brand: #ff6a00;
  --cb-color-bg-brand-hover: #ff6a00;
  --cb-color-bg-brand-active: #e50;
  --cb-color-bg-accent: #0064c8;
  --cb-color-bg-accent-hover: #0064c8;
  --cb-color-bg-accent-active: #0050a0;
  --cb-color-bg-primary: #fff;
  --cb-color-bg-secondary: #f4f6f7;
  --cb-color-bg-secondary-fade: rgba(0,46,70,0.04314);
  --cb-color-bg-tertiary: #eee;
  --cb-color-bg-tertiary-fade: rgba(0,0,0,0.066667);
  --cb-color-bg-disabled: #c0c6cc;
  --cb-color-bg-help: #888;
  --cb-color-bg-help-tint: #f7f7f7;
  --cb-color-bg-help-tint-fade: rgba(0,0,0,0.031373);
  --cb-color-bg-info: #0064c8;
  --cb-color-bg-info-tint: #ebf4fb;
  --cb-color-bg-info-tint-fade: rgba(0,115,204,0.078431);
  --cb-color-bg-success: #1e8e3e;
  --cb-color-bg-success-tint: #edfcf1;
  --cb-color-bg-success-tint-fade: rgba(0,212,57,0.070588);
  --cb-color-bg-warning: #ffc440;
  --cb-color-bg-warning-tint: #fff7db;
  --cb-color-bg-warning-tint-fade: rgba(255,198,0,0.141176);
  --cb-color-bg-error: #d93026;
  --cb-color-bg-error-tint: #fcefee;
  --cb-color-bg-error-tint-fade: rgba(210,15,0,0.066667);
  --cb-color-bg-danger: #c80000;
  --cb-color-bg-backdrop: rgba(0,0,0,0.2);
  --cb-color-border-transparent: transparent;
  --cb-color-border-white: #fff;
  --cb-color-border-brand: #ff6a00;
  --cb-color-border-brand-hover: #ff6a00;
  --cb-color-border-brand-active: #e50;
  --cb-color-border-accent: #0064c8;
  --cb-color-border-accent-hover: #0064c8;
  --cb-color-border-accent-active: #0050a0;
  --cb-color-border-primary: #d1d5d9;
  --cb-color-border-secondary: #e3e4e6;
  --cb-color-border-tertiary: #ebebeb;
  --cb-color-border-disabled: #c0c6cc;
  --cb-color-border-help: #888;
  --cb-color-border-info: #0064c8;
  --cb-color-border-success: #1e8e3e;
  --cb-color-border-warning: #ffc440;
  --cb-color-border-error: #d93026;
  --cb-color-border-danger: #c80000;
  --cb-color-shadow: rgba(0,0,0,0.16);
  --cb-color-link-primary: #0064c8;
  --cb-color-link-primary-visited: #0064c8;
  --cb-color-link-primary-hover: #0064c8;
  --cb-color-link-primary-active: #0050a0;
  --cb-color-link-secondary: #666;
  --cb-color-link-secondary-visited: #666;
  --cb-color-link-secondary-hover: #0064c8;
  --cb-color-link-secondary-active: #0064c8;
  --cb-color-link-tertiary: #666;
  --cb-color-link-tertiary-visited: #666;
  --cb-color-link-tertiary-hover: #333;
  --cb-color-link-tertiary-active: #333;
  --cb-color-link-brand: #ff6a00;
  --cb-color-link-brand-visited: #ff6a00;
  --cb-color-link-brand-hover: #ff6a00;
  --cb-color-link-brand-active: #e50;
  --cb-color-link-brand-secondary: #666;
  --cb-color-link-brand-secondary-visited: #666;
  --cb-color-link-brand-secondary-hover: #ff6a00;
  --cb-color-link-brand-secondary-active: #ff6a00;
  --cb-color-link-disabled: #c0c6cc;
  --cb-color-input-text: #666;
  --cb-color-input-bg: #fff;
  --cb-color-input-border: #ebebeb;
  --cb-color-input-text-hover: #666;
  --cb-color-input-bg-hover: #fff;
  --cb-color-input-border-hover: #e3e4e6;
  --cb-color-input-text-focus: #666;
  --cb-color-input-bg-focus: #fff;
  --cb-color-input-border-focus: #0064c8;
  --cb-color-input-border-focus-brand: #ff6a00;
  --cb-color-input-text-disabled: #c0c6cc;
  --cb-color-input-bg-disabled: #f4f6f7;
  --cb-color-input-border-disabled: #c0c6cc;
  --cb-color-input-placeholder: #999;
  --cb-color-button-menu-text: #666;
  --cb-color-button-menu-bg: transparent;
  --cb-color-button-menu-border: transparent;
  --cb-color-button-menu-text-hover: #666;
  --cb-color-button-menu-bg-hover: rgba(0,46,70,0.04314);
  --cb-color-button-menu-border-hover: transparent;
  --cb-color-button-menu-text-active: #666;
  --cb-color-button-menu-bg-active: rgba(0,46,70,0.04314);
  --cb-color-button-menu-border-active: transparent;
  --cb-color-button-menu-text-disabled: #c0c6cc;
  --cb-color-button-menu-bg-disabled: transparent;
  --cb-color-button-menu-border-disabled: transparent;
  --cb-color-button-danger-text: #fff;
  --cb-color-button-danger-bg: #c80000;
  --cb-color-button-danger-border: #c80000;
  --cb-color-button-danger-text-hover: #fff;
  --cb-color-button-danger-bg-hover: #c80000;
  --cb-color-button-danger-border-hover: #c80000;
  --cb-color-button-danger-text-active: #fff;
  --cb-color-button-danger-bg-active: #c80000;
  --cb-color-button-danger-border-active: #c80000;
  --cb-color-button-danger-text-disabled: #fff;
  --cb-color-button-danger-bg-disabled: #c0c6cc;
  --cb-color-button-danger-border-disabled: #c0c6cc;
  --cb-color-button-primary-text: #fff;
  --cb-color-button-primary-bg: #0064c8;
  --cb-color-button-primary-border: #0064c8;
  --cb-color-button-primary-text-hover: #fff;
  --cb-color-button-primary-bg-hover: #0064c8;
  --cb-color-button-primary-border-hover: #0064c8;
  --cb-color-button-primary-text-active: #fff;
  --cb-color-button-primary-bg-active: #0050a0;
  --cb-color-button-primary-border-active: #0050a0;
  --cb-color-button-primary-text-disabled: #fff;
  --cb-color-button-primary-bg-disabled: #c0c6cc;
  --cb-color-button-primary-border-disabled: #c0c6cc;
  --cb-color-button-secondary-text: #666;
  --cb-color-button-secondary-bg: #f4f6f7;
  --cb-color-button-secondary-border: #e3e4e6;
  --cb-color-button-secondary-text-hover: #333;
  --cb-color-button-secondary-bg-hover: #fff;
  --cb-color-button-secondary-border-hover: #e3e4e6;
  --cb-color-button-secondary-text-active: #333;
  --cb-color-button-secondary-bg-active: #fff;
  --cb-color-button-secondary-border-active: #e3e4e6;
  --cb-color-button-secondary-text-disabled: #c0c6cc;
  --cb-color-button-secondary-bg-disabled: #f4f6f7;
  --cb-color-button-secondary-border-disabled: #c0c6cc;
  --cb-color-button-secondary-alt-text: #666;
  --cb-color-button-secondary-alt-bg: transparent;
  --cb-color-button-secondary-alt-border: #e3e4e6;
  --cb-color-button-secondary-alt-text-hover: #333;
  --cb-color-button-secondary-alt-bg-hover: #f4f6f7;
  --cb-color-button-secondary-alt-border-hover: #e3e4e6;
  --cb-color-button-secondary-alt-text-active: #333;
  --cb-color-button-secondary-alt-bg-active: #f4f6f7;
  --cb-color-button-secondary-alt-border-active: #e3e4e6;
  --cb-color-button-secondary-alt-text-disabled: #c0c6cc;
  --cb-color-button-secondary-alt-bg-disabled: transparent;
  --cb-color-button-secondary-alt-border-disabled: #c0c6cc;
  --cb-color-button-tertiary-text: #666;
  --cb-color-button-tertiary-bg: transparent;
  --cb-color-button-tertiary-border: transparent;
  --cb-color-button-tertiary-text-hover: #333;
  --cb-color-button-tertiary-bg-hover: #f4f6f7;
  --cb-color-button-tertiary-border-hover: transparent;
  --cb-color-button-tertiary-text-active: #333;
  --cb-color-button-tertiary-bg-active: #f4f6f7;
  --cb-color-button-tertiary-border-active: transparent;
  --cb-color-button-tertiary-text-disabled: #c0c6cc;
  --cb-color-button-tertiary-bg-disabled: #f4f6f7;
  --cb-color-button-tertiary-border-disabled: transparent;
  --cb-color-button-tertiary-alt-text: #666;
  --cb-color-button-tertiary-alt-bg: #f4f6f7;
  --cb-color-button-tertiary-alt-border: transparent;
  --cb-color-button-tertiary-alt-text-hover: #333;
  --cb-color-button-tertiary-alt-bg-hover: #eee;
  --cb-color-button-tertiary-alt-border-hover: transparent;
  --cb-color-button-tertiary-alt-text-active: #333;
  --cb-color-button-tertiary-alt-bg-active: #eee;
  --cb-color-button-tertiary-alt-border-active: transparent;
  --cb-color-button-tertiary-alt-text-disabled: #c0c6cc;
  --cb-color-button-tertiary-alt-bg-disabled: transparent;
  --cb-color-button-tertiary-alt-border-disabled: transparent;
  --cb-color-button-brand-primary-text: #fff;
  --cb-color-button-brand-primary-bg: #ff6a00;
  --cb-color-button-brand-primary-border: #ff6a00;
  --cb-color-button-brand-primary-text-hover: #fff;
  --cb-color-button-brand-primary-bg-hover: #ff6a00;
  --cb-color-button-brand-primary-border-hover: #ff6a00;
  --cb-color-button-brand-primary-text-active: #fff;
  --cb-color-button-brand-primary-bg-active: #e50;
  --cb-color-button-brand-primary-border-active: #e50;
  --cb-color-button-brand-primary-text-disabled: #fff;
  --cb-color-button-brand-primary-bg-disabled: #c0c6cc;
  --cb-color-button-brand-primary-border-disabled: #c0c6cc;
  --cb-color-button-brand-secondary-text: #ff6a00;
  --cb-color-button-brand-secondary-bg: #fff;
  --cb-color-button-brand-secondary-border: #ff6a00;
  --cb-color-button-brand-secondary-text-hover: #ff6a00;
  --cb-color-button-brand-secondary-bg-hover: #fff;
  --cb-color-button-brand-secondary-border-hover: #ff6a00;
  --cb-color-button-brand-secondary-text-active: #e50;
  --cb-color-button-brand-secondary-bg-active: #fff;
  --cb-color-button-brand-secondary-border-active: #e50;
  --cb-color-button-brand-secondary-text-disabled: #c0c6cc;
  --cb-color-button-brand-secondary-bg-disabled: #fff;
  --cb-color-button-brand-secondary-border-disabled: #c0c6cc;
  --cb-color-button-brand-secondary-alt-text: #ff6a00;
  --cb-color-button-brand-secondary-alt-bg: transparent;
  --cb-color-button-brand-secondary-alt-border: #ff6a00;
  --cb-color-button-brand-secondary-alt-text-hover: #ff6a00;
  --cb-color-button-brand-secondary-alt-bg-hover: #f4f6f7;
  --cb-color-button-brand-secondary-alt-border-hover: #ff6a00;
  --cb-color-button-brand-secondary-alt-text-active: #e50;
  --cb-color-button-brand-secondary-alt-bg-active: #f4f6f7;
  --cb-color-button-brand-secondary-alt-border-active: #e50;
  --cb-color-button-brand-secondary-alt-text-disabled: #c0c6cc;
  --cb-color-button-brand-secondary-alt-bg-disabled: transparent;
  --cb-color-button-brand-secondary-alt-border-disabled: #c0c6cc;
  --cb-color-button-brand-tertiary-text: #ff6a00;
  --cb-color-button-brand-tertiary-bg: transparent;
  --cb-color-button-brand-tertiary-border: transparent;
  --cb-color-button-brand-tertiary-text-hover: #ff6a00;
  --cb-color-button-brand-tertiary-bg-hover: #f4f6f7;
  --cb-color-button-brand-tertiary-border-hover: transparent;
  --cb-color-button-brand-tertiary-text-active: #e50;
  --cb-color-button-brand-tertiary-bg-active: #f4f6f7;
  --cb-color-button-brand-tertiary-border-active: transparent;
  --cb-color-button-brand-tertiary-text-disabled: #c0c6cc;
  --cb-color-button-brand-tertiary-bg-disabled: transparent;
  --cb-color-button-brand-tertiary-border-disabled: transparent;
  --cb-color-button-text-primary-text: #0064c8;
  --cb-color-button-text-primary-bg: transparent;
  --cb-color-button-text-primary-border: transparent;
  --cb-color-button-text-primary-text-hover: #0064c8;
  --cb-color-button-text-primary-bg-hover: transparent;
  --cb-color-button-text-primary-border-hover: transparent;
  --cb-color-button-text-primary-text-active: #0064c8;
  --cb-color-button-text-primary-bg-active: transparent;
  --cb-color-button-text-primary-border-active: transparent;
  --cb-color-button-text-primary-text-disabled: #c0c6cc;
  --cb-color-button-text-primary-bg-disabled: transparent;
  --cb-color-button-text-primary-border-disabled: transparent;
  --cb-color-button-text-secondary-text: #666;
  --cb-color-button-text-secondary-bg: transparent;
  --cb-color-button-text-secondary-border: transparent;
  --cb-color-button-text-secondary-text-hover: #0064c8;
  --cb-color-button-text-secondary-bg-hover: transparent;
  --cb-color-button-text-secondary-border-hover: transparent;
  --cb-color-button-text-secondary-text-active: #0064c8;
  --cb-color-button-text-secondary-bg-active: transparent;
  --cb-color-button-text-secondary-border-active: transparent;
  --cb-color-button-text-secondary-text-disabled: #c0c6cc;
  --cb-color-button-text-secondary-bg-disabled: transparent;
  --cb-color-button-text-secondary-border-disabled: transparent;
  --cb-color-button-text-tertiary-text: #666;
  --cb-color-button-text-tertiary-bg: transparent;
  --cb-color-button-text-tertiary-border: transparent;
  --cb-color-button-text-tertiary-text-hover: #333;
  --cb-color-button-text-tertiary-bg-hover: transparent;
  --cb-color-button-text-tertiary-border-hover: transparent;
  --cb-color-button-text-tertiary-text-active: #333;
  --cb-color-button-text-tertiary-bg-active: transparent;
  --cb-color-button-text-tertiary-border-active: transparent;
  --cb-color-button-text-tertiary-text-disabled: #c0c6cc;
  --cb-color-button-text-tertiary-bg-disabled: transparent;
  --cb-color-button-text-tertiary-border-disabled: transparent;
  --cb-color-button-text-brand-primary-text: #ff6a00;
  --cb-color-button-text-brand-primary-bg: transparent;
  --cb-color-button-text-brand-primary-border: transparent;
  --cb-color-button-text-brand-primary-text-hover: #ff6a00;
  --cb-color-button-text-brand-primary-bg-hover: transparent;
  --cb-color-button-text-brand-primary-border-hover: transparent;
  --cb-color-button-text-brand-primary-text-active: #ff6a00;
  --cb-color-button-text-brand-primary-bg-active: transparent;
  --cb-color-button-text-brand-primary-border-active: transparent;
  --cb-color-button-text-brand-primary-text-disabled: #c0c6cc;
  --cb-color-button-text-brand-primary-bg-disabled: transparent;
  --cb-color-button-text-brand-primary-border-disabled: transparent;
  --cb-color-button-text-brand-secondary-text: #666;
  --cb-color-button-text-brand-secondary-bg: transparent;
  --cb-color-button-text-brand-secondary-border: transparent;
  --cb-color-button-text-brand-secondary-text-hover: #ff6a00;
  --cb-color-button-text-brand-secondary-bg-hover: transparent;
  --cb-color-button-text-brand-secondary-border-hover: transparent;
  --cb-color-button-text-brand-secondary-text-active: #ff6a00;
  --cb-color-button-text-brand-secondary-bg-active: transparent;
  --cb-color-button-text-brand-secondary-border-active: transparent;
  --cb-color-button-text-brand-secondary-text-disabled: #c0c6cc;
  --cb-color-button-text-brand-secondary-bg-disabled: transparent;
  --cb-color-button-text-brand-secondary-border-disabled: transparent;
  --cb-typo-font-family-base: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --cb-typo-font-family-base-ja: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --cb-typo-font-family-monospace: Operator Mono, Menlo, Monaco, Liberation Mono, DejaVu Sans Mono, Courier New, monospace;
  --cb-size-border-radius-xs: 2px;
  --cb-size-border-radius-s: 4px;
  --cb-size-border-radius-m: 8px;
  --cb-size-border-radius-l: 12px;
  --cb-size-border-radius-xl: 16px;
}