yanghao 1 周之前
父節點
當前提交
8eba28b479
共有 3 個文件被更改,包括 182 次插入115 次删除
  1. 16 1
      src/components/home/header.vue
  2. 164 112
      src/views/index.vue
  3. 2 2
      src/views/login.vue

+ 16 - 1
src/components/home/header.vue

@@ -1,6 +1,10 @@
 <template>
   <header
-    class="fixed w-full top-0 z-100 bg-[#010612] border-b border-[#131928] shadow-sm"
+    class="fixed w-full top-0 z-100 border-b shadow-sm"
+    :style="{
+      backgroundColor: 'var(--header-bg)',
+      borderColor: 'var(--header-border)',
+    }"
   >
     <div class="flex items-center justify-between px-5 md:px-20 h-15">
       <div class="flex items-center gap-2 cursor-pointer" @click="goHome">
@@ -82,6 +86,15 @@
         style="border-left: 1px solid #a5bbdb"
         class="hidden lg:flex items-center gap-3 h-[40%] pl-4"
       >
+        <button
+          @click="themeStore.toggleTheme()"
+          class="p-2 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors"
+          title="切换主题"
+        >
+          <!-- 简单图标切换,也可以使用 Icon 组件 -->
+          <span v-if="themeStore.theme === 'light'">🌙</span>
+          <span v-else>☀️</span>
+        </button>
         <!-- 消息中心 -->
         <el-dropdown trigger="click" placement="bottom-end">
           <div class="flex items-center gap-2 cursor-pointer pr-6 pt-1">
@@ -478,7 +491,9 @@ import logo from "@/assets/images/logo.png";
 import logo2 from "@/assets/images/logo2.png";
 import person from "@/assets/images/person.png";
 import { useUserStoreWithOut } from "@/stores/useUserStore";
+import { useThemeStore } from "@/stores/useThemeStore";
 const userStore = useUserStoreWithOut();
+const themeStore = useThemeStore();
 import {
   getNotifyMessages,
   getNotifyMessageList,

+ 164 - 112
src/views/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="portal-home min-h-screen bg-[#eef3f9] text-[#17345f]">
+  <div class="portal-home min-h-screen">
     <Header />
 
     <main class="px-5 md:px-20 pb-8 pt-20">
@@ -21,7 +21,7 @@
               }"
             >
               <div class="hero-copy carousel-caption">
-                <p class="hero-text mt-6 text-[30px]! text-[#5f6f83]">
+                <p class="hero-text mt-6 text-[30px]!">
                   {{ slide.text }}
                 </p>
               </div>
@@ -110,8 +110,10 @@
               >
                 <button type="button" class="quick-btn quick-btn--dropdown">
                   <img src="../assets//images//td.png" class="w-5 h-5" alt="" />
-                  <span class="btn-label text-[#a1a1aa]!">我的待办</span>
-                  <span class="text-[#6b2973]! font-bold">{{ todo }}</span>
+                  <span class="btn-label quick-btn__meta">我的待办</span>
+                  <span class="quick-btn__count quick-btn__count--todo">{{
+                    todo
+                  }}</span>
                   <!-- <Icon icon="mdi:chevron-down" class="quick-btn__arrow" /> -->
                 </button>
                 <template #dropdown>
@@ -144,8 +146,8 @@
               >
                 <button type="button" class="quick-btn quick-btn--dropdown">
                   <Icon icon="mdi:check" class="btn-icon" />
-                  <span class="btn-label text-[#a1a1aa]!">我的已办</span>
-                  <span class="p-2 inline-block text-[#2da04d]!">{{
+                  <span class="btn-label quick-btn__meta">我的已办</span>
+                  <span class="p-2 inline-block quick-btn__count quick-btn__count--done">{{
                     done
                   }}</span>
                   <!-- <Icon icon="mdi:chevron-down" class="quick-btn__arrow" /> -->
@@ -260,7 +262,7 @@
                   />
                 </span>
                 <span
-                  class="platform-app__label text-[#004098] md:text-sm text-[12px] text-left"
+                  class="platform-app__label md:text-sm text-[12px] text-left"
                   >{{ app.label }}</span
                 >
               </button>
@@ -1319,14 +1321,81 @@ onUnmounted(() => {
 
 <style scoped>
 .portal-home {
-  --portal-bg: #050b1a;
-  --portal-bg-2: #081326;
+  --portal-text: #17345f;
+  --portal-text-muted: #5f6f83;
+  --portal-text-soft: #7f8fa6;
+  --portal-title: #163867;
+  --portal-subtitle: rgba(61, 92, 135, 0.86);
+  --portal-line: rgba(126, 156, 201, 0.24);
+  --portal-card: rgba(255, 255, 255, 0.82);
+  --portal-card-2: rgba(248, 251, 255, 0.94);
+  --portal-card-3: rgba(240, 246, 255, 0.88);
+  --portal-card-4: rgba(231, 239, 251, 0.92);
+  --portal-nav-bg: rgba(255, 255, 255, 0.72);
+  --portal-nav-hover: rgba(219, 232, 252, 0.8);
+  --portal-input-bg: rgba(255, 255, 255, 0.7);
+  --portal-input-hover: rgba(255, 255, 255, 0.92);
+  --portal-shadow: 0 18px 40px rgba(23, 52, 95, 0.12);
+  --portal-shadow-strong: 0 24px 60px rgba(23, 52, 95, 0.16);
+  --portal-accent: #245edb;
+  --portal-accent-2: #4e8cff;
+  --portal-accent-soft: rgba(36, 94, 219, 0.14);
+  --portal-todo-bg: rgba(242, 247, 255, 0.94);
+  --portal-todo-hover: rgba(228, 238, 252, 0.95);
+  --portal-number-todo: #e15a5a;
+  --portal-number-done: #2da04d;
+  color: var(--portal-text);
+  background:
+    radial-gradient(
+      circle at 18% 12%,
+      rgba(83, 126, 255, 0.14),
+      transparent 22%
+    ),
+    radial-gradient(circle at 82% 20%, rgba(71, 148, 255, 0.14), transparent 20%),
+    radial-gradient(
+      circle at 50% 100%,
+      rgba(97, 142, 247, 0.12),
+      transparent 28%
+    ),
+    linear-gradient(180deg, #eef3f9 0%, #f7faff 46%, #eef3f9 100%);
+  background-image:
+    linear-gradient(rgba(245, 249, 255, 0.82), rgba(237, 244, 253, 0.92)),
+    url("../assets//images/bg666.png");
+  background-position:
+    center center,
+    center bottom;
+  background-repeat: no-repeat, no-repeat;
+  background-size:
+    cover,
+    100% auto;
+  background-attachment: fixed, fixed;
+}
+
+:global([data-theme="dark"] .portal-home) {
+  --portal-text: #eaf1ff;
+  --portal-text-muted: rgba(234, 241, 255, 0.95);
+  --portal-text-soft: #8a9ab0;
+  --portal-title: #f4f7ff;
+  --portal-subtitle: rgba(188, 205, 255, 0.82);
   --portal-line: rgba(97, 129, 206, 0.28);
   --portal-card: rgba(10, 19, 43, 0.8);
   --portal-card-2: rgba(12, 24, 52, 0.92);
+  --portal-card-3: rgba(17, 25, 48, 0.8);
+  --portal-card-4: rgba(15, 24, 45, 0.82);
+  --portal-nav-bg: rgba(10, 19, 43, 0.8);
+  --portal-nav-hover: rgba(28, 40, 72, 0.8);
+  --portal-input-bg: rgba(255, 255, 255, 0.08);
+  --portal-input-hover: rgba(255, 255, 255, 0.12);
+  --portal-shadow: 0 16px 34px rgba(0, 0, 0, 0.22);
+  --portal-shadow-strong: 0 24px 60px rgba(0, 0, 0, 0.38);
   --portal-accent: #6e7dff;
   --portal-accent-2: #8d4dff;
-  color: #eaf1ff;
+  --portal-accent-soft: rgba(110, 125, 255, 0.16);
+  --portal-todo-bg: #070e20;
+  --portal-todo-hover: rgba(28, 40, 72, 0.8);
+  --portal-number-todo: #f56c6c;
+  --portal-number-done: #ffffff;
+  color: var(--portal-text);
   background:
     radial-gradient(
       circle at 18% 12%,
@@ -1343,27 +1412,17 @@ onUnmounted(() => {
   background-image:
     linear-gradient(rgba(5, 11, 26, 0.62), rgba(5, 11, 26, 0.82)),
     url("../assets//images/bg666.png");
-  background-position:
-    center center,
-    center bottom;
-  background-repeat: no-repeat, no-repeat;
-  background-size:
-    cover,
-    100% auto;
-  background-attachment: fixed, fixed;
 }
 
 .hero-banner {
   position: relative;
   min-height: 310px;
-  border: 1px solid rgba(113, 140, 214, 0.16);
+  border: 1px solid var(--portal-line);
   border-radius: 10px;
   background:
-    linear-gradient(135deg, rgba(63, 91, 211, 0.32), transparent 32%),
-    linear-gradient(180deg, rgba(9, 16, 36, 0.82), rgba(4, 9, 20, 0.9));
-  box-shadow:
-    0 24px 60px rgba(0, 0, 0, 0.38),
-    inset 0 1px 0 rgba(255, 255, 255, 0.06);
+    linear-gradient(135deg, var(--portal-accent-soft), transparent 32%),
+    linear-gradient(180deg, var(--portal-card), var(--portal-card-2));
+  box-shadow: var(--portal-shadow-strong), inset 0 1px 0 rgba(255, 255, 255, 0.06);
   overflow: hidden;
 }
 
@@ -1403,7 +1462,7 @@ onUnmounted(() => {
 
 .hero-text {
   margin-top: 0;
-  color: rgba(234, 241, 255, 0.95);
+  color: var(--portal-text-muted);
   font-size: 46px;
   font-weight: 800;
   line-height: 1.2;
@@ -1423,12 +1482,12 @@ onUnmounted(() => {
   position: absolute;
   inset: 0;
   background:
-    linear-gradient(90deg, rgba(5, 11, 26, 0.28) 0%, transparent 28%),
+    linear-gradient(90deg, rgba(5, 11, 26, 0.18) 0%, transparent 28%),
     linear-gradient(
       180deg,
       transparent 0%,
-      rgba(5, 11, 26, 0.08) 56%,
-      rgba(5, 11, 26, 0.28) 100%
+      rgba(5, 11, 26, 0.04) 56%,
+      rgba(5, 11, 26, 0.18) 100%
     );
   pointer-events: none;
 }
@@ -1442,16 +1501,10 @@ onUnmounted(() => {
 .platform-block {
   /* display: flex; */
   overflow: hidden;
-  border: 1px solid rgba(109, 137, 213, 0.18);
+  border: 1px solid var(--portal-line);
   border-radius: 8px;
-  background: linear-gradient(
-    180deg,
-    rgba(10, 18, 38, 0.92),
-    rgba(8, 15, 33, 0.92)
-  );
-  box-shadow:
-    0 16px 34px rgba(0, 0, 0, 0.22),
-    inset 0 1px 0 rgba(255, 255, 255, 0.04);
+  background: linear-gradient(180deg, var(--portal-card), var(--portal-card-2));
+  box-shadow: var(--portal-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.04);
 }
 
 .platform-block__header {
@@ -1464,11 +1517,7 @@ onUnmounted(() => {
   min-height: 48px;
   padding: 0 20px 0 0px;
   box-sizing: border-box;
-  background: linear-gradient(
-    90deg,
-    rgba(44, 70, 154, 0.5),
-    rgba(18, 28, 62, 0.1)
-  );
+  background: linear-gradient(90deg, var(--portal-accent-soft), transparent);
 }
 
 .platform-block__title-wrap {
@@ -1481,7 +1530,7 @@ onUnmounted(() => {
 }
 
 .platform-block__title {
-  color: #f4f7ff;
+  color: var(--portal-title);
   font-size: 15px;
   font-weight: 800;
   min-width: 0;
@@ -1493,7 +1542,7 @@ onUnmounted(() => {
 }
 
 .platform-block__subtitle {
-  color: rgba(188, 205, 255, 0.82);
+  color: var(--portal-subtitle);
   font-size: 13px;
   font-weight: 500;
   flex: 0 0 auto;
@@ -1516,10 +1565,10 @@ onUnmounted(() => {
   align-items: center;
   justify-content: flex-start;
   gap: 6px;
-  border: 1px solid rgba(109, 137, 213, 0.16);
+  border: 1px solid var(--portal-line);
   border-radius: 10px;
   padding: 0 8px;
-  background: rgba(17, 25, 48, 0.8);
+  background: var(--portal-card-3);
 
   font-size: 14px;
   cursor: pointer;
@@ -1533,23 +1582,19 @@ onUnmounted(() => {
 .platform-app:hover {
   transform: translateY(-2px);
   border-color: rgba(133, 163, 255, 0.45);
-  box-shadow: 0 10px 26px rgba(34, 54, 110, 0.3);
+  box-shadow: 0 10px 26px rgba(34, 54, 110, 0.18);
 }
 
 .platform-app--active {
-  background: linear-gradient(
-    90deg,
-    rgba(76, 103, 224, 0.5),
-    rgba(23, 30, 58, 0.88)
-  );
-  color: #f4f7ff;
+  background: linear-gradient(90deg, rgba(76, 103, 224, 0.32), var(--portal-card));
+  color: var(--portal-title);
   border-color: rgba(129, 145, 255, 0.44);
   box-shadow: inset 0 0 0 1px rgba(159, 173, 255, 0.08);
 }
 
 .platform-app--ghost {
-  background: rgba(15, 24, 45, 0.82);
-  color: rgba(201, 212, 243, 0.9);
+  background: var(--portal-card-4);
+  color: var(--portal-text);
 }
 
 .platform-app__icon {
@@ -1557,7 +1602,7 @@ onUnmounted(() => {
   align-items: center;
   justify-content: center;
   flex: 0 0 28px;
-  color: #79b0ff;
+  color: var(--portal-accent-2);
   filter: drop-shadow(0 0 8px rgba(90, 122, 255, 0.24));
 }
 
@@ -1569,7 +1614,7 @@ onUnmounted(() => {
   text-overflow: clip;
   font-size: 13px;
   line-height: 1;
-  color: #b8b9be;
+  color: var(--portal-text);
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -1588,32 +1633,22 @@ onUnmounted(() => {
 
 .portal-mobile-shortcut {
   min-width: 0;
-  border: 1px solid rgba(116, 145, 223, 0.18);
+  border: 1px solid var(--portal-line);
   border-radius: 12px;
   padding: 10px 8px;
-  background: linear-gradient(
-    180deg,
-    rgba(17, 26, 52, 0.86),
-    rgba(10, 16, 32, 0.92)
-  );
-  color: #dfe8ff;
+  background: linear-gradient(180deg, var(--portal-card), var(--portal-card-2));
+  color: var(--portal-text);
   font-size: 13px;
   font-weight: 600;
-  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
+  box-shadow: var(--portal-shadow);
 }
 
 .side-card {
   overflow: hidden;
-  border: 1px solid rgba(109, 137, 213, 0.16);
+  border: 1px solid var(--portal-line);
   border-radius: 14px;
-  background: linear-gradient(
-    180deg,
-    rgba(10, 18, 38, 0.92),
-    rgba(7, 14, 31, 0.94)
-  );
-  box-shadow:
-    0 16px 34px rgba(0, 0, 0, 0.22),
-    inset 0 1px 0 rgba(255, 255, 255, 0.04);
+  background: linear-gradient(180deg, var(--portal-card), var(--portal-card-2));
+  box-shadow: var(--portal-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.04);
 }
 
 .side-card--content {
@@ -1628,7 +1663,7 @@ onUnmounted(() => {
   padding-right: 10px;
   /* border-radius: 999px; */
   /* background: rgba(28, 39, 72, 0.86); */
-  border-bottom: 1px solid rgba(109, 137, 213, 0.16);
+  border-bottom: 1px solid var(--portal-line);
 }
 
 .notice-badge {
@@ -1639,7 +1674,7 @@ onUnmounted(() => {
   height: 25px;
   min-width: 70px;
 
-  color: #fff;
+  color: var(--portal-title);
   font-size: 14px;
 }
 
@@ -1651,9 +1686,9 @@ onUnmounted(() => {
   height: 25px;
   min-width: 70px;
 
-  color: #fff;
+  color: var(--portal-title);
   font-size: 14px;
-  border-bottom: 2px solid #5e45bb;
+  border-bottom: 2px solid var(--portal-accent);
 }
 
 .notice-tabs {
@@ -1669,7 +1704,7 @@ onUnmounted(() => {
   border: 0;
   border-radius: 999px;
   background: transparent;
-  color: rgba(183, 201, 244, 0.88);
+  color: var(--portal-subtitle);
   font-size: 14px;
 
   cursor: pointer;
@@ -1680,7 +1715,7 @@ onUnmounted(() => {
 
 .notice-tab--active {
   position: relative;
-  color: #cdc7e8;
+  color: var(--portal-title);
 }
 
 .notice-tab--active::before {
@@ -1718,7 +1753,7 @@ onUnmounted(() => {
   justify-content: center;
   border: 0;
   background: transparent;
-  color: rgba(187, 203, 245, 0.82);
+  color: var(--portal-subtitle);
   cursor: pointer;
   font-size: 12px;
 }
@@ -1726,7 +1761,7 @@ onUnmounted(() => {
 .notice-item {
   /* background: rgba(14, 22, 42, 0.88); */
   padding: 8px 14px;
-  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.14);
+  box-shadow: 0 10px 22px rgba(23, 52, 95, 0.08);
   border-radius: 12px;
 }
 
@@ -1738,7 +1773,7 @@ onUnmounted(() => {
 
 .notice-item__title,
 .notice-item__desc {
-  color: rgba(224, 232, 255, 0.9);
+  color: var(--portal-text);
   font-size: 13px;
   line-height: 1.5;
   display: -webkit-box;
@@ -1749,16 +1784,16 @@ onUnmounted(() => {
 
 .panel-title {
   padding: 0 16px;
-  color: #eff4ff;
+  color: var(--portal-title);
   font-size: 15px;
   font-weight: 700;
 }
 
 .todo-item {
-  border: 1px solid rgba(109, 137, 213, 0.12);
-  background: rgba(14, 22, 42, 0.88);
+  border: 1px solid var(--portal-line);
+  background: var(--portal-card-4);
   padding: 8px 14px;
-  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.14);
+  box-shadow: 0 10px 22px rgba(23, 52, 95, 0.08);
 }
 
 .todo-item__tag {
@@ -1776,10 +1811,10 @@ onUnmounted(() => {
   display: flex;
   align-items: center;
   gap: 12px;
-  border: 1px solid rgba(109, 137, 213, 0.12);
-  background: rgba(14, 22, 42, 0.88);
+  border: 1px solid var(--portal-line);
+  background: var(--portal-card-4);
   padding: 5px 12px;
-  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.14);
+  box-shadow: 0 10px 22px rgba(23, 52, 95, 0.08);
   border-radius: 12px;
 }
 
@@ -1794,7 +1829,7 @@ onUnmounted(() => {
   height: 100%;
   padding: 16px;
   justify-content: start;
-  color: #fff;
+  color: var(--portal-title);
   font-size: 16px;
   font-weight: 600;
   letter-spacing: 0.08em;
@@ -1905,7 +1940,7 @@ onUnmounted(() => {
   position: absolute;
   inset: auto 0 0;
   height: 120px;
-  background: linear-gradient(180deg, transparent, rgba(5, 11, 26, 0.6));
+  background: linear-gradient(180deg, transparent, rgba(5, 11, 26, 0.2));
   z-index: 1;
   pointer-events: none;
 }
@@ -1919,16 +1954,17 @@ onUnmounted(() => {
   align-items: center;
   justify-content: space-between;
   padding: 5px 24px;
-  background: rgba(10, 19, 43, 0.8);
+  background: var(--portal-nav-bg);
   backdrop-filter: blur(10px);
   -webkit-backdrop-filter: blur(10px);
-  border-bottom: 1px solid rgba(109, 137, 213, 0.16);
+  border: 1px solid var(--portal-line);
   border-radius: 8px;
   margin-bottom: 10px;
+  box-shadow: var(--portal-shadow);
 }
 
 .nav-title {
-  color: #eaf1ff;
+  color: var(--portal-title);
   font-size: 14px;
   font-weight: 600;
   letter-spacing: 0.08em;
@@ -1942,21 +1978,21 @@ onUnmounted(() => {
   width: 320px;
   height: 36px;
   border-radius: 20px;
-  background: rgba(255, 255, 255, 0.08);
-  border: 1px solid rgba(109, 137, 213, 0.2);
+  background: var(--portal-input-bg);
+  border: 1px solid var(--portal-line);
   overflow: hidden;
   transition: all 0.2s ease;
 }
 
 .search-container:hover {
-  background: rgba(255, 255, 255, 0.12);
+  background: var(--portal-input-hover);
   border-color: rgba(109, 137, 213, 0.4);
 }
 
 .search-icon {
   flex-shrink: 0;
   font-size: 18px;
-  color: #b8b9be;
+  color: var(--portal-text-soft);
   margin-left: 12px;
 }
 
@@ -1966,7 +2002,7 @@ onUnmounted(() => {
   background: transparent;
   outline: none;
   font-size: 14px;
-  color: #eaf1ff;
+  color: var(--portal-text);
   padding: 0;
   margin: 0;
 }
@@ -1977,7 +2013,7 @@ onUnmounted(() => {
   top: 50%;
   transform: translateY(-50%);
   font-size: 12px;
-  color: rgba(255, 255, 255, 0.6);
+  color: var(--portal-text-soft);
   font-family: "Courier New", monospace;
 }
 
@@ -1994,7 +2030,7 @@ onUnmounted(() => {
   /* border: 1px solid rgba(109, 137, 213, 0.16); */
   border-radius: 12px;
   /* background: rgba(17, 25, 48, 0.8); */
-  color: #dfe8ff;
+  color: var(--portal-text);
   font-size: 13px;
   cursor: pointer;
   transition:
@@ -2014,14 +2050,14 @@ onUnmounted(() => {
 }
 
 .quick-btn:hover {
-  background: rgba(28, 40, 72, 0.8);
+  background: var(--portal-nav-hover);
   border-color: rgba(109, 137, 213, 0.4);
   transform: translateY(-1px);
 }
 
 .btn-icon {
   font-size: 16px;
-  color: #79b0ff;
+  color: var(--portal-accent-2);
 }
 
 .btn-label {
@@ -2030,7 +2066,23 @@ onUnmounted(() => {
 
 .quick-btn__arrow {
   font-size: 16px;
-  color: #8a9ab0;
+  color: var(--portal-text-soft);
+}
+
+.quick-btn__meta {
+  color: var(--portal-text-soft);
+}
+
+.quick-btn__count {
+  font-weight: 700;
+}
+
+.quick-btn__count--todo {
+  color: var(--portal-number-todo);
+}
+
+.quick-btn__count--done {
+  color: var(--portal-number-done);
 }
 
 .badge {
@@ -2050,12 +2102,12 @@ onUnmounted(() => {
   display: flex;
   gap: 16px;
   padding: 8px 16px;
-  background: #070e20;
+  background: var(--portal-todo-bg);
   backdrop-filter: blur(10px);
-  border: 1px solid rgba(255, 255, 255, 0.05);
+  border: 1px solid var(--portal-line);
   -webkit-backdrop-filter: blur(10px);
   border-radius: 8px;
-  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.2);
+  box-shadow: var(--portal-shadow);
   /* margin-bottom: 16px; */
 }
 
@@ -2094,7 +2146,7 @@ onUnmounted(() => {
 }
 
 .todo-item:hover {
-  background: rgba(28, 40, 72, 0.8);
+  background: var(--portal-todo-hover);
   transform: translateY(-1px);
   border-color: rgba(109, 137, 213, 0.2);
 }
@@ -2102,20 +2154,20 @@ onUnmounted(() => {
 .number {
   font-size: 18px;
   font-weight: 700;
-  color: #f56c6c; /* 红色 */
+  color: var(--portal-number-todo);
   min-width: 24px;
   text-align: center;
 }
 
 .label {
   font-size: 12px;
-  color: #dfe8ff;
+  color: var(--portal-text);
   white-space: nowrap;
 }
 
 .icon {
   font-size: 14px;
-  color: #79b0ff; /* 蓝色 */
+  color: var(--portal-accent-2);
 }
 /* 下拉菜单主体 */
 :deep(.el-dropdown-menu) {

+ 2 - 2
src/views/login.vue

@@ -21,7 +21,7 @@
         <h1 class="text-2xl font-bold text-center">登录</h1>
 
         <!-- 用户名密码登陆 -->
-        <!-- <div>
+        <div>
           <el-form
             :model="form"
             :rules="rules"
@@ -62,7 +62,7 @@
               >
             </div>
           </div>
-        </div> -->
+        </div>
 
         <!-- 钉钉登陆 -->
         <div class="text-center">