.

pages/index/components/cover-view-tabbar.vue

@@ -9,6 +9,8 @@
       <cover-image class="tabbar-icon" :src="sheep.$url.cdn(item.iconUrl)" />
       <cover-view class="active-line" v-show="activeUrl === item.url" />
     </cover-view>
+
+    <cover-view class="top-line" />
   </cover-view>
 </template>
 
@@ -43,7 +45,20 @@
     z-index: 9999;
     padding-bottom: env(safe-area-inset-bottom);
     background: #fff;
-    border-top: 1px solid rgba(119, 119, 119, 0.25);
+    // border-top: 1px solid rgba(119, 119, 119, 0.25);
+
+    .top-line {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 200%;
+      height: 1px;
+      background: rgba(119, 119, 119, 0.25);
+      transform: scale(0.5);
+      transform-origin: 0 0;
+      pointer-events: none;
+      box-sizing: border-box;
+    }
 
     .cover-tabbar-item {
       width: 20%;

sheep/ui/su-tabbar/su-tabbar.vue

@@ -205,7 +205,8 @@
       flex-direction: column;
       background-color: #fff;
       // box-shadow: 0px -2px 4px 0px rgba(51, 51, 51, 0.06);
-      border-top: 1px solid rgba(119, 119, 119, 0.25);
+      // border-top: 1px solid rgba(119, 119, 119, 0.25);
+      position: relative;
 
       &__item-wrapper {
         height: 50px;
@@ -213,6 +214,20 @@
         justify-content: space-around;
         align-items: center;
       }
+
+      &::after {
+        content: '';
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 200%;
+        height: 200%;
+        border-top: 1px solid rgba(119, 119, 119, 0.25);
+        transform: scale(0.5);
+        transform-origin: 0 0;
+        pointer-events: none;
+        box-sizing: border-box;
+      }
     }
 
     .mid-tabbar {