Review changes batch 6 of 6

components/GenealogyCard.vue

@@ -34,6 +34,9 @@
         </view>
       </view>
       <view class="card-detail-row">
+        <view class="card-updated">
+          <text>更新于 {{ genealogy.updatedAt }}</text>
+        </view>
         <view class="card-metas">
           <view class="card-meta-item">
             <image
@@ -52,9 +55,6 @@
             <text class="card-meta">{{ genealogy.memberCount }} 位成员</text>
           </view>
         </view>
-        <view class="card-updated">
-          <text>更新于 {{ genealogy.updatedAt }}</text>
-        </view>
       </view>
     </view>
   </view>
@@ -73,7 +73,7 @@ defineEmits(["select"]);
 .genealogy-card {
   position: relative;
   display: flex;
-  min-height: 156rpx;
+  min-height: 178rpx;
   align-items: center;
   padding: 18rpx 24rpx;
   box-sizing: border-box;
@@ -177,25 +177,34 @@ defineEmits(["select"]);
 .card-detail-row {
   display: flex;
   min-width: 0;
+  flex-wrap: wrap;
   align-items: center;
   justify-content: space-between;
-  margin-top: 12rpx;
+  margin-top: 8rpx;
 }
 .card-metas {
   display: flex;
   min-width: 0;
+  width: 100%;
   align-items: center;
+  margin-top: 2rpx;
 }
 .card-meta-item {
   display: flex;
   min-width: 0;
   align-items: center;
-  margin-right: 14rpx;
+  margin-right: 0;
+}
+.card-meta-item + .card-meta-item {
+  margin-left: 18rpx;
 }
 .card-meta-icon {
-  width: 28rpx;
-  height: 28rpx;
+  width: 46rpx;
+  height: 46rpx;
+  flex: 0 0 auto;
   margin-right: 6rpx;
+  opacity: 1;
+  filter: saturate(1.35) brightness(0.82) contrast(1.15);
 }
 .card-meta {
   color: #62584c;
@@ -204,9 +213,12 @@ defineEmits(["select"]);
 }
 .card-updated {
   display: flex;
+  width: 100%;
   flex: 0 0 auto;
   align-items: center;
-  margin-left: 10rpx;
+  justify-content: flex-end;
+  margin-top: 0;
+  margin-left: 0;
   color: #62584c;
   font-size: 24rpx;
   font-weight: 500;