feat: match detail live room matching

uniapp/src/components/match-detail-header/match-detail-header.vue

@@ -6,7 +6,7 @@
             </view>
             <view class="detail-header__title-wrap">
                 <text class="detail-header__title">{{ title }}</text>
-                <text class="detail-header__subtitle">{{ subtitle }}</text>
+                <text v-if="subtitle" class="detail-header__subtitle">{{ subtitle }}</text>
             </view>
             <view class="detail-header__share" @tap="$emit('share')">
                 <u-icon name="share" size="36" color="#333"></u-icon>
@@ -32,29 +32,28 @@ defineEmits<{
 .detail-header {
     position: relative;
     overflow: hidden;
-    padding: 0 24rpx 16rpx;
+    padding: 0 24rpx;
     background: #fff;
     color: #333;
-    box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.06);
+    border-bottom: 1rpx solid #eef0f5;
 
     &__nav {
         position: relative;
         z-index: 1;
         display: flex;
         align-items: center;
-        gap: 12rpx;
-        height: 88rpx;
+        height: 96rpx;
     }
 
     &__back,
     &__share {
-        width: 64rpx;
-        height: 64rpx;
+        width: 72rpx;
+        height: 72rpx;
         display: flex;
         align-items: center;
         justify-content: center;
-        border-radius: 20rpx;
-        background: #f5f5f5;
+        border-radius: 50%;
+        background: transparent;
     }
 
     &__title-wrap {
@@ -64,14 +63,18 @@ defineEmits<{
         flex-direction: column;
         align-items: center;
         justify-content: center;
-        gap: 4rpx;
+        gap: 2rpx;
     }
 
     &__title {
-        font-size: 32rpx;
-        font-weight: 700;
-        color: #333;
+        max-width: 480rpx;
+        font-size: 38rpx;
+        font-weight: 800;
+        color: #0b1020;
         line-height: 1.2;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
     }
 
     &__subtitle {