一体机放大效果开发

pages/msglog/read.vue

@@ -90,26 +90,26 @@ defineExpose({ loadData });
     height: 100%;
 }
 .scrollmain{
-    padding: 28rpx
+    padding: 42rpx
 }
 .read{
 
 }
 .list-card
     background: #FFFFFF;
-    border-radius: 17rpx;
+    border-radius: 26rpx;
     display: flex;
     justify-content: flex-start;
     align-items: center;
-    padding: 26rpx 36rpx;
-    margin: 0 0 28rpx 0
+    padding: 39rpx 54rpx;
+    margin: 0 0 42rpx 0
     .card-img
-        width: 96rpx;
-        height: 96rpx;
+        width: 144rpx;
+        height: 144rpx;
         border-radius: 50%
         display: grid;
         place-items: center;
-        margin-right: 30rpx;
+        margin-right: 45rpx;
         position: relative;
         .card-img-flame
             width: 100%;
@@ -118,15 +118,15 @@ defineExpose({ loadData });
             position: absolute;
             right: 0;
             top: 0;
-            min-width: 26rpx;
-            height: 26rpx;
-            padding: 0 8rpx; /* 横向内边距控制宽度自适应 */
-            border-radius: 1000rpx; /* 实现椭圆形/圆角 */
+            min-width: 39rpx;
+            height: 39rpx;
+            padding: 0 12rpx; /* 横向内边距控制宽度自适应 */
+            border-radius: 1500rpx; /* 实现椭圆形/圆角 */
             text-align: center;
-            line-height: 26rpx;
+            line-height: 39rpx;
             background: #F73636;
             font-weight: 600;
-            font-size: 20rpx;
+            font-size: 30rpx;
             color: #FFFFFF;
             box-sizing: border-box;
     .card-info
@@ -136,7 +136,7 @@ defineExpose({ loadData });
         flex-direction: column;
         .info-title
             font-weight: 500;
-            font-size: 32rpx;
+            font-size: 48rpx;
             color: #333333;
             display: flex;
             justify-content: space-between;
@@ -145,15 +145,15 @@ defineExpose({ loadData });
                 font-family: 'PingFangSC-Medium', 'PingFang SC', 'Helvetica Neue', Helvetica, Arial, 'Microsoft YaHei', sans-serif;
             .card-time
                 font-weight: 400;
-                font-size: 28rpx;
+                font-size: 42rpx;
                 color: #AAAAAA;
                 height: 100%
-                margin: 4rpx;
+                margin: 6rpx;
         .info-text
             font-weight: 400;
-            font-size: 28rpx;
+            font-size: 42rpx;
             color: #6C7282;
-            margin-top: 4rpx;
+            margin-top: 6rpx;
 
 // 空状态样式
 .empty-state
@@ -161,19 +161,19 @@ defineExpose({ loadData });
     flex-direction: column;
     align-items: center;
     justify-content: center;
-    padding: 120rpx 40rpx;
+    padding: 180rpx 60rpx;
     .empty-icon
-        width: 200rpx;
-        height: 200rpx;
-        margin-bottom: 40rpx;
+        width: 300rpx;
+        height: 300rpx;
+        margin-bottom: 60rpx;
         opacity: 0.6;
     .empty-text
-        font-size: 32rpx;
+        font-size: 48rpx;
         color: #999999;
         font-weight: 500;
-        margin-bottom: 16rpx;
+        margin-bottom: 24rpx;
     .empty-desc
-        font-size: 28rpx;
+        font-size: 42rpx;
         color: #CCCCCC;
         font-weight: 400;
 </style>