src/app/tab1/tab1.page.html

@@ -1,5 +1,9 @@
+html
 <ion-header [translucent]="true">
   <ion-toolbar>
+    <ion-buttons slot="start">
+      <div></div>
+    </ion-buttons>
     <ion-title>
       聊天
     </ion-title>
@@ -55,9 +59,14 @@
         </div>
       </ion-col>
     </ion-row>
+    <div class="circles">
+      <div class="circle"></div>
+      <div class="circle"></div>
+      <div class="circle"></div>
+    </div>
     <ion-row>
       <ion-col size="12">
-        <img src="assets/images/oldman.png" alt="Example Image">
+        <img src="assets/images/oldman.png" alt="Footer Image" class="footer-image"/>
       </ion-col>
     </ion-row>
   </ion-grid>

src/app/tab1/tab1.page.scss

@@ -54,4 +54,63 @@
       margin-top: 20px;
       border-radius: 10px;
     }
+  }ion-header {
+    ion-toolbar {
+      display: flex;
+      justify-content: center;
+      position: relative;
+  
+      ion-buttons {
+        position: absolute;
+        &.slot-start {
+          left: 0;
+        }
+        &.slot-end {
+          right: 0;
+        }
+      }
+  
+      ion-title {
+        text-align: center;
+        flex: 1;
+      }
+    }
+  }
+
+
+
+  
+  .circles {
+    display: flex;
+    justify-content: center;
+    margin-top: 20px;
+    
+    .circle {
+      width: 20px;
+      height: 20px;
+      background-color: #000;
+      border-radius: 50%;
+      margin: 0 10px;
+      animation: pulse 2s infinite;
+    }
+  
+    .circle:nth-child(2) {
+      animation-delay: 0.4s;
+    }
+  
+    .circle:nth-child(3) {
+      animation-delay: 0.8s;
+    }
+  }
+  
+  @keyframes pulse {
+    0% {
+      transform: scale(1);
+    }
+    50% {
+      transform: scale(1.5);
+    }
+    100% {
+      transform: scale(1);
+    }
   }

src/app/tab3/news/news.component.ts

@@ -8,21 +8,21 @@ import { Component, OnInit } from '@angular/core';
 export class NewsComponent implements OnInit {
   newsList = [
     {
-      title: '重大新闻标题1',
-      summary: '这是新闻摘要1。这是一个简短的新闻描述。',
-      image: 'assets/news1.jpg',
+      title: '中央军委举行晋升上将军衔仪式 习近平颁发命令状并向晋衔的军官表示祝贺',
+      summary: '中央军委晋升上将军衔仪式9日在北京八一大楼举行。中央军委主席习近平出席晋衔仪式。',
+      image: 'assets/images/new1.jpg',
       date: new Date(),
     },
     {
-      title: '重大新闻标题2',
-      summary: '这是新闻摘要2。这是一个简短的新闻描述。',
-      image: 'assets/news2.jpg',
+      title: '洞庭湖全线退出警戒水位',
+      summary: '记者获悉，7月10日6时，洞庭湖流域最后一个超警水文站点——岳阳站水位退至警戒水位32.5米以下并继续回落，标志着洞庭湖流域全线整体退出警戒水位',
+      image: 'assets/images/new2.jpg',
       date: new Date(),
     },
     {
-      title: '重大新闻标题3',
-      summary: '这是新闻摘要3。这是一个简短的新闻描述。',
-      image: 'assets/news3.jpg',
+      title: '高考后的心理创伤如何疗愈',
+      summary: '“高考考砸了，我的人生是不是没有必要继续了？”',
+      image: 'assets/images/new3.jpg',
       date: new Date(),
     },
     // Add more news items as needed

src/app/tab3/tab3.page.html

@@ -19,4 +19,10 @@
       <ion-label>摇一摇</ion-label>
     </ion-item>
   </ion-list>
+
+  <ion-row>
+    <ion-col size="12">
+      <img src="assets/images/old3.png" alt="Footer Image" class="footer-image"/>
+    </ion-col>
+  </ion-row>
 </ion-content>

src/app/tab3/tab3.page.scss

@@ -25,4 +25,6 @@ ion-item {
   
   ion-item:hover {
     transform: scale(1.1);
-  }
+  }
+  ion-content {
+    --background: linear-gradient(to bottom, #FFD700, #FFE5B4); /* 舒适的金色背景 */}

src/modules/user/mine/mine.page.scss

@@ -0,0 +1,2 @@
+ion-content {
+    --background: linear-gradient(to bottom, #FFD700, #FFE5B4); /* 舒适的金色背景 */}