调整弹性布局

src/components/abstract.vue

@@ -162,11 +162,8 @@ onActivated(async () => {
       <span>今日皮卡丘摘要</span><img src="@/assets/images/chat/star.webp" alt="" srcset="" />
     </div>
     <div class="list">
-      <div
-        :class="`item ${(abstractList || []).length === 1 ? 'singleItem' : ''}`"
-        v-for="(item, index) in abstractList || []"
-        :key="index"
-      >
+      <div :class="`item ${(abstractList || []).length === 1 ? 'singleItem' : ''}`"
+        v-for="(item, index) in abstractList || []" :key="index">
         <div>
           <img :src="item.icon" alt="" srcset="" v-if="(abstractList || []).length === 1" />
           <div>
@@ -174,19 +171,13 @@ onActivated(async () => {
               <img :src="item.icon" alt="" srcset="" v-if="(abstractList || []).length > 1" />
               <span>{{ item.title }}</span>
             </div>
-            <div
-              class="content"
-              :style="{ display: (abstractList || []).length > 2 ? 'block' : 'flex' }"
-            >
+            <div class="content" :style="{ display: (abstractList || []).length > 2 ? 'block' : 'flex' }">
               <div class="nums" :style="{ paddingTop: (abstractList || []).length > 1 ? '8rem' : '0rem' }">
                 <div class="num">
                   {{ item.num }}<span>{{ item.unit }}</span>
                 </div>
               </div>
-              <div
-                class="text"
-                :style="{ marginTop: (abstractList || []).length > 2 ? '8rem' : '0' }"
-              >
+              <div class="text" :style="{ marginTop: (abstractList || []).length > 2 ? '8rem' : '0' }">
                 {{ item.text }}
               </div>
             </div>
@@ -216,7 +207,7 @@ onActivated(async () => {
   backdrop-filter: blur(10rem);
   border-radius: 12rem;
 
-  > .title {
+  >.title {
     font-family: PingFang SC;
     font-size: 16rem;
     font-weight: 500;
@@ -228,6 +219,7 @@ onActivated(async () => {
     /* 样式描述：用于正文标题 */
     color: #17204d;
     margin-bottom: 4rem;
+
     img {
       margin-left: 4rem;
       width: 19.94px;
@@ -254,11 +246,13 @@ onActivated(async () => {
       background: #fcfdfd;
 
       box-shadow: 0rem 4rem 10rem 0rem #e7effd;
+
       img {
         width: 18rem;
         margin-right: 2rem;
         vertical-align: bottom;
       }
+
       .title {
         font-family: PingFang SC;
         font-size: 12rem;
@@ -325,9 +319,10 @@ onActivated(async () => {
         display: flex;
         align-items: center;
         color: #ffffff;
-        padding: 4rem 12rem;
+        // padding: 4rem 12rem;
         height: 28rem;
         cursor: pointer;
+        justify-content: center;
       }
     }
 
@@ -337,8 +332,9 @@ onActivated(async () => {
       justify-content: space-between;
       align-items: center;
 
-      > div {
+      >div {
         display: flex;
+
         img {
           width: 28rem;
           height: 28rem;
@@ -346,6 +342,7 @@ onActivated(async () => {
           margin-right: 8rem;
           align-self: center;
         }
+
         .title {
           font-family: PingFang SC;
           font-size: 14rem;