@cldemo/ui-kit 1.1.5 → 1.1.6

package/buildLibs/styles/Common/Btn-base.css

@@ -87,7 +87,7 @@
 .btn-default {
   background-color: var(--cl-primary, #1088f0);
   border-color: var(--cl-primary, #1088f0);
-  color: var(--cl-bg, #ffffff) !important;
+  color: var(--cl-text-on-accent, #1a1a1a) !important;
 }
 
 
@@ -102,7 +102,7 @@
 .btn-green {
   background-color: var(--cl-success, #12b76a);
   border-color: var(--cl-success, #12b76a);
-  color: var(--cl-bg, #ffffff) !important;
+  color: var(--cl-text-on-accent, #1a1a1a) !important;
 }
 
 
@@ -116,7 +116,7 @@
 .btn-red {
   background-color: var(--cl-danger, #ee0a24);
   border-color: var(--cl-danger, #ee0a24);
-  color: var(--cl-bg, #ffffff) !important;
+  color: var(--cl-text-on-accent, #1a1a1a) !important;
 }
 
 
@@ -130,7 +130,7 @@
 .btn-yellow {
   background-color: var(--cl-accent, #fbe300);
   border-color: var(--cl-accent, #fbe300);
-  color: var(--cl-bg, #ffffff) !important;
+  color: var(--cl-text-on-accent, #1a1a1a) !important;
 }
 
 

package/buildLibs/styles/Common/Input-base.css

@@ -5,8 +5,8 @@
 .panel-input .form-control {
   display: block;
   width: 100%;
-  height: 36px;
-  line-height: 36px;
+  height: 38px;
+  line-height: 38px;
 }
 
 .input-group {
@@ -38,7 +38,7 @@
   line-height: 1.5;
   text-align: center;
   white-space: nowrap;
-  border: 1px solid #ced4da;
+  border: 1px solid var(--cl-border-control, #cfcfcf);
   border-radius: 4px;
   background-color: var(--cl-bg-muted, #f5f5f5);
   font-size: 14px;
@@ -136,7 +136,7 @@
 
 .panel-input.input-icon > div {
   border-radius: 4px;
-  border: 1px solid var(--cl-border, #cfcfcf);
+  border: 1px solid var(--cl-border-control, #cfcfcf);
   transition:
     border 300ms linear,
     background-color 300ms linear;
@@ -310,7 +310,7 @@
 
 .form-control {
 	background-color: transparent !important;
-	border: 1px solid var(--cl-border, #cfcfcf);
+	border: 1px solid var(--cl-border-control, #cfcfcf);
 	border-radius: 4px;
 	color: #565656;
 	font-family: inherit;
@@ -370,7 +370,7 @@
 .form-control[disabled] {
 	background-color: var(--cl-bg-muted, #f5f5f5) !important;
 	cursor: no-drop;
-	border-color: var(--cl-border, #cfcfcf) !important;
+	border-color: var(--cl-border-disabled, #cfcfcf) !important;
 }
 
 /* -- 纯文本只读模式（isPlaintext）--

package/buildLibs/styles/Common/Token.css

@@ -101,9 +101,13 @@
   --cl-text-tertiary: var(--cl-neutral-400); /* 占位符、辅助信息、时间戳 */
   --cl-text-disabled: var(--cl-neutral-300); /* 禁用态 */
   --cl-text-inverse: var(--cl-white); /* 深色底上的文字 */
+  --cl-text-on-accent: #1a1a1a; /* 彩色强调面（主色/成功/警告徽标）上的文字：亮色下强调色偏亮，需深字 */
+  --cl-bg-badge-yellow: #8a6a00; /* 黄色徽标底色：原 #fbe300 与白/深字均不达标（1.31:1），改深琥珀保证白字 5.07:1 */
 
   /* -- 边框 -- */
-  --cl-border: var(--cl-neutral-200); /* 通用边框 */
+  --cl-border: var(--cl-neutral-200); /* 通用边框（展示型：容器、浮层、分隔） */
+  --cl-border-control: var(--cl-border); /* 控件型：可交互控件骨架（输入/下拉/文本域等），默认继承展示型，消费方可单独调深 */
+  --cl-border-disabled: var(--cl-border); /* 禁用态控件边框：默认继承展示型而非控件型，避免消费方调深 control 后"禁用比可用更深"的语义反转 */
   --cl-border-light: var(--cl-neutral-150); /* 表格分隔线 */
   --cl-border-strong: #b8b8b8; /* 强调边框 */
   --cl-border-focus: #8c8c8c; /* 聚焦边框（对白底 3.36:1，达 WCAG 非文本 3:1） */
@@ -112,8 +116,11 @@
   --cl-bg: var(--cl-white);
   --cl-bg-subtle: var(--cl-neutral-50);
   --cl-bg-muted: var(--cl-neutral-100);
-  --cl-bg-active: #f2f3f5; /* 按下态背景 */
+  --cl-bg-active: #f2f3f5; /* 按下态背景（轻反馈，与键盘等浅底容器同层） */
   --cl-bg-hover: #f0f0f0; /* 大面积元素的悬停/聚焦底色（浅于 neutral-150，避免观感过重） */
+  --cl-bg-press: #cfcfcf; /* 按压反馈底色：用于 :active 需明显区别于 --cl-bg-active 底色的场合（如键盘按键、列表项） */
+  --cl-bg-inverse: #323233; /* 反色底（深色小块，如 bg-black 徽标）：承载白字，不随主题翻转 */
+  --cl-bg-badge-gray: #5c6672; /* 灰徽标底色：原 #848D98 白字仅 3.36:1，调深至 5.84:1 */
 
   /* ============================================================
    * 3. alpha / 遮罩层 —— rgba() 值的落点
@@ -272,9 +279,12 @@
   --cl-text-tertiary: rgba(255, 255, 255, 0.45);
   --cl-text-disabled: rgba(255, 255, 255, 0.3);
   --cl-text-inverse: #1a1a1a;
+  --cl-text-on-accent: #1a1a1a; /* 暗色下主色/成功色反而更亮（#3d9ef5 / #34c77b），同样需深字 */
 
   /* -- 边框 / 背景 -- */
   --cl-border: rgba(255, 255, 255, 0.16);
+  --cl-border-control: var(--cl-border);
+  --cl-border-disabled: var(--cl-border);
   --cl-border-light: rgba(255, 255, 255, 0.1);
   --cl-border-strong: rgba(255, 255, 255, 0.28);
   --cl-border-focus: rgba(255, 255, 255, 0.4);
@@ -284,6 +294,10 @@
   --cl-bg-muted: #262626;
   --cl-bg-active: #303030;
   --cl-bg-hover: #2e2e2e;
+  --cl-bg-press: #4a4a4a;
+  --cl-bg-inverse: #323233;
+  --cl-bg-badge-gray: #5c6672;
+  --cl-bg-badge-yellow: #8a6a00;
 
   /* -- 遮罩：暗底上要更重，否则浮层与背景分不开 -- */
   --cl-mask-light: rgba(0, 0, 0, 0.45);
@@ -333,8 +347,11 @@
     --cl-text-tertiary: rgba(255, 255, 255, 0.45);
     --cl-text-disabled: rgba(255, 255, 255, 0.3);
     --cl-text-inverse: #1a1a1a;
+    --cl-text-on-accent: #1a1a1a;
 
     --cl-border: rgba(255, 255, 255, 0.16);
+    --cl-border-control: var(--cl-border);
+    --cl-border-disabled: var(--cl-border);
     --cl-border-light: rgba(255, 255, 255, 0.1);
     --cl-border-strong: rgba(255, 255, 255, 0.28);
     --cl-border-focus: rgba(255, 255, 255, 0.4);
@@ -344,6 +361,10 @@
     --cl-bg-muted: #262626;
     --cl-bg-active: #303030;
     --cl-bg-hover: #2e2e2e;
+    --cl-bg-press: #4a4a4a;
+    --cl-bg-inverse: #323233;
+    --cl-bg-badge-gray: #5c6672;
+    --cl-bg-badge-yellow: #8a6a00;
 
     --cl-mask-light: rgba(0, 0, 0, 0.45);
     --cl-mask: rgba(0, 0, 0, 0.6);

package/buildLibs/styles/Element/ClBadge.css

@@ -7,7 +7,7 @@
     text-transform: none;
     font-weight: 500;
     font-size: 12px;
-    color: var(--cl-bg, #ffffff);
+    color: var(--cl-text-on-accent, #1a1a1a);
     border-radius: 8px;
     min-width: 16px;
     min-height: 16px;
@@ -30,19 +30,37 @@
 }
 
 .bg-red {
-    background-color: var(--cl-danger, #ee0a24) !important;
+    /* 固定深红：亮色 --cl-danger 白字仅 4.46:1 不达标，暗色 --cl-danger 更亮，故不随主题翻转 */
+    background-color: #cc0020 !important;
 }
 
 .bg-yellow {
-    background-color: #fbe300 !important;
+    background-color: var(--cl-bg-badge-yellow, #8a6a00) !important;
 }
 
 .bg-black {
-    background-color: var(--cl-text-primary, #323233) !important;
+    /* 固定深色：原用 --cl-text-primary 当底色，暗色下该 token 翻成近白色会让白字失效 */
+    background-color: var(--cl-bg-inverse, #323233) !important;
 }
 
 .bg-gray {
-    background-color: #848D98 !important;
+    /* 固定深灰：暗色下仍需承载白字，不随主题翻转 */
+    background-color: var(--cl-bg-badge-gray, #5c6672) !important;
+}
+
+/* 各变体字色：必须写在基类 .badge 之后（同特异性下靠后者生效）。
+   底色偏暗的变体（黑/红/黄/灰）用固定白字；底色偏亮的（主色/成功色）用强调面字色，
+   因这两种强调色在暗色主题下反而更亮，深字在两侧均达 WCAG 4.5:1 */
+.badge.bg-black,
+.badge.bg-red,
+.badge.bg-yellow,
+.badge.bg-gray {
+    color: #ffffff;
+}
+
+.badge.bg-default,
+.badge.bg-green {
+    color: var(--cl-text-on-accent, #1a1a1a);
 }
 
 .badge-dot {

package/buildLibs/styles/Element/ClButton.css

@@ -331,7 +331,7 @@
 }
 
 .btn-body-backdrop-container .btn-body-backdrop-text {
-  color: var(--cl-bg, #ffffff);
+  color: var(--cl-text-on-accent, #1a1a1a);
   font-size: 12px;
   margin-top: 5px;
   cursor: default;

package/buildLibs/styles/Element/ClCard.css

@@ -23,7 +23,7 @@
   padding: 16px;
   border-radius: 0;
   background-color: var(--cl-bg, #ffffff);
-  border-top: 1px solid #eaeefb;
+  border-top: 1px solid var(--cl-border-light, #dcdcdc);
 }
 
 .card-box.card-default {

package/buildLibs/styles/Element/ClCheckbox.css

@@ -47,7 +47,7 @@
 .checkbox label:before {
     background-color: transparent;
     border-radius: 3px;
-    border: 1px solid var(--cl-border, #cfcfcf);
+    border: 1px solid var(--cl-border-control, #cfcfcf);
     content: "";
     display: inline-block;
     height: 17px;
@@ -65,7 +65,7 @@
 }
 
 .checkbox input[type="checkbox"]:disabled+label:before {
-    border-color: var(--cl-border, #cfcfcf) !important;
+    border-color: var(--cl-border-disabled, #cfcfcf) !important;
 }
 
 .checkbox input[type="checkbox"]:checked:disabled+label:before {
@@ -138,7 +138,7 @@
 
 .checkbox-default input[type="checkbox"].indeterminate+label:after,
 .checkbox-default input[type="checkbox"]:checked+label:after {
-    color: var(--cl-bg, #ffffff);
+    color: var(--cl-text-on-accent, #1a1a1a);
 }
 
 .checkbox input[type="checkbox"]:disabled,
@@ -269,7 +269,7 @@
 }
 
 .tooltip.tooltip-black .tooltip-inner {
-  color: var(--cl-bg, #ffffff);
+  color: var(--cl-text-on-accent, #1a1a1a);
   background-color: var(--cl-text-primary, #323233);
 }
 .tooltip.tooltip-black[data-popper-placement^='top'] > .arrow::before {

package/buildLibs/styles/Element/ClCheckboxOne.css

@@ -47,7 +47,7 @@
 .checkbox label:before {
     background-color: transparent;
     border-radius: 3px;
-    border: 1px solid var(--cl-border, #cfcfcf);
+    border: 1px solid var(--cl-border-control, #cfcfcf);
     content: "";
     display: inline-block;
     height: 17px;
@@ -65,7 +65,7 @@
 }
 
 .checkbox input[type="checkbox"]:disabled+label:before {
-    border-color: var(--cl-border, #cfcfcf) !important;
+    border-color: var(--cl-border-disabled, #cfcfcf) !important;
 }
 
 .checkbox input[type="checkbox"]:checked:disabled+label:before {
@@ -138,7 +138,7 @@
 
 .checkbox-default input[type="checkbox"].indeterminate+label:after,
 .checkbox-default input[type="checkbox"]:checked+label:after {
-    color: var(--cl-bg, #ffffff);
+    color: var(--cl-text-on-accent, #1a1a1a);
 }
 
 .checkbox input[type="checkbox"]:disabled,
@@ -269,7 +269,7 @@
 }
 
 .tooltip.tooltip-black .tooltip-inner {
-  color: var(--cl-bg, #ffffff);
+  color: var(--cl-text-on-accent, #1a1a1a);
   background-color: var(--cl-text-primary, #323233);
 }
 .tooltip.tooltip-black[data-popper-placement^='top'] > .arrow::before {

package/buildLibs/styles/Element/ClClipboard.css

@@ -9,7 +9,7 @@
 }
 
 .clipboard-btn {
-    color: var(--cl-bg, #ffffff);
+    color: var(--cl-text-on-accent, #1a1a1a);
     cursor: pointer;
 }
 

package/buildLibs/styles/Element/ClEllipsis.css

@@ -115,7 +115,7 @@
 }
 
 .tooltip.tooltip-black .tooltip-inner {
-  color: var(--cl-bg, #ffffff);
+  color: var(--cl-text-on-accent, #1a1a1a);
   background-color: var(--cl-text-primary, #323233);
 }
 .tooltip.tooltip-black[data-popper-placement^='top'] > .arrow::before {

package/buildLibs/styles/Element/ClForm.css

@@ -161,7 +161,7 @@
   > .calendar-text
   > .time-input-base
   > .form-control {
-  border-color: var(--cl-border, #cfcfcf) !important;
+  border-color: var(--cl-border-control, #cfcfcf) !important;
 }
 
 .panel-form-validate[data-validate-error]
@@ -256,7 +256,7 @@
   > .panel-form-validate[data-validate-success]
   > .panel-select
   .select-inTag.select-inTag-open {
-  border-color: var(--cl-border, #cfcfcf) !important;
+  border-color: var(--cl-border-control, #cfcfcf) !important;
 }
 
 .panel-form-validate[data-validate-error]
@@ -266,6 +266,6 @@
   .panel-select
   .dropdownLayer-text-container
   > .dropdownLayer-text-arrow {
-  color: var(--cl-border, #cfcfcf) !important;
+  color: var(--cl-border-focus, #8c8c8c) !important;
 }
 

package/buildLibs/styles/Element/ClFormValidate.css

@@ -115,7 +115,7 @@
 }
 
 .tooltip.tooltip-black .tooltip-inner {
-  color: var(--cl-bg, #ffffff);
+  color: var(--cl-text-on-accent, #1a1a1a);
   background-color: var(--cl-text-primary, #323233);
 }
 .tooltip.tooltip-black[data-popper-placement^='top'] > .arrow::before {

package/buildLibs/styles/Element/ClInputCaptcha.css

@@ -8,13 +8,13 @@
 
 .inputCaptcha-theme-default {
   align-items: stretch;
-  border: 1px solid var(--cl-border, #cfcfcf);
+  border: 1px solid var(--cl-border-control, #cfcfcf);
   border-radius: 4px;
 }
 
 .inputCaptcha-theme-bottomLine {
   align-items: center;
-  border-bottom: 1px solid var(--cl-border, #cfcfcf);
+  border-bottom: 1px solid var(--cl-border-control, #cfcfcf);
 }
 
 .panel-input-captcha:hover {
@@ -91,7 +91,7 @@
   flex-direction: row;
   align-items: center;
   justify-content: center;
-  border-left: 1px solid var(--cl-border, #cfcfcf);
+  border-left: 1px solid var(--cl-border-control, #cfcfcf);
   border-top-right-radius: 4px;
   border-bottom-right-radius: 4px;
 }

package/buildLibs/styles/Element/ClInputNumberStepper.css

@@ -3,7 +3,7 @@
   /* 宽度归使用方控制（跟随容器）；small 尺寸由 .inputNumberStepper-small 覆盖，DateTime 时钟区由 clock-set 规则覆盖 */
   width: 100%;
   border-radius: 4px;
-  border: 1px solid var(--cl-border, #cfcfcf);
+  border: 1px solid var(--cl-border-control, #cfcfcf);
 }
 
 .panel-input-number-stepper:hover,
@@ -15,7 +15,7 @@
 .panel-input-number-stepper.inputNumberStepper-disabled:hover,
 .panel-input-number-stepper.inputNumberStepper-disabled.inputNumberStepper-focus {
   background-color: var(--cl-bg-muted, #f5f5f5);
-  border-color: var(--cl-border, #cfcfcf);
+  border-color: var(--cl-border-disabled, #cfcfcf);
 }
 
 /* input */
@@ -49,7 +49,7 @@
 }
 
 .inputNumberStepper-controls.inputNumberStepper-controls-disabled > i {
-  color: var(--cl-border, #cfcfcf) !important;
+  color: var(--cl-text-disabled, #c8c9cc) !important;
 }
 
 .inputNumberStepper-controls > i {
@@ -72,7 +72,7 @@
 }
 
 .inputNumberStepper-controls.inputNumberStepper-controls-disabled:hover > i {
-  color: var(--cl-border, #cfcfcf) !important;
+  color: var(--cl-text-disabled, #c8c9cc) !important;
 }
 
 /* controls */
@@ -109,14 +109,14 @@
   left: 0;
   border-top-left-radius: 4px;
   border-bottom-left-radius: 4px;
-  border-right: 1px solid var(--cl-border, #cfcfcf);
+  border-right: 1px solid var(--cl-border-control, #cfcfcf);
 }
 
 .inputNumberStepper-btn-leftRight .inputNumberStepper-add {
   right: 0;
   border-top-right-radius: 4px;
   border-bottom-right-radius: 4px;
-  border-left: 1px solid var(--cl-border, #cfcfcf);
+  border-left: 1px solid var(--cl-border-control, #cfcfcf);
 }
 
 /* leftRight + btnShape="circle"：按钮圆形胶囊（去容器边框、按钮半圆、边框移到输入框、按钮与输入框留间距） */
@@ -134,7 +134,7 @@
 
 /* 输入框边框（circle 专属，square 维持无边框 + 容器边框） */
 .inputNumberStepper-btnShape-circle > .panel-input.input-icon > div {
-  border: 1px solid var(--cl-border, #cfcfcf);
+  border: 1px solid var(--cl-border-control, #cfcfcf);
   border-radius: 4px;
 }
 
@@ -153,7 +153,7 @@
 .panel-input-number-stepper.inputNumberStepper-btnShape-circle.inputNumberStepper-disabled.inputNumberStepper-focus
   > .panel-input.input-icon
   > div {
-  border-color: var(--cl-border, #cfcfcf);
+  border-color: var(--cl-border-control, #cfcfcf);
 }
 
 .inputNumberStepper-btnShape-circle .inputNumberStepper-controls {
@@ -188,14 +188,14 @@
 .inputNumberStepper-btn-upDown .inputNumberStepper-subtract {
   top: 0;
   border-top-right-radius: 4px;
-  border-left: 1px solid var(--cl-border, #cfcfcf);
-  border-bottom: 1px solid var(--cl-border, #cfcfcf);
+  border-left: 1px solid var(--cl-border-control, #cfcfcf);
+  border-bottom: 1px solid var(--cl-border-control, #cfcfcf);
 }
 
 .inputNumberStepper-btn-upDown .inputNumberStepper-add {
   bottom: 0;
   border-bottom-right-radius: 4px;
-  border-left: 1px solid var(--cl-border, #cfcfcf);
+  border-left: 1px solid var(--cl-border-control, #cfcfcf);
 }
 
 /* focus */

package/buildLibs/styles/Element/ClInputTextarea.css

@@ -13,7 +13,7 @@
   color: #495057;
   background-color: var(--cl-bg, #ffffff);
   background-clip: padding-box;
-  border: 1px solid #ced4da;
+  border: 1px solid var(--cl-border-control, #cfcfcf);
   border-radius: 4px;
   transition:
     border-color 0.15s ease-in-out,
@@ -30,6 +30,7 @@
 }
 .panel-input-textarea textarea.text-area:disabled {
   background-color: var(--cl-bg-muted, #f5f5f5);
+  border-color: var(--cl-border-disabled, #cfcfcf);
   opacity: 1;
 }
 .panel-input-textarea textarea.text-area::placeholder {

package/buildLibs/styles/Element/ClLoadScreen.css

@@ -135,7 +135,7 @@
 }
 
 .loadScreen-text {
-  color: var(--cl-bg, #ffffff);
+  color: var(--cl-text-on-accent, #1a1a1a);
   font-size: 25px;
   font-family: KaiTi, STKaiti;
   margin-right: 5px;

package/buildLibs/styles/Element/ClModal.css

@@ -596,7 +596,7 @@ button.close {
 }
 
 .btn-body-backdrop-container .btn-body-backdrop-text {
-  color: var(--cl-bg, #ffffff);
+  color: var(--cl-text-on-accent, #1a1a1a);
   font-size: 12px;
   margin-top: 5px;
   cursor: default;

package/buildLibs/styles/Element/ClProgress.css

@@ -5,7 +5,7 @@
 .progress-bar {
   display: flex;
   background-color: var(--cl-primary, #1088f0);
-  color: var(--cl-bg, #ffffff);
+  color: var(--cl-text-on-accent, #1a1a1a);
   text-align: center;
   transition: width 0.6s ease;
 }
@@ -62,7 +62,7 @@
   position: absolute;
   padding: 0 2px;
   top: 1px;
-  color: var(--cl-bg, #ffffff);
+  color: var(--cl-text-on-accent, #1a1a1a);
   font-size: 12px;
   height: 14px;
   line-height: 14px;

package/buildLibs/styles/Element/ClRadio.css

@@ -53,7 +53,7 @@
 .radio label:before {
   background-color: transparent;
   border-radius: 50%;
-  border: 1px solid var(--cl-border, #cfcfcf);
+  border: 1px solid var(--cl-border-control, #cfcfcf);
   content: '';
   display: inline-block;
   height: 17px;
@@ -71,7 +71,7 @@
 }
 
 .radio input[type='radio']:disabled + label:before {
-  border-color: var(--cl-border, #cfcfcf) !important;
+  border-color: var(--cl-border-disabled, #cfcfcf) !important;
 }
 
 .radio label::after {
@@ -263,7 +263,7 @@
 }
 
 .tooltip.tooltip-black .tooltip-inner {
-  color: var(--cl-bg, #ffffff);
+  color: var(--cl-text-on-accent, #1a1a1a);
   background-color: var(--cl-text-primary, #323233);
 }
 .tooltip.tooltip-black[data-popper-placement^='top'] > .arrow::before {

package/buildLibs/styles/Element/ClRadioOne.css

@@ -53,7 +53,7 @@
 .radio label:before {
   background-color: transparent;
   border-radius: 50%;
-  border: 1px solid var(--cl-border, #cfcfcf);
+  border: 1px solid var(--cl-border-control, #cfcfcf);
   content: '';
   display: inline-block;
   height: 17px;
@@ -71,7 +71,7 @@
 }
 
 .radio input[type='radio']:disabled + label:before {
-  border-color: var(--cl-border, #cfcfcf) !important;
+  border-color: var(--cl-border-disabled, #cfcfcf) !important;
 }
 
 .radio label::after {
@@ -263,7 +263,7 @@
 }
 
 .tooltip.tooltip-black .tooltip-inner {
-  color: var(--cl-bg, #ffffff);
+  color: var(--cl-text-on-accent, #1a1a1a);
   background-color: var(--cl-text-primary, #323233);
 }
 .tooltip.tooltip-black[data-popper-placement^='top'] > .arrow::before {

package/buildLibs/styles/Element/ClSlider.css

@@ -122,7 +122,7 @@
 }
 
 .tooltip.tooltip-black .tooltip-inner {
-  color: var(--cl-bg, #ffffff);
+  color: var(--cl-text-on-accent, #1a1a1a);
   background-color: var(--cl-text-primary, #323233);
 }
 .tooltip.tooltip-black[data-popper-placement^='top'] > .arrow::before {

package/buildLibs/styles/Element/ClSwitchery.css

@@ -132,7 +132,7 @@
 }
 .switchery-container {
   background-color: var(--cl-bg, #ffffff);
-  border: 1px solid var(--cl-border, #cfcfcf);
+  border: 1px solid var(--cl-border-control, #cfcfcf);
   border-radius: 20px;
   cursor: pointer;
   display: inline-block;
@@ -217,7 +217,7 @@
   color: #b6b6b6;
 }
 .switchery-container.switchery-open > .switchery-txt > span {
-  color: var(--cl-bg, #ffffff);
+  color: var(--cl-text-on-accent, #1a1a1a);
 }
 .switchery-container > .switchery-txt > span i {
   font-size: 14px;

package/buildLibs/styles/Element/ClTags.css

@@ -37,7 +37,7 @@
 .panel-tags .tag .tag-close {
   margin-left: 4px;
   flex-shrink: 0;
-  color: var(--cl-border, #cfcfcf);
+  color: var(--cl-border-focus, #8c8c8c);
   cursor: pointer;
   font-size: 14px;
   transition: all 0.3s linear;
@@ -66,7 +66,7 @@
 
 .panel-tags .tag.tag-disabled .tag-close:hover {
   cursor: no-drop;
-  color: var(--cl-border, #cfcfcf);
+  color: var(--cl-text-tertiary, #aaaaaa);
 }
 
 .tag.tag-hlight {
@@ -88,7 +88,7 @@
   position: absolute;
   right: 3px;
   top: 6px;
-  color: var(--cl-border, #cfcfcf);
+  color: var(--cl-border-focus, #8c8c8c);
   cursor: pointer;
   font-size: 14px;
   opacity: 1;

package/buildLibs/styles/Element/__provide__/LoadScreen.css

@@ -325,7 +325,7 @@
 }
 
 .loadScreen-text {
-  color: var(--cl-bg, #ffffff);
+  color: var(--cl-text-on-accent, #1a1a1a);
   font-size: 25px;
   font-family: KaiTi, STKaiti;
   margin-right: 5px;

package/buildLibs/styles/Mobile/ClBanner.css

@@ -184,7 +184,7 @@
   height: 16px;
   border-radius: 50%;
   background: var(--cl-mask, rgba(0, 0, 0, 0.3));
-  color: var(--cl-bg, #ffffff);
+  color: var(--cl-text-on-accent, #1a1a1a);
   font-size: 12px;
   line-height: 1;
   cursor: pointer;

package/buildLibs/styles/Mobile/ClCalendarM.css

@@ -207,8 +207,8 @@
 
 .panel-calendarm__day-inner {
   position: relative;
-  width: 36px;
-  height: 36px;
+  width: 38px;
+  height: 38px;
   border-radius: 50%;
   display: flex;
   flex-direction: column;
@@ -232,7 +232,7 @@
   justify-content: center;
   font-size: 8px;
   line-height: 1;
-  color: var(--cl-bg, #ffffff);
+  color: var(--cl-text-on-accent, #1a1a1a);
   box-sizing: border-box;
 }