From 925a72d879f399c2597b08e0becff4f7db6d399f Mon Sep 17 00:00:00 2001
From: Ben Lin <maobin001@msn.com>
Date: 星期四, 24 十月 2024 14:52:17 +0800
Subject: [PATCH] 低代码页面更新
---
src/design/color.less | 66 ++++++++++++++++++++++++++++----
1 files changed, 57 insertions(+), 9 deletions(-)
diff --git a/src/design/color.less b/src/design/color.less
index 9d2138c..90d3db4 100644
--- a/src/design/color.less
+++ b/src/design/color.less
@@ -1,4 +1,10 @@
html {
+ // text
+ --text-color: rgba(0 0 0 / 85%);
+
+ // border
+ --border-color: #eee;
+
// header
--header-bg-color: #394664;
--header-bg-hover-color: #273352;
@@ -8,11 +14,44 @@
--sider-dark-bg-color: #273352;
--sider-dark-darken-bg-color: #273352;
--sider-dark-lighten-bg-color: #273352;
+
+ // component
+ --component-background-color: #fff;
+
+ // app
+ --app-content-background-color: #fafafa;
+
+ // custom color example
+ --custom-example-color: #ff4d4f;
+
+ // dark theme
+ &[data-theme='dark'] {
+ // text
+ --text-color: #c9d1d9;
+
+ // border
+ --border-color: #303030;
+
+ // component
+ --component-background-color: #151515;
+
+ // app
+ --app-content-background-color: #1e1e1e;
+
+ // custom color example
+ --custom-example-color: #55d187;
+ }
}
@white: #fff;
@content-bg: #f4f7f9;
+
+@border-color-base: var(--border-color);
+
+@text-color-secondary: #8b949e;
+
+@component-background: var(--component-background-color);
// :export {
// name: "less";
@@ -22,7 +61,7 @@
@iconify-bg-color: #5551;
// =================================
-// ==============border-color=======
+// =========border-color============
// =================================
// Dark-dark
@@ -35,7 +74,7 @@
@border-color-light: @border-color-base;
// =================================
-// ==============message==============
+// ============message==============
// =================================
// success-bg-color
@@ -50,7 +89,6 @@
// =================================
// ==============Header=============
// =================================
-
@header-dark-bg-color: var(--header-bg-color);
@header-dark-bg-hover-color: var(--header-bg-hover-color);
@header-light-bg-hover-color: #f6f6f6;
@@ -60,7 +98,7 @@
@top-menu-active-bg-color: var(--header-active-menu-bg-color);
// =================================
-// ==============Menu============
+// ==============Menu===============
// =================================
// let -menu
@@ -73,7 +111,7 @@
@trigger-dark-bg-color: rgba(255, 255, 255, 0.1);
// =================================
-// ==============tree============
+// ==============tree===============
// =================================
// tree item hover background
@tree-hover-background-color: #f5f7fa;
@@ -81,17 +119,22 @@
@tree-hover-font-color: #f5f7fa;
// =================================
-// ==============link============
+// ==============link===============
// =================================
@link-hover-color: @primary-color;
@link-active-color: darken(@primary-color, 10%);
// =================================
-// ==============Text color-=============
+// ===========Text color============
// =================================
// Main text color
-@text-color-base: @text-color;
+@text-color-base: var(--text-color);
+
+// =================================
+// =======app content color=========
+// =================================
+@app-content-background: var(--app-content-background-color);
// Label color
@text-color-call-out: #606266;
@@ -100,7 +143,7 @@
@text-color-help-dark: #909399;
// =================================
-// ==============breadcrumb=========
+// ============breadcrumb===========
// =================================
@breadcrumb-item-normal-color: #999;
// =================================
@@ -136,3 +179,8 @@
@button-cancel-hover-color: @primary-color;
@button-cancel-hover-bg-color: @white;
@button-cancel-hover-border-color: @primary-color;
+
+// =================================
+// =====custom color example========
+// =================================
+@custom-example-color: var(--custom-example-color);
--
Gitblit v1.9.3