Browse Source

增加透明度

yanghao 1 month ago
parent
commit
798837c3a9
2 changed files with 38 additions and 19 deletions
  1. 36 17
      src/views/index.vue
  2. 2 2
      src/views/login.vue

+ 36 - 17
src/views/index.vue

@@ -391,9 +391,7 @@
                 v-if="!oaTasks.length && userStore.getUser.username"
                 class="flex h-full items-center justify-center"
               >
-                <div
-                  class="todo-panel-empty-message text-[#8a9ab0] pt-10"
-                >
+                <div class="todo-panel-empty-message text-[#8a9ab0] pt-10">
                   {{ $t("common.noMsg") }}
                 </div>
               </div>
@@ -1005,7 +1003,10 @@ const slides = computed(() => {
 
 const homeBackgroundStyle = computed(() =>
   themeStore.theme === "light"
-    ? { backgroundImage: `url(${huabanBg})` }
+    ? {
+        backgroundImage: `url(${huabanBg})`,
+        backgroundAttachment: "fixed",
+      }
     : undefined,
 );
 
@@ -1920,11 +1921,7 @@ onUnmounted(() => {
 }
 
 .platform-app--active {
-  background: linear-gradient(
-    90deg,
-    #cfe5ff 0%,
-    #54a1ff 100%
-  );
+  background: linear-gradient(90deg, #cfe5ff 0%, #54a1ff 100%);
   color: #0c5aee;
   border-color: rgba(129, 145, 255, 0.44);
   box-shadow: inset 0 0 0 1px rgba(159, 173, 255, 0.08);
@@ -2005,7 +2002,9 @@ onUnmounted(() => {
   padding: 12px 36px 12px !important;
   border: 0;
   border-radius: 6px;
-  background: rgba(255, 255, 255, 0.98);
+  background: rgba(255, 255, 255, 0.7);
+  backdrop-filter: blur(10px);
+  -webkit-backdrop-filter: blur(10px);
   box-shadow: 0 14px 32px rgba(72, 126, 190, 0.1);
 }
 
@@ -2070,7 +2069,7 @@ onUnmounted(() => {
 }
 
 .side-card--documents .notice-item:hover {
-  background: rgba(228, 240, 255, 0.44);
+  background: rgba(228, 240, 255, 0.32);
   box-shadow: none;
   transform: none;
 }
@@ -2183,7 +2182,9 @@ onUnmounted(() => {
   padding: 14px 38px 14px !important;
   border: 0;
   border-radius: 6px;
-  background: rgba(255, 255, 255, 0.98);
+  background: rgba(255, 255, 255, 0.58);
+  backdrop-filter: blur(10px);
+  -webkit-backdrop-filter: blur(10px);
   box-shadow: 0 14px 32px rgba(72, 126, 190, 0.1);
 }
 
@@ -2223,7 +2224,11 @@ onUnmounted(() => {
   border: 1px solid #a9c8f8;
   border-left: 0;
   border-radius: 14px;
-  background: linear-gradient(90deg, #edf6ff 0%, #ffffff 100%);
+  background: linear-gradient(
+    90deg,
+    rgba(237, 246, 255, 0.72) 0%,
+    rgba(255, 255, 255, 0.36) 100%
+  );
   box-shadow: none;
 }
 
@@ -2232,7 +2237,11 @@ onUnmounted(() => {
 }
 
 .side-card--news-panel .news-mini:hover {
-  background: linear-gradient(90deg, #e5f2ff 0%, #ffffff 100%);
+  background: linear-gradient(
+    90deg,
+    rgba(229, 242, 255, 0.78) 0%,
+    rgba(255, 255, 255, 0.46) 100%
+  );
   border-color: #8db8f7;
   box-shadow: none;
   transform: none;
@@ -2327,7 +2336,9 @@ onUnmounted(() => {
   padding: 14px 38px 14px !important;
   border: 0;
   border-radius: 6px;
-  background: rgba(255, 255, 255, 0.98);
+  background: rgba(255, 255, 255, 0.58);
+  backdrop-filter: blur(10px);
+  -webkit-backdrop-filter: blur(10px);
   box-shadow: 0 14px 32px rgba(72, 126, 190, 0.1);
 }
 
@@ -2366,7 +2377,11 @@ onUnmounted(() => {
   border: 1px solid #a9c8f8;
   border-left: 0;
   border-radius: 14px;
-  background: linear-gradient(90deg, #edf6ff 0%, #ffffff 100%);
+  background: linear-gradient(
+    90deg,
+    rgba(237, 246, 255, 0.72) 0%,
+    rgba(255, 255, 255, 0.36) 100%
+  );
   box-shadow: none;
 }
 
@@ -2375,7 +2390,11 @@ onUnmounted(() => {
 }
 
 .side-card--todo-panel .todo-item:hover {
-  background: linear-gradient(90deg, #e5f2ff 0%, #ffffff 100%);
+  background: linear-gradient(
+    90deg,
+    rgba(229, 242, 255, 0.78) 0%,
+    rgba(255, 255, 255, 0.46) 100%
+  );
   border-color: #8db8f7;
   box-shadow: none;
   transform: none;

+ 2 - 2
src/views/login.vue

@@ -23,7 +23,7 @@
         </h1>
 
         <!-- 用户名密码登陆 -->
-        <!-- <div>
+        <div>
           <el-form
             :model="form"
             :rules="rules"
@@ -64,7 +64,7 @@
               >
             </div>
           </div>
-        </div> -->
+        </div>
 
         <!-- 钉钉登陆 -->
         <div class="text-center">