less-var-to-css-var
Version:
Convert Less Var To CSS Var
187 lines (150 loc) • 4.58 kB
text/less
@import './default.less';
//
// CSS ENV
// -----------------------------------------
@safe-area-inset-top: env(safe-area-inset-top);
@safe-area-inset-bottom: env(safe-area-inset-bottom);
@safe-area-inset-left: env(safe-area-inset-left);
@safe-area-inset-right: env(safe-area-inset-right);
//
// PROJECT
// -----------------------------------------
@THEME--DARK: ~'theme-dark'; // sync test.com
@THEME--TEST: ~'theme-test';
@container-ext-width: 280px;
@page-body-bg-color: #fff;
@page-border-radius: 5px;
@page-header-logo-left: 20px;
@page-padding-x: 20px;
@back-button-padding-x: 10px;
@navbar-min-height: 32px;
@navbar-padding-x: 16px;
@layout-main-bg-color: #f6fbfe;
@layout-sidebar-bg-color: #fff;
@layout-sidebar-width--pc: 240px;
@layout-sidebar-width--mb: 100%;
// Tabbar
@tab-bar-bg-color: #f4f4f5;
@tab-bar-bg-color--dark: #18191a;
// CommentBar
@comment-bar-bg-color: #eee;
@comment-bar-bg-color--dark: #181818;
// DrawerMod
@pane-drawer-border-radius: 18px;
@pane-drawer-bg-color: #eee;
@pane-drawer-bg-color--dark: #181818;
@pane-drawer-cancel-button-color: #e2e1e4;
@pane-drawer-cancel-button-color--dark: #222;
@comment-count-color: #fd0000;
@charging-count-color: #fca810;
@favorite-count-color: @comment-count-color;
@login-tips-color: #a1b2c5;
@login-tips-color--dark: #a1b2c5;
//
// FONT
// -----------------------------------------
// prettier-ignore
@font-chinese: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '\5FAE\8F6F\96C5\9ED1';
// prettier-ignore
@font-family: -apple-system, BlinkMacSystemFont, @font-chinese, 'Helvetica Neue', Helvetica, Ubuntu, Roboto, Noto, 'Segoe UI', Arial, sans-serif;
@font-family--android: system, sans-serif;
// prettier-ignore
@style-ui-family: -apple-system, BlinkMacSystemFont, @font-chinese, 'helvetica neue', helvetica, ubuntu, roboto, noto, 'segoe ui', Arial, sans-serif;
// prettier-ignore
@number-family: 'Avenir Next', 'Avenir', 'Segoe UI', Roboto, -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Arial, sans-serif;
@price-family: @number-family;
@code-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace;
@prime-family: 'CindieMono-D', sans-serif;
//
// COLOR PALETTE
// -----------------------------------------
//@palette-GR01: #d61a1b;
@palette-GR01: #d71a1b;
@palette-GR01--dark: #fc0d0e;
@palette-GW01: #fff;
@palette-GW01--dark: #000;
@palette-GB01: #000000;
@palette-GB02: #141414;
@palette-GB03: #1f1f1f;
@palette-GB04: #262626;
@palette-GB05: #333333;
@palette-GB06: #595959;
@palette-GB07: #8c8c8c;
@palette-GB08: #bfbfbf;
@palette-GB09: #d9d9d9;
@palette-GB10: #f0f0f0;
@palette-GB11: #f5f5f5;
@palette-GB12: #fafafa;
@palette-GB13: #ffffff;
@palette-GB01--dark: #ffffff;
@palette-GB02--dark: #fafafa;
@palette-GB03--dark: #f5f5f5;
@palette-GB04--dark: #f0f0f0;
@palette-GB05--dark: #d9d9d9;
@palette-GB06--dark: #bfbfbf;
@palette-GB07--dark: #8c8c8c;
@palette-GB08--dark: #595959;
@palette-GB09--dark: #333333;
@palette-GB10--dark: #262626;
@palette-GB11--dark: #1f1f1f;
@palette-GB12--dark: #141414;
@palette-GB13--dark: #000000;
//
// ANTD
// ------------------------------------------
// Common
@border-radius-base: 5px;
@border-radius-sm: 2px;
// Switch
@switch-height: 30px;
@switch-sm-height: 16px;
@switch-min-width: 50px;
@switch-sm-min-width: 28px;
// Text
@text-color: #333;
@text-color--dark: #eee;
@sub-text-color: lighten(@text-color, 50%);
@sub-text-color--dark: lighten(@text-color, 50%);
@primary-bg-color: #f2f2f2;
@primary-bg-color--dark: #000;
// Colors
@primary-color: @palette-GR01;
@primary-color--dark: @palette-GR01--dark;
// Prime
@prime-bg-color: #20232c;
@prime-tab-text-color: #63646b;
@prime-tab-bg-color: #0e0e11;
@prime-button-bg-color: #2a2c35;
@prime-update-notice-color: #aaa;
@prime-update-notice-bg-color: #2a2c35;
@prime-gold-text-color: #eebe8e;
@prime-gold-text-color--dark: #eebe8e;
@prime-input-bg-color: #999;
@prime-input-bg-color--dark: #0d0e11;
// Reading
//
// NULL
@secondary-color: #1f8a85;
@info-color: #1890ff;
@success-color: #52c41a;
@processing-color: #1890ff;
@error-color: #f5222d;
@highlight-color: #f5222d;
@warning-color: #faad14;
@normal-color: #d9d9d9;
// Screen
@screen-xs: 480px; // Phone
@screen-sm: 576px; // Pda P
@screen-md: 768px; // Pad L
@screen-lg: 992px; // PC
@screen-xl: 12000px; // -
@screen-xxl: 16000px; // -
// Iconfont
@font-size-base: 14px;
@iconfont-css-prefix: anticon;
// https://github.com/ant-design/ant-design/issues/20210
@line-height-base: 1.5715;
//
// IN-APP
// -----------------------------------------
@android-app-safe-area-bottom: 12px;