feat: unify project responsive layouts

pages/genealogy/g08-join-application.vue

@@ -40,7 +40,7 @@
           <text>与家谱关系</text
           ><input
             v-model="form.relation"
-            placeholder="例如：汤正华堂侄"
+            placeholder="例如：某某某堂侄"
             placeholder-class="join-placeholder"
             @input="clearFieldError('relation')"
           />
@@ -49,7 +49,7 @@
           fieldErrors.relation
         }}</text>
         <text class="relation-help"
-          >请以家谱中一位已知长辈为参照，例如：汤正华堂侄</text
+          >请以家谱中一位已知长辈为参照，例如：某某某堂侄</text
         >
         <view class="join-field join-field--message">
           <text>{{ sourceContract.thirdFieldLabel }}</text
@@ -224,6 +224,7 @@ const completeFlow = () =>
 </script>
 
 <style scoped lang="scss">
+@use "../../styles/adaptive-frame-profiles.scss" as adaptive;
 .join-page {
   display: flex;
   min-height: 100vh;
@@ -234,14 +235,13 @@ const completeFlow = () =>
   z-index: 3;
 }
 .join-panel {
+  @include adaptive.adaptive-genealogy-state-panel;
   z-index: 2;
   width: calc(100% - 32rpx);
   min-height: min(590px, calc((100vw - 16px) * 1.337));
   margin: 22rpx auto 0;
   padding: 70rpx 8%;
   box-sizing: border-box;
-  background: url("/static/assets/modules/genealogy/transparent/g01-empty-panel-frame.png")
-    center / 100% 100% no-repeat;
 }
 .join-form {
   min-width: 0;
@@ -271,11 +271,10 @@ const completeFlow = () =>
   line-height: 1.6;
 }
 .join-field {
+  @include adaptive.adaptive-genealogy-form-field;
   display: grid;
   min-height: 92rpx;
   margin-top: 18rpx;
-  background: url("/static/assets/modules/genealogy/transparent/g-form-field-frame.png")
-    center / 100% 100% no-repeat;
 }
 .join-form__previous {
   display: block;