fix(管理端): 核心页面与装修页硬编码颜色替换为深色模式令牌

2026-10-28 21:40:50 +00:00 · 2026-09-29 00:57:14 +08:00 · 2026-09-29 00:57:14 +08:00 · ac210a2019
commit ac210a2019
parent 61266416ef
64 changed files with 236 additions and 223 deletions
--- a/frontend/admin/src/diy/pages/devise/list.vue
+++ b/frontend/admin/src/diy/pages/devise/list.vue
@ -597,7 +597,6 @@ function recovery(row) {
 }
 .left-wrapper {
  padding: 20px 0 0 20px;
-  background: #fff;
  border-right: unset;
 }
 .tree_tit {
--- a/frontend/admin/src/diy/pages/theme/editTheme/components/CategoryEditor.vue
+++ b/frontend/admin/src/diy/pages/theme/editTheme/components/CategoryEditor.vue
@ -114,10 +114,10 @@ function saveAndClose() {
  display: flex;
  align-items: center;
  justify-content: center;
-  background-color: #fff;
+  background-color: var(--prev-bg-white);
  .title {
    font-size: 14px;
-    color: rgba(0, 0, 0, 0.85);
+    color: var(--prev-color-text-regular);
    position: relative;
    padding-left: 11px;
    font-weight: bold;
@ -139,7 +139,7 @@ function saveAndClose() {
      .pictrue {
        width: 100%;
        height: 496px;
-        border: 1px solid #eeeeee;
+        border: 1px solid var(--prev-border-color-lighter);
        border-radius: 10px;
        img {
          width: 100%;
@ -148,7 +148,7 @@ function saveAndClose() {
      }
      .name {
        font-size: 13px;
-        color: rgba(0, 0, 0, 0.85);
+        color: var(--prev-color-text-regular);
        margin-top: 16px;
        text-align: center;
      }
--- a/frontend/admin/src/diy/pages/theme/mallTheme/index.vue
+++ b/frontend/admin/src/diy/pages/theme/mallTheme/index.vue
@ -182,7 +182,7 @@ body .v-modal {
    justify-content: space-between;
    align-items: center;
    padding: 20px 16px;
-    background: #fff;
+    background: var(--prev-bg-white);
    margin-bottom: 20px;
    border-radius: 4px;

@ -193,7 +193,7 @@ body .v-modal {
      .page-title {
        font-size: 18px;
        font-weight: bold;
-        color: #333;
+        color: var(--prev-color-text-regular);
        margin-right: 15px;
      }

@ -223,12 +223,12 @@ body .v-modal {
      .status-tag {
        display: flex;
        align-items: center;
-        background: rgba(51, 51, 51, 0.04);
+        background: var(--prev-color-hover);
        padding: 2px 10px;
        border-radius: 4px;
        .text {
          font-size: 12px;
-          color: #333;
+          color: var(--prev-color-text-regular);
        }
      }
    }
@ -236,7 +236,7 @@ body .v-modal {
      display: flex;
      align-items: center;
      font-size: 14px;
-      color: #333;
+      color: var(--prev-color-text-regular);
      cursor: pointer;
      .icon {
        margin-right: 5px;
@ -249,7 +249,7 @@ body .v-modal {
  .theme-list {
    padding: 16px;
    border-radius: 5px;
-    background-color: #fff;
+    background-color: var(--prev-bg-white);

    .list-wrapper {
      display: flex;
@ -266,15 +266,15 @@ body .v-modal {
  }
  .theme-card {
    width: 100%;
-    background: #fff;
-    border: 1px solid #eee;
+    background: var(--prev-bg-white);
+    border: 1px solid var(--prev-border-color-lighter);
    border-radius: 8px;
    padding: 17px;
    transition: all 0.3s;
    margin-bottom: 20px;

    &:hover {
-      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+      box-shadow: var(--el-box-shadow-light);
      transform: translateY(-2px);
    }

@ -286,11 +286,11 @@ body .v-modal {

      .card-title {
        font-size: 12px;
-        color: #333;
+        color: var(--prev-color-text-regular);
        border-radius: 0px 20px 20px 0px;
        padding: 7px 12px;
        margin-left: -17px;
-        background: rgba(51, 51, 51, 0.05);
+        background: var(--prev-color-hover);
      }

      .card-actions {
@ -312,20 +312,20 @@ body .v-modal {
      .theme-name {
        font-size: 14px;
        font-weight: 500;
-        color: rgba(48, 49, 51, 1);
+        color: var(--prev-color-text-regular);
        margin-bottom: 5px;
      }

      .last-modified {
        font-size: 12px;
-        color: rgba(144, 147, 153, 1);
+        color: var(--prev-color-text-secondary);
      }
    }

    .card-preview {
      display: flex;
      justify-content: center;
-      background: #f5f7fa;
+      background: var(--prev-bg-color);
      padding: 0;
      border-radius: 12px;

--- a/frontend/admin/src/diy/pages/theme/myTheme/index.vue
+++ b/frontend/admin/src/diy/pages/theme/myTheme/index.vue
@ -327,7 +327,7 @@ function handleImportSuccess() {
    cursor: pointer;
  }
  .page-header {
-    background: #fff;
+    background: var(--prev-bg-white);
    padding: 20px;
    border-radius: 4px;
    margin-bottom: 20px;
@ -336,12 +336,12 @@ function handleImportSuccess() {
    .header-title {
      font-size: 18px;
      font-weight: bold;
-      color: #333;
+      color: var(--prev-color-text-regular);
    }
  }

  .content-area {
-    background: #fff;
+    background: var(--prev-bg-white);
    padding: 20px;
    border-radius: 4px;
    min-height: calc(100vh - 140px);
@ -368,10 +368,10 @@ function handleImportSuccess() {
      .theme-card {
        width: 208px;
        height: 360px;
-        border: 1px solid #eee;
+        border: 1px solid var(--prev-border-color-lighter);
        border-radius: 8px;
        overflow: hidden;
-        background: #fff;
+        background: var(--prev-bg-white);
        display: flex;
        flex-direction: column;
        transition: all 0.3s;
@ -551,7 +551,7 @@ function handleImportSuccess() {
          }
        }
        .card-info {
-          border-top: 1px solid #eee;
+          border-top: 1px solid var(--prev-border-color-lighter);

          .info-top {
            display: flex;
@ -560,8 +560,8 @@ function handleImportSuccess() {
            padding: 12px 0 0 12px;

            .tag {
-              background: #f7f7f7;
-              color: #333;
+              background: var(--prev-bg-color);
+              color: var(--prev-color-text-regular);
              font-size: 12px;
              padding: 2px 6px;
              height: max-content;
@ -569,13 +569,13 @@ function handleImportSuccess() {
            }

            .status {
-              color: #1890ff;
+              color: var(--prev-color-primary);
              font-size: 12px;
            }
            .using-tag {
-              color: rgba(2, 86, 255, 1);
+              color: var(--prev-color-primary);
              font-size: 12px;
-              background: rgba(2, 86, 255, 0.06);
+              background: var(--prev-color-primary-light-9);
              padding: 4px 10px;
              border-radius: 10px 0 0 10px;
              z-index: 5;
@ -586,7 +586,7 @@ function handleImportSuccess() {
            padding: 12px;

            font-size: 14px;
-            color: #333;
+            color: var(--prev-color-text-regular);
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
--- a/frontend/admin/src/pages/app/app/index.vue
+++ b/frontend/admin/src/pages/app/app/index.vue
@ -230,7 +230,7 @@ function getAgreementData() {
  width: 100%;
  margin: 0 auto;
  text-align: center;
-  background-color: #fff;
+  background-color: var(--prev-bg-white);
  bottom: 0;
  padding: 16px;
  border-top: 3px solid #f5f7f9;
@ -245,7 +245,7 @@ function getAgreementData() {
  .goodsTitle .title {
    border-bottom: 2px solid var(--prev-color-primary);
    padding: 0 8px 12px 5px;
-    color: #000;
+    color: var(--prev-color-text-regular);
    font-size: 14px;
  }
  .goodsTitle .icons {
@ -420,7 +420,7 @@ function getAgreementData() {
  display: flex;
  flex-wrap: nowrap;
  padding: 20px;
-  background-color: #fff;
+  background-color: var(--prev-bg-white);
  border-radius: 5px;
  margin: 20px;
 }
--- a/frontend/admin/src/pages/app/upload/index.vue
+++ b/frontend/admin/src/pages/app/upload/index.vue
@ -178,7 +178,7 @@ function loadData(item, callback) {
  box-sizing: border-box;
  overflow-y: auto;
  height: calc(100vh - 50px);
-  background-color: #fff;
+  background-color: var(--prev-bg-white);
 }
 :deep(.el-upload-list--picture-card) {
  display: grid;
@ -265,7 +265,7 @@ function loadData(item, callback) {
    height: 30px;
    box-sizing: border-box;
    border-radius: 15px;
-    color: #000;
+    color: var(--prev-color-text-regular);
    font-size: 14px;
    font-family: PingFang SC-Regular, PingFang SC;
    font-weight: 400;
@ -334,7 +334,7 @@ function loadData(item, callback) {
    line-height: 41px;
    font-size: 15px;
    font-weight: 400;
-    color: #333333;
+    color: var(--prev-color-text-regular);
    border: 1px solid #cccccc;
  }
 }
--- a/frontend/admin/src/pages/cms/addArticle/index.vue
+++ b/frontend/admin/src/pages/cms/addArticle/index.vue
@ -372,7 +372,7 @@ function getDetails() {
 }

 .form .goodsTitle {
-  border-bottom: 1px solid rgba(0, 0, 0, 0.09);
+  border-bottom: 1px solid var(--prev-border-color-lighter);
  margin-bottom: 25px;
 }

@ -383,7 +383,7 @@ function getDetails() {
 .form .goodsTitle .title {
  border-bottom: 2px solid var(--prev-color-primary);
  padding: 0 8px 12px 5px;
-  color: #000;
+  color: var(--prev-color-text-regular);
  font-size: 14px;
 }

--- a/frontend/admin/src/pages/driver/bot/edit.vue
+++ b/frontend/admin/src/pages/driver/bot/edit.vue
@ -212,7 +212,7 @@ function handleSubmit() {

 <style scoped>
 .form-tip {
-  color: #909399;
+  color: var(--prev-color-text-secondary);
  font-size: 12px;
  line-height: 1.5;
  margin-top: 5px;
@ -236,7 +236,7 @@ function handleSubmit() {
 .help-doc-title {
  font-weight: 700;
  font-size: 14px;
-  color: #303133;
+  color: var(--prev-color-text-regular);
  margin-bottom: 10px;
 }
 .form-actions {
--- a/frontend/admin/src/pages/driver/copyDriver/edit.vue
+++ b/frontend/admin/src/pages/driver/copyDriver/edit.vue
@ -190,7 +190,7 @@ function handleSubmit() {

 <style scoped>
 .form-tip {
-  color: #909399;
+  color: var(--prev-color-text-secondary);
  font-size: 12px;
  line-height: 1.5;
  margin-top: 5px;
@ -201,7 +201,7 @@ function handleSubmit() {
  gap: 8px;
 }
 .text-gray {
-  color: #909399;
+  color: var(--prev-color-text-secondary);
 }
 .form-actions {
  margin-top: 24px;
--- a/frontend/admin/src/pages/driver/emailDriver/edit.vue
+++ b/frontend/admin/src/pages/driver/emailDriver/edit.vue
@ -205,7 +205,7 @@ function handleSubmit() {

 <style scoped>
 .form-tip {
-  color: #909399;
+  color: var(--prev-color-text-secondary);
  font-size: 12px;
  line-height: 1.5;
  margin-top: 5px;
@ -234,14 +234,14 @@ function handleSubmit() {
 .help-doc-title {
  font-weight: 700;
  font-size: 14px;
-  color: #303133;
+  color: var(--prev-color-text-regular);
  margin-bottom: 10px;
 }
 .help-doc-steps {
  margin: 0;
  padding-left: 20px;
  line-height: 1.8;
-  color: #606266;
+  color: var(--prev-color-text-primary);
  font-size: 13px;
 }
 .form-actions {
--- a/frontend/admin/src/pages/driver/expressDriver/companyEdit.vue
+++ b/frontend/admin/src/pages/driver/expressDriver/companyEdit.vue
@ -319,7 +319,7 @@ function handleSubmit() {
  left: 0;
  right: 0;
  padding: 16px 24px;
-  background: #fff;
+  background: var(--prev-bg-white);
  border-top: 1px solid #e8e8e8;
  text-align: right;
  z-index: 10;
--- a/frontend/admin/src/pages/driver/expressDriver/edit.vue
+++ b/frontend/admin/src/pages/driver/expressDriver/edit.vue
@ -190,7 +190,7 @@ function handleSubmit() {

 <style scoped>
 .form-tip {
-  color: #909399;
+  color: var(--prev-color-text-secondary);
  font-size: 12px;
  line-height: 1.5;
  margin-top: 5px;
--- a/frontend/admin/src/pages/driver/invoiceDriver/edit.vue
+++ b/frontend/admin/src/pages/driver/invoiceDriver/edit.vue
@ -187,7 +187,7 @@ function handleSubmit() {

 <style scoped>
 .form-tip {
-  color: #909399;
+  color: var(--prev-color-text-secondary);
  font-size: 12px;
  line-height: 1.5;
  margin-top: 5px;
--- a/frontend/admin/src/pages/driver/logisticsDriver/edit.vue
+++ b/frontend/admin/src/pages/driver/logisticsDriver/edit.vue
@ -187,7 +187,7 @@ function handleSubmit() {

 <style scoped>
 .form-tip {
-  color: #909399;
+  color: var(--prev-color-text-secondary);
  font-size: 12px;
  line-height: 1.5;
  margin-top: 5px;
@ -211,14 +211,14 @@ function handleSubmit() {
 .help-doc-title {
  font-weight: 700;
  font-size: 14px;
-  color: #303133;
+  color: var(--prev-color-text-regular);
  margin-bottom: 10px;
 }
 .help-doc-steps {
  margin: 0;
  padding-left: 20px;
  line-height: 1.8;
-  color: #606266;
+  color: var(--prev-color-text-primary);
  font-size: 13px;
 }
 .form-actions {
--- a/frontend/admin/src/pages/driver/smsDriver/edit.vue
+++ b/frontend/admin/src/pages/driver/smsDriver/edit.vue
@ -212,7 +212,7 @@ function handleSubmit() {

 <style scoped>
 .form-tip {
-  color: #909399;
+  color: var(--prev-color-text-secondary);
  font-size: 12px;
  line-height: 1.5;
  margin-top: 5px;
@ -236,14 +236,14 @@ function handleSubmit() {
 .help-doc-title {
  font-weight: 700;
  font-size: 14px;
-  color: #303133;
+  color: var(--prev-color-text-regular);
  margin-bottom: 10px;
 }
 .help-doc-steps {
  margin: 0;
  padding-left: 20px;
  line-height: 1.8;
-  color: #606266;
+  color: var(--prev-color-text-primary);
  font-size: 13px;
 }
 .form-actions {
--- a/frontend/admin/src/pages/driver/uploadDriver/edit.vue
+++ b/frontend/admin/src/pages/driver/uploadDriver/edit.vue
@ -567,7 +567,7 @@ function handleSubmit() {
  .help-doc-steps {
    .help-doc-step {
      font-size: 13px;
-      color: #606266;
+      color: var(--prev-color-text-primary);
      line-height: 2;
      padding-left: 10px;
    }
--- a/frontend/admin/src/pages/finance/billingRecords/orderDetall.vue
+++ b/frontend/admin/src/pages/finance/billingRecords/orderDetall.vue
@ -133,7 +133,7 @@ function getOrderInfo() {
    .box-title {
      padding-top: 20px;
      font-size: 16px;
-      color: #333;
+      color: var(--prev-color-text-regular);
    }

    .msg-wrapper {
@ -146,12 +146,12 @@ function getOrderInfo() {
        .item {
          flex: 1;
          margin-bottom: 15px;
-          color: #606266;
+          color: var(--prev-color-text-primary);
          font-size: 13px;
          span {
            font-size: 13px;
            font-weight: 400;
-            color: #909399;
+            color: var(--prev-color-text-secondary);
          }
        }
      }
--- a/frontend/admin/src/pages/finance/commission/handle/commissionDetails.vue
+++ b/frontend/admin/src/pages/finance/commission/handle/commissionDetails.vue
@ -196,7 +196,7 @@ defineExpose({ modals, getDetails, getList });
      &-desc {
        &-sp {
          width: 33.33%;
-          color: #17233d;
+          color: var(--prev-color-text-regular);
          font-size: 12px;
          display: inline-block;
          padding-bottom: 10px;
--- a/frontend/admin/src/pages/finance/components/commissionDetails/index.vue
+++ b/frontend/admin/src/pages/finance/components/commissionDetails/index.vue
@ -247,7 +247,7 @@ function cancel() {
  font-size: 13px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
-  color: rgba(0, 0, 0, 0.85);
+  color: var(--prev-color-text-regular);
  cursor: pointer;
 }
 .table {
@ -280,7 +280,7 @@ function cancel() {
      &-desc {
        &-sp {
          width: 33.33%;
-          color: #17233d;
+          color: var(--prev-color-text-regular);
          font-size: 12px;
          display: inline-block;
        }
--- a/frontend/admin/src/pages/index/components/baseInfo.vue
+++ b/frontend/admin/src/pages/index/components/baseInfo.vue
@ -78,7 +78,7 @@ onMounted(() => {
  margin-bottom: 10px;
  font-size: 32px;
  font-weight: 400;
-  color: #333333;
+  color: var(--prev-color-text-regular);
  line-height: 40px;
 }

--- a/frontend/admin/src/pages/index/components/gridMenu.vue
+++ b/frontend/admin/src/pages/index/components/gridMenu.vue
@ -121,7 +121,7 @@ const grid = {
    margin-top: 8px;
    font-size: 14px;
    font-weight: 400;
-    color: #333333;
+    color: var(--prev-color-text-regular);
    line-height: 22px;
    white-space: nowrap;
  }
--- a/frontend/admin/src/pages/order/afterSale/detail.vue
+++ b/frontend/admin/src/pages/order/afterSale/detail.vue
@ -925,13 +925,13 @@ onMounted(() => {
      .title {
        font-size: 16px;
        font-weight: 500;
-        color: rgba(0, 0, 0, 0.85);
+        color: var(--prev-color-text-regular);
        margin-bottom: 6px;
      }

      .sub {
        font-size: 13px;
-        color: #606266;
+        color: var(--prev-color-text-primary);
      }
    }
  }
@ -971,7 +971,7 @@ onMounted(() => {
  margin: 24px 0 12px;
  font-size: 14px;
  font-weight: 500;
-  color: #303133;
+  color: var(--prev-color-text-regular);
  padding-left: 10px;
  border-left: 3px solid var(--prev-color-primary, #409eff);
 }
@ -986,7 +986,7 @@ onMounted(() => {
  width: 80px;
  height: 80px;
  border-radius: 4px;
-  border: 1px solid #ebeef5;
+  border: 1px solid var(--prev-border-color-lighter);
 }

 .product-img {
@ -1009,7 +1009,7 @@ onMounted(() => {
  background: #f5f7fa;
  border-radius: 4px;
  font-size: 13px;
-  color: #606266;
+  color: var(--prev-color-text-primary);
  white-space: pre-wrap;
  word-break: break-all;
 }
@ -1026,7 +1026,7 @@ onMounted(() => {

    .action-tip {
      font-size: 14px;
-      color: #606266;
+      color: var(--prev-color-text-primary);

      i {
        margin-right: 6px;
--- a/frontend/admin/src/pages/order/invoice/index.vue
+++ b/frontend/admin/src/pages/order/invoice/index.vue
@ -499,7 +499,7 @@ function onClickTab() {
 <style lang="scss" scoped>
 .order_box .list {
  font-size: 12px;
-  color: #17233d;
+  color: var(--prev-color-text-regular);
  border-bottom: 1px solid #e7eaec;
  margin: 0 10px;
  padding-bottom: 22px;
--- a/frontend/admin/src/pages/order/invoice/orderDetall.vue
+++ b/frontend/admin/src/pages/order/invoice/orderDetall.vue
@ -134,7 +134,7 @@ onMounted(() => {
      padding-top: 20px;
      font-size: 15px;
      font-weight: 500;
-      color: #303133;
+      color: var(--prev-color-text-regular);
      line-height: 15px;
    }

@ -148,12 +148,12 @@ onMounted(() => {
        .item {
          flex: 1;
          margin-bottom: 15px;
-          color: #606266;
+          color: var(--prev-color-text-primary);
          font-size: 13px;
          span {
            font-size: 13px;
            font-weight: 400;
-            color: #909399;
+            color: var(--prev-color-text-secondary);
          }
        }
      }
--- a/frontend/admin/src/pages/order/orderCenter/components/DetailLogistics.vue
+++ b/frontend/admin/src/pages/order/orderCenter/components/DetailLogistics.vue
@ -80,8 +80,8 @@ function copyNum() {
  display: flex;
  align-items: center;
  padding: 20px 24px;
-  background: #f5f7fa;
-  border-bottom: 1px solid #ebeef5;
+  background: var(--prev-bg-color);
+  border-bottom: 1px solid var(--prev-border-color-lighter);

  .express-icon {
    width: 48px;
@ -99,7 +99,7 @@ function copyNum() {
  .express-company {
    font-size: 15px;
    font-weight: 600;
-    color: #303133;
+    color: var(--prev-color-text-regular);
    margin-bottom: 6px;
  }

@ -109,18 +109,18 @@ function copyNum() {
    font-size: 13px;

    .label {
-      color: #909399;
+      color: var(--prev-color-text-secondary);
      margin-right: 8px;
      flex-shrink: 0;
    }

    .value {
-      color: #606266;
+      color: var(--prev-color-text-primary);
      word-break: break-all;
    }

    .copy-btn {
-      color: #909399;
+      color: var(--prev-color-text-secondary);
      cursor: pointer;
      margin-left: 8px;
      font-size: 14px;
@ -164,7 +164,7 @@ function copyNum() {
 .track-item {
  .track-status {
    font-size: 14px;
-    color: #606266;
+    color: var(--prev-color-text-primary);
    line-height: 1.6;
    margin-bottom: 4px;

@ -182,7 +182,7 @@ function copyNum() {

 .empty-logistics {
  text-align: center;
-  color: #909399;
+  color: var(--prev-color-text-secondary);
  padding: 60px 0;
  font-size: 14px;
 }
--- a/frontend/admin/src/pages/order/orderCenter/components/DetailOrderInfo.vue
+++ b/frontend/admin/src/pages/order/orderCenter/components/DetailOrderInfo.vue
@ -300,7 +300,7 @@ function buildAddress(addr) {
    border-left: 3px solid var(--prev-color-primary);
    font-size: 15px;
    line-height: 15px;
-    color: #303133;
+    color: var(--prev-color-text-regular);
  }

  .list {
@ -358,7 +358,7 @@ function buildAddress(addr) {

 .goods-table {
  margin-top: 16px;
-  border: 1px solid #ebeef5;
+  border: 1px solid var(--prev-border-color-lighter);
  border-radius: 4px;

  .goods-header,
@ -371,14 +371,14 @@ function buildAddress(addr) {
  }

  .goods-header {
-    background: #fafafa;
-    color: #909399;
+    background: var(--prev-bg-color);
+    color: var(--prev-color-text-secondary);
    font-weight: 500;
-    border-bottom: 1px solid #ebeef5;
+    border-bottom: 1px solid var(--prev-border-color-lighter);
  }

  .goods-row + .goods-row {
-    border-top: 1px solid #ebeef5;
+    border-top: 1px solid var(--prev-border-color-lighter);
  }

  .col-goods {
@ -399,7 +399,7 @@ function buildAddress(addr) {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
-      color: #303133;
+      color: var(--prev-color-text-regular);
    }
  }

@ -412,7 +412,7 @@ function buildAddress(addr) {
  }

  .col-subtotal {
-    color: #303133;
+    color: var(--prev-color-text-regular);
    font-weight: 500;
  }
 }
--- a/frontend/admin/src/pages/order/orderCenter/components/DetailOrderList.vue
+++ b/frontend/admin/src/pages/order/orderCenter/components/DetailOrderList.vue
@ -37,12 +37,12 @@ defineProps({
      .tl-title {
        font-size: 13px;
        font-weight: 500;
-        color: #303133;
+        color: var(--prev-color-text-regular);
      }
      .tl-desc {
        margin-left: 8px;
        font-size: 12px;
-        color: #909399;
+        color: var(--prev-color-text-secondary);
      }
    }
  }
--- a/frontend/admin/src/pages/order/orderCenter/detail.vue
+++ b/frontend/admin/src/pages/order/orderCenter/detail.vue
@ -165,14 +165,14 @@ onMounted(() => {
      min-width: 0;
      padding-left: 12px;
      font-size: 13px;
-      color: #606266;
+      color: var(--prev-color-text-primary);

      .title {
        margin-bottom: 10px;
        font-weight: 500;
        font-size: 16px;
        line-height: 16px;
-        color: rgba(0, 0, 0, 0.85);
+        color: var(--prev-color-text-regular);
      }
    }
  }
@ -189,7 +189,7 @@ onMounted(() => {
      width: 200px;
      font-size: 14px;
      line-height: 14px;
-      color: rgba(0, 0, 0, 0.85);
+      color: var(--prev-color-text-regular);

      .title {
        margin-bottom: 12px;
@ -206,12 +206,9 @@ onMounted(() => {
  }
 }

-:deep(.el-drawer__body) {
-  padding: 20px 0;
-}
-
 :deep(.el-tabs--border-card > .el-tabs__content) {
-  padding: 0 35px;
+  /* 独立路由详情页：与 .head 的 30px 左右缩进对齐 */
+  padding: 0 30px;
 }

 :deep(.el-tabs--border-card > .el-tabs__header),
@ -225,7 +222,7 @@ onMounted(() => {
  border-top: 2px solid var(--prev-color-primary);
  font-size: 13px;
  font-weight: 500;
-  color: #303133;
+  color: var(--prev-color-text-regular);
  line-height: 16px;
 }

@ -241,7 +238,7 @@ onMounted(() => {
  width: 92px !important;
  font-size: 13px;
  font-weight: 400;
-  color: #303133;
+  color: var(--prev-color-text-regular);
  line-height: 16px;
 }

--- a/frontend/admin/src/pages/order/orderCenter/index.vue
+++ b/frontend/admin/src/pages/order/orderCenter/index.vue
@ -619,7 +619,7 @@ onMounted(() => {
    .stat-value {
      font-size: 24px;
      font-weight: bold;
-      color: #333;
+      color: var(--prev-color-text-regular);
    }

    .stat-label {
--- a/frontend/admin/src/pages/product/labelList/index.vue
+++ b/frontend/admin/src/pages/product/labelList/index.vue
@ -497,8 +497,6 @@ function bindMenuItem(name, index) {

 .left-wrapper {
  height: 920px;
-  background: #fff;
-  border-right: 1px solid #f2f2f2;
 }
 .w-420 {
  width: 420px;
--- a/frontend/admin/src/pages/product/productAdd/productAdd.scss
+++ b/frontend/admin/src/pages/product/productAdd/productAdd.scss
@ -347,6 +347,26 @@
  padding: 40px 20px;
  padding-top: 50px;
  margin: 0 auto;
+
+  /* 深色模式：白色手机壳图（"详情预览"标题烧在图里）改为深色面板 + CSS 标题，
+     编辑区已跟随主题，预览保持同观感（2026-09-28 用户裁定） */
+  html[data-theme='dark'] & {
+    background: var(--prev-bg-white);
+    border: 1px solid var(--prev-border-color-light);
+    border-radius: 24px;
+
+    &::before {
+      content: '详情预览';
+      display: block;
+      height: 40px;
+      margin: -50px -20px 10px;
+      line-height: 40px;
+      text-align: center;
+      font-size: 14px;
+      color: var(--prev-color-text-regular);
+    }
+  }
+
  .content {
    height: 560px;
    overflow: hidden;
--- a/frontend/admin/src/pages/setting/agreement/index.vue
+++ b/frontend/admin/src/pages/setting/agreement/index.vue
@ -198,7 +198,7 @@ fetchList();
  line-height: 54px !important;
 }
 .agreemant {
-  background-color: #fff;
+  background-color: var(--prev-bg-white);
 }
 .content {
  padding: 10px 16px;
@ -211,6 +211,14 @@ fetchList();
  padding: 40px 20px;
  padding-top: 50px;
  margin: 0 auto 0 20px;
+
+  /* 深色模式：白色手机壳图改为深色面板，与富文本编辑区同观感 */
+  html[data-theme='dark'] & {
+    background: var(--prev-bg-white);
+    border: 1px solid var(--prev-border-color-light);
+    border-radius: 24px;
+  }
+
  .content {
    height: 560px;
    overflow: hidden;
--- a/frontend/admin/src/pages/setting/express/index.vue
+++ b/frontend/admin/src/pages/setting/express/index.vue
@ -217,7 +217,7 @@ getConfig();
  width: 500px;
 }
 .form-tip {
-  color: #909399;
+  color: var(--prev-color-text-secondary);
  font-size: 12px;
  line-height: 1.5;
  margin-top: 5px;
--- a/frontend/admin/src/pages/setting/link/index.vue
+++ b/frontend/admin/src/pages/setting/link/index.vue
@ -345,7 +345,7 @@ onMounted(() => {
 .box {
  width: 100%;
  height: 100%;
-  background: #fff;
+  background: var(--prev-bg-white);
 }
 :deep(.el-card__body) {
  min-height: 700px;
@ -358,11 +358,11 @@ onMounted(() => {
  position: absolute;
  white-space: nowrap;
  z-index: 9;
-  background: #eee;
+  background: var(--prev-bg-color);
  height: 20px;
  line-height: 20px;
-  color: #555;
-  border: 1px solid #ebebeb;
+  color: var(--prev-color-text-primary);
+  border: 1px solid var(--prev-border-color-light);
  padding: 0 5px;
  left: 56px;
  bottom: -18px;
@ -379,12 +379,12 @@ onMounted(() => {
 }
 .Nav {
  width: 100%;
-  border-right: 1px solid #eee;
+  border-right: 1px solid var(--prev-border-color-lighter);
  min-width: 220px;
  max-width: max-content;
 }
 :deep(.tree .is-current) {
-  background-color: #fff !important;
+  background-color: var(--prev-bg-white) !important;
 }
 .trees-coadd {
  width: 100%;
@ -431,11 +431,11 @@ onMounted(() => {
        padding-right: 20px;
        font-size: 13px;
        font-weight: 400;
-        color: rgba(0, 0, 0, 0.6);
+        color: var(--prev-color-text-primary);
        line-height: 13px;
      }
      :deep(.is-current) {
-        background: #f1f9ff !important;
+        background: var(--prev-color-primary-light-9) !important;
        color: var(--prev-color-primary) !important;
      }
      :deep(.is-current .custom-tree-node) {
@ -471,7 +471,7 @@ onMounted(() => {
 .Modal {
  width: 100%;
  height: 100%;
-  background: #fff !important;
+  background: var(--prev-bg-white) !important;
 }
 .fill-window {
  height: 100vh;
@ -519,7 +519,7 @@ onMounted(() => {
 }

 .card-tree {
-  background: #fff;
+  background: var(--prev-bg-white);
  height: 72px;
  box-sizing: border-box;
  overflow-x: scroll; /* 设置溢出滚动 */
--- a/frontend/admin/src/pages/setting/membershipLevel/index.vue
+++ b/frontend/admin/src/pages/setting/membershipLevel/index.vue
@ -559,8 +559,6 @@ onMounted(() => {
 }
 .left-wrapper {
  height: 904px;
-  background: #fff;
-  border-right: 1px solid #f2f2f2;
 }
 .menu-item {
  position: relative;
@ -619,7 +617,7 @@ onMounted(() => {
  border: 1px solid #dcdee2 !important;
 }
 .headers {
-  background-color: #fff;
+  background-color: var(--prev-bg-white);
  margin-bottom: 20px;
 }
 :deep(.ivu-modal-mask) {
--- a/frontend/admin/src/pages/setting/notification/log/index.vue
+++ b/frontend/admin/src/pages/setting/notification/log/index.vue
@ -321,7 +321,7 @@ getStatistics();
  .stat-value {
    font-size: 28px;
    font-weight: bold;
-    color: #303133;
+    color: var(--prev-color-text-regular);
  }
  &.success .stat-value {
    color: #67c23a;
@ -334,7 +334,7 @@ getStatistics();
  }
  .stat-label {
    font-size: 14px;
-    color: #909399;
+    color: var(--prev-color-text-secondary);
    margin-top: 5px;
  }
 }
--- a/frontend/admin/src/pages/setting/notification/notificationEdit.vue
+++ b/frontend/admin/src/pages/setting/notification/notificationEdit.vue
@ -583,7 +583,7 @@ if (!id.value) {
 }

 .demo-tabs-style1 > .ivu-tabs-card > .ivu-tabs-content > .ivu-tabs-tabpane {
-  background: #fff;
+  background: var(--prev-bg-white);
  padding: 16px;
 }

@ -597,7 +597,7 @@ if (!id.value) {

 .tabs {
  padding: 0 30px;
-  background-color: #fff;
+  background-color: var(--prev-bg-white);
 }

 .trip {
--- a/frontend/admin/src/pages/setting/systemMenus/components/menusFrom.vue
+++ b/frontend/admin/src/pages/setting/systemMenus/components/menusFrom.vue
@ -419,7 +419,7 @@ defineExpose({ modals, valids, getAddFrom });
  margin: 5px;
  border-radius: 3px;
  padding: 10px;
-  color: #333;
+  color: var(--prev-color-text-regular);
  cursor: pointer;
  transition: all 0.1s;
 }
--- a/frontend/admin/src/pages/setting/systemMenus/index.vue
+++ b/frontend/admin/src/pages/setting/systemMenus/index.vue
@ -500,7 +500,7 @@ onMounted(() => {
 <style scoped lang="scss">
 .vxeTable {
  > .vxe-table--header-wrapper {
-    background: #fff !important;
+    background: var(--prev-bg-white) !important;
  }

  .icon {
@ -548,7 +548,7 @@ onMounted(() => {
  margin: 5px;
  border-radius: 3px;
  padding: 10px;
-  color: #333;
+  color: var(--prev-color-text-regular);
  cursor: pointer;
  transition: all 0.1s;
 }
--- a/frontend/admin/src/pages/setting/user/index.vue
+++ b/frontend/admin/src/pages/setting/user/index.vue
@ -118,7 +118,7 @@ function handleSubmit() {
    width: 100%;
    height: 100%;
    border-radius: 50%;
-    border: 1px solid #f2f2f2;
+    border: 1px solid var(--prev-border-color-lighter);
  }
 }
 </style>
--- a/frontend/admin/src/pages/statistic/transaction/components/toDay.vue
+++ b/frontend/admin/src/pages/statistic/transaction/components/toDay.vue
@ -468,7 +468,7 @@ function getOrderUser() {}
 }

 .br {
-  border-right: 1px solid rgba(0, 0, 0, 0.1);
+  border-right: 1px solid var(--prev-border-color-lighter);
 }

 .toDay {
@ -485,14 +485,14 @@ function getOrderUser() {}

  &-time {
    font-size: 12px;
-    color: #8c8c8c;
+    color: var(--prev-color-text-secondary);
    margin-bottom: 5px;
  }
 }

 .title {
  font-size: 16px;
-  color: #000000;
+  color: var(--prev-color-text-regular);
  font-weight: 500;
 }

@ -500,7 +500,7 @@ function getOrderUser() {}
  i {
    font-style: normal;
    font-size: 21px;
-    color: #000;
+    color: var(--prev-color-text-regular);
  }
 }
 </style>
--- a/frontend/admin/src/pages/statistic/transaction/components/transaction.vue
+++ b/frontend/admin/src/pages/statistic/transaction/components/transaction.vue
@ -285,11 +285,11 @@ function excel() {
 .header {
  &-title {
    font-size: 16px;
-    color: rgba(0, 0, 0, 0.85);
+    color: var(--prev-color-text-regular);
  }
  &-time {
    font-size: 12px;
-    color: #000000;
+    color: var(--prev-color-text-secondary);
    opacity: 0.45;
  }
 }
@ -331,20 +331,20 @@ function excel() {

 .info {
  .sp1 {
-    color: #666;
+    color: var(--prev-color-text-primary);
    font-size: 14px;
    display: block;
  }
  .sp2 {
    font-weight: 400;
    font-size: 30px;
-    color: rgba(0, 0, 0, 0.85);
+    color: var(--prev-color-text-regular);
    display: block;
  }
  .sp3 {
    font-size: 12px;
    font-weight: 400;
-    color: rgba(0, 0, 0, 0.45);
+    color: var(--prev-color-text-secondary);
    display: block;
  }
 }
--- a/frontend/admin/src/pages/system/auth/index.vue
+++ b/frontend/admin/src/pages/system/auth/index.vue
@ -77,7 +77,7 @@ onMounted(() => {
 .head {
  font-weight: 400;
  font-size: 14px;
-  color: #303133;
+  color: var(--prev-color-text-regular);
  margin-bottom: 20px;
 }

--- a/frontend/admin/src/pages/system/backendRouting/index.vue
+++ b/frontend/admin/src/pages/system/backendRouting/index.vue
@ -1197,7 +1197,7 @@ getInterfaceList('one');
  border-right: 1px solid #f2f2f2;
 }
 .card-tree {
-  background: #fff;
+  background: var(--prev-bg-white);
  height: 72px;
  box-sizing: border-box;
  overflow-x: scroll; /* 设置溢出滚动 */
@ -1212,7 +1212,7 @@ getInterfaceList('one');
  display: none; /* Chrome Safari */
 }
 .tabs {
-  background: #fff;
+  background: var(--prev-bg-white);
  padding-left: 20px;
  border-radius: 5px 5px 0 0;
 }
@ -1220,16 +1220,15 @@ getInterfaceList('one');
  width: 100%;
  display: flex;
  padding-bottom: 16px;
-  background: #fff;
+  background: var(--prev-bg-white);
  border-radius: 6px;
  .main-btn {
    display: flex;
    position: sticky;
    padding: 0px 5px 0 15px;
    width: 100%;
-    background: #fff;
    top: 0px;
-    background-color: rgba(255, 255, 255, 0.6);
+    background-color: color-mix(in srgb, var(--prev-bg-white) 60%, transparent);
    backdrop-filter: blur(4px);
    z-index: 99;
  }
@ -1269,7 +1268,7 @@ getInterfaceList('one');
    }
    .open {
      font-weight: 500;
-      color: #333;
+      color: var(--prev-color-text-regular);
    }
  }
  :deep(.vtl-node-main .vtl-operation) {
@ -1296,7 +1295,7 @@ getInterfaceList('one');
    height: 18px;
  }
  :deep(.vtl-node-content:hover .add:hover) {
-    background-color: #fff;
+    background-color: var(--prev-bg-white);
    .pop-menu {
      font-size: 16px;
    }
--- a/frontend/admin/src/pages/system/clear/index.vue
+++ b/frontend/admin/src/pages/system/clear/index.vue
@ -94,7 +94,7 @@ function clearlog() {
  margin-top: 150px;
 }
 .clear_box {
-  border: 1px solid #dadfe6;
+  border: 1px solid var(--prev-border-color-lighter);
  border-radius: 3px;
  display: flex;
  flex-direction: column;
@ -105,12 +105,12 @@ function clearlog() {
  box-sizing: border-box;
  .clear_box_sp1 {
    font-size: 16px;
-    color: #000000;
+    color: var(--prev-color-text-regular);
    display: block;
  }
  .clear_box_sp2 {
    font-size: 14px;
-    color: #808695;
+    color: var(--prev-color-text-secondary);
    display block {
      margin: 12px 0;
    }
--- a/frontend/admin/src/pages/system/codeGeneration/list.vue
+++ b/frontend/admin/src/pages/system/codeGeneration/list.vue
@ -607,17 +607,17 @@ onBeforeUnmount(() => {

 // 选项卡头部
 :deep(.ivu-tabs.ivu-tabs-card > .ivu-tabs-bar .ivu-tabs-nav-container) {
-  background-color: #fff;
+  background-color: var(--prev-bg-white);
 }
 .demo-drawer-footer {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
-  border-top: 1px solid #e8e8e8;
+  border-top: 1px solid var(--prev-border-color-lighter);
  padding: 10px 16px;
  text-align: right;
-  background: #fff;
+  background: var(--prev-bg-white);
 }
 .file {
  position: relative;
--- a/frontend/admin/src/pages/system/crontab/createModal.vue
+++ b/frontend/admin/src/pages/system/crontab/createModal.vue
@ -358,7 +358,7 @@ defineExpose({ timerInfo });
    width: 28px;
    height: 100%;
    font-size: 12px;
-    color: #333333;
+    color: var(--prev-color-text-regular);
    pointer-events: none;
  }
 }
@ -379,7 +379,7 @@ defineExpose({ timerInfo });
  right: 0;
  z-index: 1;
  padding: 10px 20px;
-  background-color: #fff;
+  background-color: var(--prev-bg-white);
  border-top: 1px solid #e8e8e8;
  display: flex;
  justify-content: center;
--- a/frontend/admin/src/pages/system/crossVersionUpgrade/index.vue
+++ b/frontend/admin/src/pages/system/crossVersionUpgrade/index.vue
@ -812,19 +812,19 @@ onBeforeUnmount(() => {
  .success-title {
    font-size: 18px;
    font-weight: 500;
-    color: #303133;
+    color: var(--prev-color-text-regular);
    margin-bottom: 8px;
  }

  .success-desc {
    font-size: 14px;
-    color: #606266;
+    color: var(--prev-color-text-primary);
  }
 }
 .cross-version-upgrade {
  .new-version-summary {
    padding: 24px 0;
-    background: #fff;
+    background: var(--prev-bg-white);
    border-radius: 8px;
    margin-top: 16px;
    margin-bottom: 16px;
@ -895,7 +895,7 @@ onBeforeUnmount(() => {
    .content-title {
      font-weight: 500;
      font-size: 14px;
-      color: #333;
+      color: var(--prev-color-text-regular);
      padding-bottom: 8px;
      border-bottom: 1px solid #eaeaea;
      margin-bottom: 12px;
@ -911,7 +911,7 @@ onBeforeUnmount(() => {
      white-space: pre-wrap;
      font-size: 12px;
      line-height: 18px;
-      color: #333;
+      color: var(--prev-color-text-regular);
    }
  }

@ -921,7 +921,7 @@ onBeforeUnmount(() => {
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
-    color: #333333;
+    color: var(--prev-color-text-regular);
  }

  :deep(.agreement-dialog) {
@ -933,7 +933,7 @@ onBeforeUnmount(() => {
      font-size: 16px !important;
      line-height: 16px !important;
      font-weight: 500;
-      color: #333333;
+      color: var(--prev-color-text-regular);
    }
  }

@ -1160,7 +1160,7 @@ onBeforeUnmount(() => {
      margin-bottom: 10px;
      font-weight: 500;
      padding-bottom: 10px;
-      border-bottom: 1px solid #eee;
+      border-bottom: 1px solid var(--prev-border-color-lighter);
    }

    .logs-content {
@ -1202,7 +1202,7 @@ onBeforeUnmount(() => {
        }

        .log-table {
-          color: #606266;
+          color: var(--prev-color-text-primary);
          min-width: 100px;
        }

@ -1212,7 +1212,7 @@ onBeforeUnmount(() => {
        }

        .log-message {
-          color: #909399;
+          color: var(--prev-color-text-secondary);
          font-size: 11px;
          margin-left: auto;
        }
--- a/frontend/admin/src/pages/system/event/index.vue
+++ b/frontend/admin/src/pages/system/event/index.vue
@ -191,7 +191,7 @@ getCategories();
  .category-title {
    font-size: 16px;
    font-weight: bold;
-    color: #303133;
+    color: var(--prev-color-text-regular);
    margin-bottom: 8px;
  }

@ -207,7 +207,7 @@ getCategories();
  align-items: center;
  font-size: 16px;
  font-weight: bold;
-  color: #303133;
+  color: var(--prev-color-text-regular);
  margin-top: 20px;
  margin-bottom: 10px;
  padding-left: 10px;
@ -222,7 +222,7 @@ getCategories();
    margin-left: auto;
    font-size: 12px;
    font-weight: normal;
-    color: #909399;
+    color: var(--prev-color-text-secondary);
  }
 }

@ -232,11 +232,11 @@ getCategories();

 .event-name {
  font-weight: 500;
-  color: #303133;
+  color: var(--prev-color-text-regular);
 }

 .event-desc {
-  color: #606266;
+  color: var(--prev-color-text-primary);
 }

 .listener-tag {
--- a/frontend/admin/src/pages/system/file/index.vue
+++ b/frontend/admin/src/pages/system/file/index.vue
@ -34,7 +34,7 @@ onMounted(() => {
  width: 100%;
  height: 100%;
  padding-top: 15px;
-  background: #fff;
+  background: var(--prev-bg-white);
 }
 :deep(.el-card__body) {
  min-height: 700px;
--- a/frontend/admin/src/pages/system/group/list.vue
+++ b/frontend/admin/src/pages/system/group/list.vue
@ -345,8 +345,6 @@ onMounted(() => {
 }
 .left-wrapper {
  height: 904px;
-  background: #fff;
-  border-right: 1px solid #dcdee2;
 }
 .menu-item {
  z-index: 50;
--- a/frontend/admin/src/pages/system/group/visualization.vue
+++ b/frontend/admin/src/pages/system/group/visualization.vue
@ -1078,10 +1078,10 @@ onMounted(() => {
  width: 100%;
  margin: 0 auto;
  text-align: center;
-  background-color: #fff;
+  background-color: var(--prev-bg-white);
  bottom: 0;
  padding: 16px;
-  border-top: 3px solid #f5f7f9;
+  border-top: 3px solid var(--prev-border-color-lighter);
 }

 .form {
@ -1096,7 +1096,7 @@ onMounted(() => {
  .goodsTitle .title {
    border-bottom: 2px solid var(--prev-color-primary);
    padding: 0 8px 12px 5px;
-    color: #000;
+    color: var(--prev-color-text-regular);
    font-size: 14px;
  }

@ -1302,9 +1302,9 @@ onMounted(() => {

 .table {
  width: 700px;
-  color: #515a6e;
+  color: var(--prev-color-text-primary);
  font-size: 14px;
-  background-color: #fff;
+  background-color: var(--prev-bg-white);
  margin-left: 20px;
 }

@ -1449,7 +1449,7 @@ onMounted(() => {
 }

 .box {
-  border-top: 3px solid #f5f7f9;
+  border-top: 3px solid var(--prev-border-color-lighter);
  padding: 10px;
  padding-top: 25px;
  width: 100%;
@ -1529,8 +1529,6 @@ onMounted(() => {

 .left-wrapper {
  min-width: 213px;
-  background: #fff;
-  border-right: 1px solid #f2f2f2;
 }

 .menu-item {
@ -1777,7 +1775,7 @@ onMounted(() => {

        .tips {
          font-size: 14px;
-          color: #333333;
+          color: var(--prev-color-text-regular);
          font-weight: 800;
          margin-bottom: 7px;
          margin-top: 10px;
@ -1785,7 +1783,7 @@ onMounted(() => {

        .tips-samll {
          font-size: 12px;
-          color: #333333;
+          color: var(--prev-color-text-regular);
          margin-bottom: 7px;

          p {
@ -1830,7 +1828,7 @@ onMounted(() => {
  display: flex;
  flex-wrap: nowrap;
  padding: 20px;
-  background-color: #fff;
+  background-color: var(--prev-bg-white);
  border-radius: 5px;
 }

--- a/frontend/admin/src/pages/system/maintain/systemCleardata/index.vue
+++ b/frontend/admin/src/pages/system/maintain/systemCleardata/index.vue
@ -185,7 +185,7 @@ function changeYU() {
  }
 }
 .clear_box {
-  border: 1px solid #dadfe6;
+  border: 1px solid var(--prev-border-color-light);
  border-radius: 3px;
  display: flex;
  flex-direction: column;
@ -194,12 +194,12 @@ function changeYU() {
  box-sizing: border-box;
  .clear_box_sp1 {
    font-size: 16px;
-    color: #000000;
+    color: var(--prev-color-text-regular);
    display: block;
  }
  .clear_box_sp2 {
    font-size: 14px;
-    color: #808695;
+    color: var(--prev-color-text-secondary);
    display: block;
    margin: 12px 0;
  }
--- a/frontend/admin/src/pages/system/maintain/systemDatabackup/index.vue
+++ b/frontend/admin/src/pages/system/maintain/systemDatabackup/index.vue
@ -453,7 +453,7 @@ getfileList();
  padding: 3px 5px;
 }
 .mark :deep(.ivu-input) {
-  background: #fff;
+  background: var(--prev-bg-white);
  border-radius: 0.39rem;
 }
 .mark :deep(.ivu-input),
--- a/frontend/admin/src/pages/system/onlineUpgrade/index.vue
+++ b/frontend/admin/src/pages/system/onlineUpgrade/index.vue
@ -609,7 +609,7 @@ onUnmounted(() => {

 .upgrade .header {
  font-size: 12px;
-  color: #000;
+  color: var(--prev-color-text-regular);
  // border-bottom:1px dotted rgba(221,221,221,1);
  // padding-bottom: 25px;
 }
@ -682,7 +682,7 @@ onUnmounted(() => {
  line-height: 20px !important;
  border: 0 !important;
  font-size: 16px !important;
-  color: #333333;
+  color: var(--prev-color-text-regular);
  font-weight: 600;
  // background: #eee;
 }
@ -826,7 +826,7 @@ onUnmounted(() => {

  .success {
    font-size: 20px;
-    color: #333333;
+    color: var(--prev-color-text-regular);
    margin-top: 10px;
  }
 }
@ -935,7 +935,7 @@ onUnmounted(() => {
 .describe h2 {
  font-size: 22px;
  font-weight: 400;
-  color: #333333;
+  color: var(--prev-color-text-regular);
  margin-bottom: 12px;
 }

--- a/frontend/admin/src/pages/system/plugin/components/PluginCard.vue
+++ b/frontend/admin/src/pages/system/plugin/components/PluginCard.vue
@ -149,8 +149,8 @@ function compareVersion(a, b) {
  display: flex;
  flex-direction: column;
  padding: 14px 16px;
-  background: #fff;
-  border: 1px solid #e7e7eb;
+  background: var(--prev-bg-white);
+  border: 1px solid var(--prev-border-color-lighter);
  border-radius: 6px;
  transition: box-shadow 0.2s;
 }
@ -167,7 +167,7 @@ function compareVersion(a, b) {
  min-width: 0;
  font-weight: 600;
  font-size: 15px;
-  color: #17233d;
+  color: var(--prev-color-text-regular);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
@ -180,8 +180,8 @@ function compareVersion(a, b) {
  max-width: 100%;
  font-family: Menlo, Consolas, monospace;
  font-size: 12px;
-  color: #666;
-  background: #f5f7f9;
+  color: var(--prev-color-text-primary);
+  background: var(--prev-bg-color);
  padding: 2px 6px;
  border-radius: 3px;
  overflow: hidden;
@ -191,7 +191,7 @@ function compareVersion(a, b) {
 .plugin-card__desc {
  margin-top: 8px;
  min-height: 40px;
-  color: #808695;
+  color: var(--prev-color-text-secondary);
  font-size: 13px;
  line-height: 20px;
  display: -webkit-box;
@ -208,7 +208,7 @@ function compareVersion(a, b) {
 .plugin-card__footer {
  margin-top: auto;
  padding-top: 10px;
-  border-top: 1px solid #f2f3f5;
+  border-top: 1px solid var(--prev-border-color-lighter);
  display: flex;
  align-items: center;
  gap: 8px;
@ -216,7 +216,7 @@ function compareVersion(a, b) {
 .plugin-card__version {
  flex: 1;
  min-width: 0;
-  color: #999;
+  color: var(--prev-color-text-secondary);
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
--- a/frontend/admin/src/pages/system/plugin/index.vue
+++ b/frontend/admin/src/pages/system/plugin/index.vue
@ -375,7 +375,7 @@ function handleUpload() {
 /* 分段胶囊切换器 */
 .segment-tabs {
  display: inline-flex;
-  background: #f2f3f5;
+  background: var(--prev-bg-color);
  border-radius: 8px;
  padding: 4px;
  gap: 4px;
@ -387,16 +387,16 @@ function handleUpload() {
  padding: 7px 22px;
  border-radius: 6px;
  font-size: 14px;
-  color: #4e5969;
+  color: var(--prev-color-text-primary);
  cursor: pointer;
  user-select: none;
  transition: background 0.2s, color 0.2s, box-shadow 0.2s;
 }
 .segment-item:hover {
-  color: #1d2129;
+  color: var(--prev-color-text-regular);
 }
 .segment-item.active {
-  background: #fff;
+  background: var(--prev-bg-white);
  color: var(--el-color-primary);
  font-weight: 600;
  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.1);
@ -408,8 +408,8 @@ function handleUpload() {
  line-height: 18px;
  border-radius: 9px;
  padding: 0 5px;
-  background: #e5e6eb;
-  color: #86909c;
+  background: var(--prev-bg-color);
+  color: var(--prev-color-text-secondary);
 }
 .segment-item.active .segment-count {
  background: var(--el-color-primary-light-9, #ecf5ff);
@ -424,12 +424,12 @@ function handleUpload() {
 .group-title {
  font-size: 15px;
  font-weight: 600;
-  color: #17233d;
+  color: var(--prev-color-text-regular);
 }
 /* 驱动类别 tab 数量 */
 .tab-count {
  font-size: 12px;
-  color: #999;
+  color: var(--prev-color-text-secondary);
 }
 /* 驱动 tab 面板顶部留白 */
 .driver-pane {
--- a/frontend/admin/src/pages/system/systemMenus/components/menusFrom.vue
+++ b/frontend/admin/src/pages/system/systemMenus/components/menusFrom.vue
@ -472,7 +472,7 @@ defineExpose({ modals, valids, getAddFrom });
  margin: 5px;
  border-radius: 3px;
  padding: 10px;
-  color: #333;
+  color: var(--prev-color-text-regular);
  cursor: pointer;
  transition: all 0.1s;
 }
--- a/frontend/admin/src/pages/system/systemMenus/index.vue
+++ b/frontend/admin/src/pages/system/systemMenus/index.vue
@ -555,7 +555,7 @@ onMounted(() => {
 <style scoped lang="scss">
 .vxeTable {
  > .vxe-table--header-wrapper {
-    background: #fff !important;
+    background: var(--prev-bg-white) !important;
  }
  .icon {
    font-size: 20px;
@ -600,7 +600,7 @@ onMounted(() => {
  margin: 5px;
  border-radius: 3px;
  padding: 10px;
-  color: #333;
+  color: var(--prev-color-text-regular);
  cursor: pointer;
  transition: all 0.1s;
 }
--- a/frontend/admin/src/pages/user/label/index.vue
+++ b/frontend/admin/src/pages/user/label/index.vue
@ -280,8 +280,6 @@ function bindMenuItem(name, index) {
  display: none;
 }
 .left-wrapper {
-  background: #fff;
-  border-right: 1px solid #f2f2f2;
  .tree {
    // height: 100%;
    height: calc(-220px + 100vh);
--- a/frontend/admin/src/pages/user/list/handle/userDetails.vue
+++ b/frontend/admin/src/pages/user/list/handle/userDetails.vue
@ -374,7 +374,7 @@ defineExpose({ modals, getDetails });
  border-top: 2px solid var(--prev-color-primary);
  font-size: 13px;
  font-weight: 500;
-  color: #303133;
+  color: var(--prev-color-text-regular);
  line-height: 16px;
 }
 :deep(.el-tabs--border-card > .el-tabs__header .el-tabs__item) {
@ -388,7 +388,7 @@ defineExpose({ modals, getDetails });
  width: 92px !important;
  font-size: 13px;
  font-weight: 400;
-  color: #303133;
+  color: var(--prev-color-text-regular);
  line-height: 16px;
 }
 :deep(.el-tabs--border-card) {
@ -423,14 +423,14 @@ defineExpose({ modals, getDetails });

      &-title {
        font-size: 13px;
-        color: #000000;
+        color: var(--prev-color-text-regular);
        margin-bottom: 12px;
      }

      &-desc {
        &-sp {
          width: 33.33%;
-          color: #17233d;
+          color: var(--prev-color-text-regular);
          font-size: 13px;
          display: inline-block;
        }
@ -449,7 +449,7 @@ defineExpose({ modals, getDetails });
          }

          span:last-child {
-            color: #808695;
+            color: var(--prev-color-text-secondary);
          }
        }

--- a/frontend/admin/src/pages/user/list/handle/userEditForm.vue
+++ b/frontend/admin/src/pages/user/list/handle/userEditForm.vue
@ -366,7 +366,7 @@ defineExpose({ setUser: setUserFn });
      font-weight: 500;
      font-size: 14px;
      line-height: 16px;
-      color: #303133;
+      color: var(--prev-color-text-regular);
    }

    &-bd {
--- a/frontend/admin/src/pages/user/list/handle/userInfo.vue
+++ b/frontend/admin/src/pages/user/list/handle/userInfo.vue
@ -134,7 +134,7 @@ function timeFormat(value, birthday) {
 .user-info {
  .section {
    padding: 25px 0;
-    border-bottom: 1px dashed #eeeeee;
+    border-bottom: 1px dashed var(--prev-border-color-lighter);

    &-hd {
      padding-left: 10px;
@ -142,7 +142,7 @@ function timeFormat(value, birthday) {
      font-weight: 500;
      font-size: 14px;
      line-height: 16px;
-      color: #303133;
+      color: var(--prev-color-text-regular);
    }

    &-bd {
@ -155,7 +155,7 @@ function timeFormat(value, birthday) {
      display: flex;
      margin: 16px 30px 0 0;
      font-size: 13px;
-      color: #666;
+      color: var(--prev-color-text-primary);

      &:nth-child(3n + 3) {
        margin: 16px 0 0;
--- a/frontend/admin/src/pages/user/list/index.vue
+++ b/frontend/admin/src/pages/user/list/index.vue
@ -1211,7 +1211,7 @@ function setChecked() {
  position: fixed;
  bottom: 0;
  width: -webkit-fill-available;
-  background: #fff;
+  background: var(--prev-bg-white);
  padding: 20px 0px;
  box-sizing: border-box;
  z-index: 100;
@ -1297,10 +1297,10 @@ img {
  position: absolute;
  bottom: 0;
  left: 0;
-  border-top: 1px solid #e8e8e8;
+  border-top: 1px solid var(--prev-border-color-lighter);
  padding: 10px 16px;
  text-align: right;
-  background: #fff;
+  background: var(--prev-bg-white);
 }

 .search-form {