feat: ui update

miniprogram/pages/closet-share-detail/closet-share-detail.wxss

@@ -1,7 +1,9 @@
-.detail-page {
+/** 衣柜分享详情：分享者行 + 只读网格 + 悬浮玻璃操作条 **/
+.page-flex {
   height: 100vh;
   display: flex;
   flex-direction: column;
+  overflow: hidden;
 }
 
 .scroll-body {
@@ -9,129 +11,65 @@
   height: 0;
 }
 
-.owner-card {
-  margin: 24rpx;
+.csd-owner {
   display: flex;
   align-items: center;
+  gap: 24rpx;
+  padding: 40rpx var(--pad) 0;
 }
 
-.avatar {
-  width: 96rpx;
-  height: 96rpx;
+.csd-av {
+  width: 72rpx;
+  height: 72rpx;
   border-radius: 50%;
-  background: #F2F2F7;
+  background: var(--paper-3);
+  color: var(--ink-3);
   overflow: hidden;
   display: flex;
   align-items: center;
   justify-content: center;
-  color: #C7C7CC;
   flex-shrink: 0;
 }
 
-.avatar-img {
+.csd-av .pic {
   width: 100%;
   height: 100%;
 }
 
-.avatar-placeholder {
-  width: 56rpx;
-  height: 56rpx;
+.csd-av .icon {
+  width: 36rpx;
+  height: 36rpx;
 }
 
-.owner-info {
-  margin-left: 24rpx;
+.csd-owner-body {
+  min-width: 0;
 }
 
-.owner-name {
-  font-size: 30rpx;
-  font-weight: 600;
-  color: #000;
+.csd-owner-n {
+  font-size: 27rpx;
+  color: var(--ink);
 }
 
-.owner-expire {
-  font-size: 24rpx;
-  color: #8E8E93;
-  margin-top: 8rpx;
-}
-
-.grid {
-  display: flex;
-  flex-wrap: wrap;
-  padding: 0 24rpx;
-  gap: 24rpx;
-}
-
-.grid-item {
-  width: calc(50% - 12rpx);
-  box-sizing: border-box;
-}
-
-.clothes-card {
-  background: #fff;
-  border-radius: 32rpx;
-  padding: 20rpx;
-  box-sizing: border-box;
-}
-
-.clothes-img {
-  width: 100%;
-  aspect-ratio: 1;
-  border-radius: 24rpx;
-  background: #F2F2F7;
-}
-
-.clothes-placeholder {
-  width: 100%;
-  aspect-ratio: 1;
-  border-radius: 24rpx;
-  background: #F2F2F7;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: #C7C7CC;
-}
-
-.clothes-placeholder .icon {
-  width: 72rpx;
-  height: 72rpx;
-}
-
-.clothes-name {
-  font-size: 26rpx;
-  font-weight: 500;
-  color: #1C1C1E;
-  margin-top: 12rpx;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.clothes-sub {
+.csd-owner-e {
+  margin-top: 6rpx;
   font-size: 22rpx;
-  color: #8E8E93;
-  margin-top: 4rpx;
+  color: var(--ink-3);
 }
 
-.share-btn {
-  margin: 32rpx 24rpx 0;
-  height: 88rpx;
-  line-height: 88rpx;
-  font-size: 30rpx;
-  font-weight: 500;
-  color: var(--color-primary, #000);
-  background: #fff;
-  border-radius: 24rpx;
+.csd-grid {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 44rpx 26rpx;
+  padding: 56rpx var(--pad) 0;
 }
 
-.share-btn::after {
-  border: none;
+.csd-tile {
+  display: block;
+  width: 100%;
 }
 
-.cancel-btn {
+.csd-cancel {
+  display: block;
   text-align: center;
-  padding: 32rpx 0;
-}
-
-.footer-space {
-  height: 40rpx;
+  padding: 8rpx 0 28rpx;
 }