From 4016199e77cab019cc49204ca405ac6c59151d0d Mon Sep 17 00:00:00 2001
From: guoapeng <GuoAnPeng@163.com>
Date: Tue, 1 Jul 2025 13:54:43 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E6=B6=88=E6=AF=92=E9=A1=B5=E5=B8=83?=
 =?UTF-8?q?=E5=B1=80=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/home/Environment.vue |  2 +-
 src/components/home/HomeFormula.vue |  4 ++++
 src/layouts/default.vue             |  5 +++--
 src/views/home/index.vue            | 19 +++++++++++--------
 4 files changed, 19 insertions(+), 11 deletions(-)

diff --git a/src/components/home/Environment.vue b/src/components/home/Environment.vue
index 901c390..073032b 100644
--- a/src/components/home/Environment.vue
+++ b/src/components/home/Environment.vue
@@ -132,6 +132,6 @@ onMounted(() => {
     }
   }
   .odd {
-    background: rgba(139, 190, 239, 0.2);
+    background: rgba(139, 190, 239, 0.1);
   }
 </style>
diff --git a/src/components/home/HomeFormula.vue b/src/components/home/HomeFormula.vue
index 05daba2..e89ff9b 100644
--- a/src/components/home/HomeFormula.vue
+++ b/src/components/home/HomeFormula.vue
@@ -30,6 +30,10 @@ watchEffect(() => {
 
 <style lang="scss" scoped>
 .home-right-title{
+  background: #fff;
+  width: 90%;
+  border-radius: 10px;
+  margin: 10px auto;
   display: grid;
   grid-template-columns: 1fr 1fr;
   font-size: 1.5rem;
diff --git a/src/layouts/default.vue b/src/layouts/default.vue
index 26eec52..5ea0db1 100644
--- a/src/layouts/default.vue
+++ b/src/layouts/default.vue
@@ -205,7 +205,7 @@ const toggleLanguage = () => {
 .main {
   box-sizing: border-box;
   height: 100%;
-  background: #fff;
+  background: #FAFAFA;
   .header {
     height: 50px;
     width: 100%;
@@ -223,6 +223,7 @@ const toggleLanguage = () => {
   }
   .header {
     color: #393F46;
+    box-shadow: 0px 1px 5px 0px rgba(9, 39, 62, 0.15);
 
     .logo {
       height: 22px;
@@ -287,7 +288,7 @@ const toggleLanguage = () => {
   }
   .container {
     height: calc(100% - 100px);
-    background: #F6F6F6;
+    background: #fff;
   }
 }
 .aside {
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 0d04360..81ab8e6 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -131,12 +131,14 @@ const nowLiquid = computed(() => {
 <style lang="scss" scoped>
   $input-height: 3rem;
   .home{
-    min-height: $main-container-height;
+    width: 100%;
+    height: 100%;
   }
   .home-grid-container {
+    width: 100%;
     display: grid;
     grid-template-columns: repeat(3, 1fr);
-    gap: 0.5rem;
+    gap: 20px;
   }
   .home-merged-cell {
     grid-column: 1 / 2;
@@ -146,16 +148,16 @@ const nowLiquid = computed(() => {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     grid-template-rows: repeat(2, auto);
-    gap:.5rem;
+    gap: 20px;
     .card {
       text-align: center;
-      height: 41.5vh;
+      height: 40vh;
       width: 30.5vw;
       border: 1px solid rgb(225, 225, 225);
       position: relative;
       border-radius: 10px 10px 10px 10px;
       background: #FFFFFF;
-      background: $gradient-color;
+      background: linear-gradient(180deg, rgba(147, 203, 255,1) -190%, #FFFFFF 24%);
       .title-line{
         height: 1vw;
         background-color: #b3d9ff;
@@ -188,10 +190,11 @@ const nowLiquid = computed(() => {
   }
 
   .home-right{
-    width: 36vw;
-    background: $gradient-color;
+    width: 32.8vw;
+    background: linear-gradient(180deg, rgba(147, 203, 255,1) -190%, #FFFFFF 24%);
     position: relative;
-    border-radius: 10px
+    border-radius: 10px;
+    box-shadow: 0 1px 5px 0 rgba(9, 39, 62, 0.15);
   }
   .el-button {
     background-color: #2892F3 !important;