// 基础配色方案,业务无关 //font size @font-size-12: 12px; @font-size-13: 13px; @font-size-14: 14px; @font-size-15: 15px; @font-size-16: 16px; @font-size-18: 18px; @font-size-20: 20px; @font-size-22: 22px; @font-size-24: 24px; @font-size-30: 30px; @font-size-40: 40px; @font-size-50: 50px; @font-size-60: 60px; @font-size-70: 70px; @radius-2: 2px; @radius-6: 6px; @opacity-15: 0.15; @opacity-20: 0.2; // 色板 // 品牌 @color-brand-blue-100: #2C60DB; @color-brand-blue-90: fade(@color-brand-blue-100, 90); @color-brand-blue-80: fade(@color-brand-blue-100, 80); @color-brand-blue-60: fade(@color-brand-blue-100, 60); @color-brand-blue-50: fade(@color-brand-blue-100, 50); @color-brand-blue-40: fade(@color-brand-blue-100, 40); @color-brand-blue-30: fade(@color-brand-blue-100, 30); @color-brand-blue-20: fade(@color-brand-blue-100, 20); @color-brand-blue-10: fade(@color-brand-blue-100, 10); @color-brand-blue-5: fade(@color-brand-blue-100, 5); //green @color-bi-green-100: #13cd66; @color-bi-green-90: fade(@color-bi-green-100, 90); @color-bi-green-80: fade(@color-bi-green-100, 80); @color-bi-green-60: fade(@color-bi-green-100, 60); @color-bi-green-50: fade(@color-bi-green-100, 50); @color-bi-green-40: fade(@color-bi-green-100, 40); @color-bi-green-30: fade(@color-bi-green-100, 30); @color-bi-green-20: fade(@color-bi-green-100, 20); @color-bi-green-10: fade(@color-bi-green-100, 10); @color-bi-green-5: fade(@color-bi-green-100, 5); //cyan @color-bi-sea-green-100: #3FB4AB; @color-bi-sea-green-90: fade(@color-bi-sea-green-100, 90); @color-bi-sea-green-80: fade(@color-bi-sea-green-100, 80); @color-bi-sea-green-60: fade(@color-bi-sea-green-100, 60); @color-bi-sea-green-50: fade(@color-bi-sea-green-100, 50); @color-bi-sea-green-40: fade(@color-bi-sea-green-100, 40); @color-bi-sea-green-30: fade(@color-bi-sea-green-100, 30); @color-bi-sea-green-20: fade(@color-bi-sea-green-100, 20); @color-bi-sea-green-10: fade(@color-bi-sea-green-100, 10); @color-bi-sea-green-5: fade(@color-bi-sea-green-100, 5); //blue @color-bi-blue-100: #3685f2; @color-bi-blue-90: fade(@color-bi-blue-100, 90); @color-bi-blue-80: fade(@color-bi-blue-100, 80); @color-bi-blue-60: fade(@color-bi-blue-100, 60); @color-bi-blue-50: fade(@color-bi-blue-100, 50); @color-bi-blue-40: fade(@color-bi-blue-100, 40); @color-bi-blue-30: fade(@color-bi-blue-100, 30); @color-bi-blue-20: fade(@color-bi-blue-100, 20); @color-bi-blue-10: fade(@color-bi-blue-100, 10); @color-bi-blue-5: fade(@color-bi-blue-100, 5); //light-blue @color-bi-sky-blue-100: #eaf2fd; @color-bi-sky-blue-90: fade(@color-bi-sky-blue-100, 90); @color-bi-sky-blue-80: fade(@color-bi-sky-blue-100, 80); @color-bi-sky-blue-60: fade(@color-bi-sky-blue-100, 60); @color-bi-sky-blue-50: fade(@color-bi-sky-blue-100, 50); @color-bi-sky-blue-40: fade(@color-bi-sky-blue-100, 40); @color-bi-sky-blue-30: fade(@color-bi-sky-blue-100, 30); @color-bi-sky-blue-20: fade(@color-bi-sky-blue-100, 20); @color-bi-sky-blue-10: fade(@color-bi-sky-blue-100, 10); @color-bi-sky-blue-5: fade(@color-bi-sky-blue-100, 5); // orange @color-bi-orange-100: #faaa39; @color-bi-orange-90: fade(@color-bi-orange-100, 90); @color-bi-orange-80: fade(@color-bi-orange-100, 80); @color-bi-orange-60: fade(@color-bi-orange-100, 60); @color-bi-orange-50: fade(@color-bi-orange-100, 50); @color-bi-orange-40: fade(@color-bi-orange-100, 40); @color-bi-orange-30: fade(@color-bi-orange-100, 30); @color-bi-orange-20: fade(@color-bi-orange-100, 20); @color-bi-orange-10: fade(@color-bi-orange-100, 10); @color-bi-orange-5: fade(@color-bi-orange-100, 5); // red @color-bi-red-100: #e65251; @color-bi-red-90: fade(@color-bi-red-100, 90); @color-bi-red-80: fade(@color-bi-red-100, 80); @color-bi-red-60: fade(@color-bi-red-100, 60); @color-bi-red-50: fade(@color-bi-red-100, 50); @color-bi-red-40: fade(@color-bi-red-100, 40); @color-bi-red-30: fade(@color-bi-red-100, 30); @color-bi-red-20: fade(@color-bi-red-100, 20); @color-bi-red-10: fade(@color-bi-red-100, 10); @color-bi-red-5: fade(@color-bi-red-100, 5); // yellow @font-color-yellow-100: #ffc101; @color-bi-yellow-80: fade(@font-color-yellow-100, 90); @color-bi-yellow-60: fade(@font-color-yellow-100, 60); @color-bi-yellow-40: fade(@font-color-yellow-100, 40); @color-bi-yellow-20: fade(@font-color-yellow-100, 20); @color-bi-yellow-5: fade(@font-color-yellow-100, 5); // black @color-bi-black-100: #232e40; @color-bi-black-90: fade(@color-bi-black-100, 90); @color-bi-black-80: fade(@color-bi-black-100, 80); @color-bi-black-60: fade(@color-bi-black-100, 60); @color-bi-black-50: fade(@color-bi-black-100, 50); @color-bi-black-40: fade(@color-bi-black-100, 40); @color-bi-black-30: fade(@color-bi-black-100, 30); @color-bi-black-20: fade(@color-bi-black-100, 20); @color-bi-black-10: fade(@color-bi-black-100, 10); @color-bi-black-5: fade(@color-bi-black-100, 5); // white @color-bi-white-100: #FFFFFF; @color-bi-white-90: fade(@color-bi-white-100, 90); @color-bi-white-80: fade(@color-bi-white-100, 80); @color-bi-white-60: fade(@color-bi-white-100, 60); @color-bi-white-50: fade(@color-bi-white-100, 50); @color-bi-white-40: fade(@color-bi-white-100, 40); @color-bi-white-30: fade(@color-bi-white-100, 30); @color-bi-white-20: fade(@color-bi-white-100, 20); @color-bi-white-10: fade(@color-bi-white-100, 10); @color-bi-white-5: fade(@color-bi-white-100, 5); @color-bi-black: @color-bi-black-100; @color-bi-black-theme-dark: #F7F9FC; @color-bi-state-gray: #2E3A4D; @color-bi-state-gray-theme-dark: #D6E0EC; @color-bi-light-state-gray: #647185; @color-bi-light-state-gray-theme-dark: #AFB7C6; @color-bi-dim-gray: #9EA6B2; @color-bi-dim-gray-theme-dark: #878d9f; @color-bi-gray: #C4C9D1; @color-bi-gray-theme-dark: #6B7084; @color-bi-dark-gray: #D0D4DA; @color-bi-dark-gray-theme-dark: #606479; @color-bi-sliver: #E7E8EB; @color-bi-sliver-theme-dark: #363E55; @color-bi-light-gray: #647185; @color-bi-light-gray-theme-dark: #afb7c6; @color-bi-gainsboro: #F5F6F9; @color-bi-gainsboro-theme-dark: #191F35; @color-bi-white: @color-bi-white-100; @color-bi-white-theme-dark: #20263B; //font color @font-color-black: @color-bi-black; @font-color-normal: #3d4d66; @font-color-normal-theme-dark: #d6e0dc; @font-color-light-gray: @color-bi-light-gray; @font-color-light-gray-theme-dark: @color-bi-light-gray-theme-dark; @font-color-disabled: @color-bi-dim-gray; @font-color-disabled-theme-dark: @color-bi-dim-gray-theme-dark; @font-color-tips: @color-bi-dim-gray; @font-color-tips-theme-dark: @color-bi-gray-theme-dark; @font-color-light-disabled: @color-bi-dark-gray; @font-color-light-disabled-theme-dark: @color-bi-dark-gray-theme-dark; @font-color-gray: #999999; @font-color-white: @color-bi-white; @font-color-white-theme-dark: @color-bi-white-theme-dark; @font-color-light-highlight: @color-bi-sky-blue-100; @font-color-medium-highlight: #d7e7fc; @font-color-highlight: @color-bi-blue-100; @font-color-blue: #23beef; @font-color-light-blue: #e9f8fd; @font-color-success: @color-bi-green-100; @font-color-warning: @color-bi-orange-100; @font-color-negative: @color-bi-red-100; @font-color-yellow: @font-color-yellow-100; //background color @background-color-black: @color-bi-black; @background-color-black-theme-dark: @color-bi-dark-gray-theme-dark; @background-color-light-black: #3d4d66; @background-color-light-black-theme-dark: #d6e0dc; @background-color-default: @color-bi-white; @background-color-default-theme-dark: @color-bi-white-theme-dark; @background-color-normal: #f7f8fa; @background-color-normal-theme-dark: #191b2b; @background-color-light-highlight: @color-bi-sky-blue-100; @background-color-medium-highlight: #d7e7fc; @background-color-highlight: @color-bi-blue-100; @background-color-blue: #23beef; @background-color-light-blue: #e9f8fd; @background-color-dark: #d4dadd; @background-color-light-gray: #f2f4f7; @background-color-light-gray-theme-dark: #292f45; @background-color-medium-gray: #e8eaed; @background-color-medium-gray-theme-dark: @color-bi-sliver-theme-dark; @background-color-dark-gray: @color-bi-dark-gray; @background-color-dark-gray-theme-dark: @color-bi-dark-gray-theme-dark; @background-color-disabled: #f2f4f7; @background-color-disabled-theme-dark: #292f45; @background-color-light-disabled: @color-bi-dim-gray; @background-color-light-disabled-theme-dark: @color-bi-dim-gray-theme-dark; @background-color-yellow: @font-color-yellow-100; @background-color-negative: @color-bi-red-100; @background-color-light-negative: #ffecec; @background-color-dark-negative: #3A2940; @background-color-light-warning: #feeed7; @background-color-warning: @color-bi-orange-100; @background-color-dark-success: @color-bi-green-100; @background-color-light-success: #e1f4e7; @background-color-normal-success: @color-bi-light-gray; //border color @border-color-default: @color-bi-white; @border-color-black: @color-bi-black; @border-color-line: #e8eaed; @border-color-line-theme-dark: @color-bi-sliver-theme-dark; @border-color-light-line: #f2f4f7; @border-color-light-line-theme-dark: #292f45; @border-color-dark-gray-line: @color-bi-dark-gray; @border-color-dark-gray-line-theme-dark: @color-bi-dark-gray-theme-dark; @border-color-dark-line: @color-bi-dim-gray; @border-color-dark-line-theme-dark: @color-bi-dim-gray-theme-dark; @border-color-highlight: @color-bi-blue-100; @border-color-success: @color-bi-green-100; @border-color-warning: #fbb03b; @border-color-negative: @color-bi-red-100; @border-color-light-negative: #f4cbcb; @border-color-normal-success: @color-bi-light-gray; //split color @border-color-disabled: #e8eaed; @border-color-disabled-theme-dark: @color-bi-sliver-theme-dark; //scroll color @scroll-color: @color-bi-black; @scroll-color-theme-dark: @color-bi-white; @scroll-thumb-color: @color-bi-black; @scroll-thumb-color-theme-dark: @color-bi-black;