feat: 完成70%全局样式与可读性优化

pages/records/r05-ritual-list.vue

@@ -38,7 +38,7 @@
           ><view
             ><text>{{ item.title }}</text
             ><text>{{ item.type }}{{ item.time ? ` · ${item.time}` : "" }}</text
-            ><text v-if="item.description">{{ item.description }}</text></view
+            ><text v-if="item.description" class="ceremony-card__description">{{ item.description }}</text></view
           ><text>{{ item.giftCount }} 笔献礼</text></view
         ></view
       >
@@ -117,7 +117,7 @@ onUnload(() => {
 </script>
 
 <style scoped lang="scss">
-@use "../../styles/adaptive-frame-profiles.scss" as adaptive;
+@import "../../styles/adaptive-frame-profiles.scss";
 .ritual-list-page {
   display: flex;
   min-height: 100vh;
@@ -133,7 +133,7 @@ onUnload(() => {
 }
 .state-card,
 .ceremony-card {
-  @include adaptive.adaptive-records-content;
+  @include adaptive-records-content;
 }
 .state-card {
   display: flex;
@@ -144,7 +144,7 @@ onUnload(() => {
   padding: 42rpx;
   text-align: center;
   color: $ink;
-  font-size: 28rpx;
+  font-size: clamp(16px, 28rpx, 20px);
 }
 .state-card .app-button {
   width: 100%;
@@ -173,20 +173,26 @@ onUnload(() => {
 .ceremony-card > view text:first-child {
   color: $ink;
   font-family: STKaiti, KaiTi, serif;
-  font-size: 30rpx;
+  font-size: clamp(17px, 30rpx, 22px);
   font-weight: 700;
   overflow-wrap: anywhere;
 }
 .ceremony-card > view text:not(:first-child) {
   margin-top: 7rpx;
   color: $ink-muted;
-  font-size: 21rpx;
+  font-size: clamp(13px, 21rpx, 16px);
   line-height: 1.45;
   overflow-wrap: anywhere;
 }
+.ceremony-card__description {
+  display: -webkit-box !important;
+  overflow: hidden;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+}
 .ceremony-card > text {
   flex: 0 0 auto;
   color: $brand-red;
-  font-size: 21rpx;
+  font-size: clamp(13px, 21rpx, 16px);
 }
 </style>