修该关注页

src/user_pages/follow/index.scss

@@ -1,8 +1,9 @@
 // 球友关注页面样式
 .follow_page {
   min-height: 100vh;
-  background: #FAFAFA;
-  
+  display: flex;
+  flex-direction: column;
+
   // 导航栏内容
   .navbar_content {
     display: flex;
@@ -10,7 +11,7 @@
     align-items: center;
     width: 100%;
     height: 44px;
-    
+
     .navbar_back {
       display: flex;
       align-items: center;
@@ -18,15 +19,15 @@
       width: 32px;
       height: 32px;
       margin-left: 10px;
-      
+
       .back_icon {
-        width: 8px;
         height: 16px;
-        background: url("data:image/svg+xml,%3Csvg width='8' height='16' viewBox='0 0 8 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.66667 2L1.33333 8L6.66667 14' stroke='%23000000' stroke-width='2.66667' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center;
+        width: 8px;
+        background: url("../../static/userInfo/back_icon.svg") no-repeat center;
         background-size: contain;
       }
     }
-    
+
     .navbar_title {
       font-family: PingFang SC;
       font-weight: 600;
@@ -37,7 +38,7 @@
       position: absolute;
       left: 50px;
     }
-    
+
     .navbar_action {
       display: flex;
       align-items: center;
@@ -45,7 +46,7 @@
       width: 83px;
       height: 30px;
       margin-right: 7px;
-      
+
       .action_icon {
         width: 20px;
         height: 20px;
@@ -54,7 +55,7 @@
       }
     }
   }
-  
+
   // 标签页导航
   .tab_navigation {
     display: flex;
@@ -64,9 +65,14 @@
     background: #ffffff;
     height: 44px;
     overflow-x: auto;
-    margin-top: 110px;
-    
-    
+    position: fixed;
+    top: 110px;
+    left: 0;
+    right: 0;
+    z-index: 100;
+    flex-shrink: 0;
+
+
     .tab_item {
       display: flex;
       align-items: center;
@@ -75,7 +81,7 @@
       position: relative;
       flex-shrink: 0;
       min-width: fit-content;
-      
+
       .tab_text {
         font-family: PingFang SC;
         font-weight: 400;
@@ -85,24 +91,24 @@
         color: rgba(0, 0, 0, 0.5);
         transition: all 0.2s ease;
         white-space: nowrap;
-        
+
         // 小屏幕适配
         @media (max-width: 375px) {
           font-size: 13px;
         }
       }
-      
+
       // 推荐图标
       .recommend_icon {
         .icon_container {
           width: 10px;
           height: 10px;
           position: relative;
-          
+
           .star_icon {
             width: 100%;
             height: 100%;
-            
+
             &::before {
               content: '';
               position: absolute;
@@ -116,7 +122,7 @@
           }
         }
       }
-      
+
       // 激活状态
       &.active {
         /* 添加调试背景色 */
@@ -124,31 +130,36 @@
         .tab_text {
           font-weight: 600 !important;
           color: #000000 !important;
-        }
-        
-        // 下边框
-        &::after {
-          content: '';
-          position: absolute;
-          bottom: 0;
-          left: 0;
-          right: 0;
-          height: 2px;
-          background: #000000 !important;
-          z-index: 1;
+          position: relative;
+          
+          // 下边框只应用在文字上
+          &::after {
+            content: '';
+            position: absolute;
+            bottom: -8px; // 调整距离文字底部的位置
+            left: 0;
+            right: 0;
+            height: 2px;
+            background: #000000 !important;
+            z-index: 1;
+          }
         }
       }
-      
+
       // 移除默认的粉丝标签激活样式，完全依赖 active 类
     }
   }
-  
+
   // 用户列表容器
   .user_list_container {
-    flex: 1;
-    margin-top: 12px;
+    position: absolute;
+    top: 154px; // 110px(导航栏高度) + 44px(tab导航高度)
+    left: 0;
+    right: 0;
+    bottom: 0;
     background: #ffffff;
-    
+    overflow-y: auto;
+
     // 加载状态提示
     .loading_tip,
     .empty_tip,
@@ -157,7 +168,7 @@
       justify-content: center;
       align-items: center;
       padding: 40px 20px;
-      
+
       text {
         font-family: PingFang SC;
         font-weight: 400;
@@ -165,11 +176,11 @@
         color: rgba(0, 0, 0, 0.5);
       }
     }
-    
+
     .empty_tip {
       padding: 80px 20px;
     }
-    
+
     .load_more_tip {
       padding: 20px;
     }