发布球局

src/pages/publishBall/index.module.scss

@@ -8,12 +8,28 @@
   &__scroll {
     height: calc(100vh - 120px);
     overflow: auto;
-    padding: 4px 16px 0 16px;
+    padding: 4px 16px 72px 16px;
     box-sizing: border-box;
   }
 
   &__content {
-    padding-bottom: 72px;
+  }
+  &__add{
+    margin-top: 2px;
+    border-radius: 12px;
+    border: 2px dashed rgba(22, 24, 35, 0.12);
+    display: flex;
+    width: 343px;
+    height: 60px;
+    justify-content: center;
+    align-items: center;
+    gap: 4px;
+    color: rgba(60, 60, 67, 0.50);
+    
+    &-icon{
+      width: 16px;
+      height: 16px;
+    }
   }
   .activity-type-switch{
     padding: 4px 16px 0 16px;
@@ -22,6 +38,60 @@
 
   }
 
+  // 场次标题行
+  .session-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 22px 4px;
+
+    .session-title {
+      font-size: 16px;
+      font-weight: 600;
+      color: theme.$primary-color;
+      display: flex;
+      align-items: center;
+      gap: 2px;
+    }
+    .session-delete {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 20px;
+      height: 20px;
+      &-icon {
+        width: 16px;
+        height: 16px;
+      }
+    }
+
+    .session-actions {
+      display: flex;
+      gap: 12px;
+    }
+
+    .session-action-btn {
+      border-radius: 8px;
+        border: 0.5px solid rgba(0, 0, 0, 0.16);
+        background: #000;
+        box-shadow: 0 8px 64px 0 rgba(0, 0, 0, 0.10);
+        backdrop-filter: blur(16px);
+        display: flex;
+        padding: 5px 8px;
+        justify-content: center;
+        align-items: center;
+        gap: 12px;
+        color: white;
+        font-size: 12px;
+        font-weight: 600;
+
+      .action-icon {
+        width: 14px;
+        height: 14px;
+      }
+    }
+  }
+
 
 
   // 标题区域 - 独立白色块
@@ -162,6 +232,75 @@
       font-weight: 500;
     }
   }
+
+  // 删除确认弹窗
+  .delete-modal {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(0, 0, 0, 0.5);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 10000;
+
+    &__content {
+      background: white;
+      border-radius: 16px;
+      padding: 24px;
+      margin: 0 32px;
+      max-width: 320px;
+      width: 100%;
+      text-align: center;
+    }
+
+    &__title {
+      display: block;
+      font-size: 18px;
+      font-weight: 600;
+      color: theme.$primary-color;
+      margin-bottom: 8px;
+    }
+
+    &__desc {
+      display: block;
+      font-size: 14px;
+      color: rgba(60, 60, 67, 0.6);
+      margin-bottom: 24px;
+    }
+
+    &__actions {
+      display: flex;
+      gap: 12px;
+
+      .delete-modal__btn {
+        flex: 1;
+        height: 44px;
+        border-radius: 12px;
+        font-size: 16px;
+        font-weight: 500;
+        border: none;
+        cursor: pointer;
+        transition: all 0.2s ease;
+
+        &:first-child {
+          background: rgba(0, 0, 0, 0.04);
+          color: rgba(60, 60, 67, 0.8);
+        }
+
+        &:last-child {
+          background: #FF3B30;
+          color: white;
+        }
+
+        &:hover {
+          opacity: 0.8;
+        }
+      }
+    }
+  }
 }
 
 // 旋转动画