From 80a18660238fd9e3fa1cf6dc7611057897e5fd25 Mon Sep 17 00:00:00 2001
From: xya-526 <468422680@qq.com>
Date: Wed, 21 May 2025 13:11:37 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E7=BB=86=E8=8A=82=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/SeclectBox.vue        | 14 ++++-
 src/components/UnAeraButton.vue      |  8 +--
 src/components/UniversalButton.vue   |  1 +
 src/components/cartBoxTowContent.vue | 23 ++++++--
 src/components/ecologyTitle.vue      | 87 +++++++++++++++-------------
 5 files changed, 80 insertions(+), 53 deletions(-)

diff --git a/src/components/SeclectBox.vue b/src/components/SeclectBox.vue
index 1e8bf25..309e386 100644
--- a/src/components/SeclectBox.vue
+++ b/src/components/SeclectBox.vue
@@ -30,7 +30,15 @@ const selectArray = ['显示行政区划', '2413', '660', '主要交通路网',
     align-items: center;
     justify-content: space-between;
     #box {
-         font-size:2.4rem;
+        line-height: 2.4rem;
+       span{
+height: 2.4rem;
+text-align: center;
+line-height: 2.4rem;
+       }
+
+        font-size:2.4rem;
+        display: flex;
         width: 100%;
         height: 2.4rem;
     }
@@ -44,8 +52,8 @@ const selectArray = ['显示行政区划', '2413', '660', '主要交通路网',
         appearance: none;
         margin-right: 1rem;
         margin-left: 3.6rem;
-        width:2.15rem;
-        height: 2.15rem;
+        width:2.4rem;
+        height: 2.4rem;
         background-color: transparent;
         border: #58896CFF 0.1rem solid;
     }
diff --git a/src/components/UnAeraButton.vue b/src/components/UnAeraButton.vue
index 8a82d4d..0a607aa 100644
--- a/src/components/UnAeraButton.vue
+++ b/src/components/UnAeraButton.vue
@@ -88,6 +88,7 @@ let x = defineProps({
 </script>
 <style scoped>
 button {
+
   border: none;
   background-position: center;
   background-repeat: no-repeat;
@@ -99,7 +100,7 @@ button {
   border: none;
   cursor: pointer;
   text-align: center;
-
+  line-height:7.7rem;
   span {
     display: block;
   }
@@ -111,8 +112,5 @@ button {
   }
 }
 
-img {
-  width: 100%;
-  height: 100%;
-}
+
 </style>
diff --git a/src/components/UniversalButton.vue b/src/components/UniversalButton.vue
index 7d459b0..08b1458 100644
--- a/src/components/UniversalButton.vue
+++ b/src/components/UniversalButton.vue
@@ -1,5 +1,6 @@
 <template>
     <button :style="{
+        lineHeight:height,
         justifyContent: justifyContent,
         fontSize: Font_size,
         width,
diff --git a/src/components/cartBoxTowContent.vue b/src/components/cartBoxTowContent.vue
index 83af9bf..cecc490 100644
--- a/src/components/cartBoxTowContent.vue
+++ b/src/components/cartBoxTowContent.vue
@@ -17,9 +17,9 @@
     <div class="text">
       <p>{{ text }}</p>
       <div id="count">
-        <span>{{ Math.floor(count / 10) }}</span>
-        <span>{{ count % 10 }}</span>
-        <div>个</div>
+       <footer> <div class="bg"><span>{{ Math.floor(count / 10) }}</span></div></footer>
+        <footer><div class="bg"><span>{{ count % 10 }}</span></div></footer>
+        <h6>个</h6>
       </div>
     </div>
   </div>
@@ -125,7 +125,7 @@ defineProps({
         height: 100%;
 
         span {
-            background-image: linear-gradient(180deg, #f7ff8d 0%, #99cfb5 100%);
+            background: linear-gradient(180deg, #f7ff8d 0%, #99cfb5 100%);
             background-clip: text;
             -webkit-background-clip: text;
             -webkit-text-fill-color: transparent;
@@ -139,12 +139,23 @@ defineProps({
             display: block;
         }
 
-        div {
+        h6{
             align-self: flex-end;
             color: #FFFFFF;
             font-size: 1rem;
-            margin-right: 1%;
+            margin-left: 1rem;
         }
     }
 }
+
+footer{
+  padding:0.2rem;
+background: linear-gradient(180deg, #f7ff8d 0%, #99cfb5 100%);
+border-radius: 5px;
+}
+.bg{
+border-radius: 5px;
+  background-color: #142222;
+
+}
 </style>
\ No newline at end of file
diff --git a/src/components/ecologyTitle.vue b/src/components/ecologyTitle.vue
index 53498c7..edbe35f 100644
--- a/src/components/ecologyTitle.vue
+++ b/src/components/ecologyTitle.vue
@@ -1,41 +1,36 @@
 <script setup>
 const props = defineProps({
-  data:{
-    type:Object,
-    default:()=>{}
+  data: {
+    type: Object,
+    default: () => { }
   },
-  width:{
-    type:String,
-    default:'80%'
+  width: {
+    type: String,
+    default: '80%'
   },
-  height:{
-    type:String,
-    default:'80%'
+  height: {
+    type: String,
+    default: '80%'
   }
 })
 </script>
 
 <template>
-  <div
-    class="ecologyTitle"
-    :style="{width:props.width,height:props.height}"
-  >
-    <div
-      v-for="item in props.data"
-      :key= "item.id"
-      class="container"
-    >
+  <div class="ecologyTitle" :style="{ width: props.width, height: props.height }">
+    <div v-for="item in props.data" :key="item.id" class="container">
       <div class="titleBox">
         <div class="icon" />
         <div class="title">
-          {{item.title}}
+          {{ item.title }}
+        </div>
+      </div>
+
+      <div class="main">
+        <div class="title2" v-for="iten in item?.space" :key="iten.id">
+           <span class="title1">{{ iten.title }}</span> 
         </div>
       </div>
-   
-    <div class="main">
-      <div class="title1" v-for="iten in item?.space" :key="iten.id">{{iten.title}}</div>
     </div>
-   </div>
   </div>
 </template>
 
@@ -48,6 +43,7 @@ const props = defineProps({
   padding: 1.999rem;
   font-size: 1.6rem;
   color: #fff;
+
   .container {
     width: 100%;
     height: 50%;
@@ -58,20 +54,23 @@ const props = defineProps({
   }
 
 }
-.titleBox{
+
+.titleBox {
   display: flex;
   width: 100%;
   height: 10%;
   /* justify-content: center; */
   align-items: center;
-  .icon{
-      width: 0.6rem;
-      height: 0.6rem;
-      background-color: rgb(244, 186, 78);
-      border-radius: 50%;
-      margin-right: 0.9rem;
+
+  .icon {
+    width: 0.6rem;
+    height: 0.6rem;
+    background-color: rgb(244, 186, 78);
+    border-radius: 50%;
+    margin-right: 0.9rem;
   }
-  .title{
+
+  .title {
     width: 14.799rem;
     height: 1.8rem;
     border-radius: 0.9rem;
@@ -81,23 +80,33 @@ const props = defineProps({
     padding-left: 1rem;
   }
 }
-.main{
+
+.main {
+  margin-left: 1rem ;
   width: 80%;
   height: 20%;
   display: flex;
-  justify-content: center;
+  justify-content: start;
   align-items: center;
-  .title1{
-    border:1px transparent solid;
-    width: 9rem;          
+   .title2 {
+    padding: 0.3rem;
+    width: 9rem;
     height: 3.6rem;
-    border-radius: 1.75rem;
+    border-radius: 17.5px;
+    background: linear-gradient(to right, #b8b7b7 0%, transparent 100%);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    .title1 {
+    width: 9rem;
+    height: 3.6rem;
+    border-radius: 17.5px;
     opacity: 1;
     background: linear-gradient(270deg, #73737300 0%, #366543 100%);
     display: flex;
-    justify-content: center;
+     justify-content: center;
     align-items: center;
-    /* border-image:linear-gradient(to right #94AEA3 0%, transparent 100%) 1;  */
   }
 }
+}
 </style>

From ae798952e9f206d03692a5ff29349608f111a80b Mon Sep 17 00:00:00 2001
From: xya-526 <468422680@qq.com>
Date: Wed, 21 May 2025 13:30:34 +0800
Subject: [PATCH 2/2] =?UTF-8?q?=E7=BB=86=E8=8A=82=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/style.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/style.css b/src/style.css
index 97e3d39..983d672 100644
--- a/src/style.css
+++ b/src/style.css
@@ -15,7 +15,7 @@
   --border-default: rgba(255, 255, 255, 0.3);
   --border-light: rgba(255, 255, 255, 0.1);
   --border-active: rgba(255, 255, 255, 0.3);
-  --border-radius: 8px;
+  --border-radius:0.8rem;
 
   /* 图表颜色 */
   --chart-green-normal: #275b38;