[edit][ui高度]

src/view/iframe/treasure-hunt/components/dialog.vue

@@ -25,7 +25,7 @@ const clickBtn = () => {
 <style lang="scss" scoped>
 .content {
     width: 375px;
-    height: 500px;
+    height: 100%;
     display: flex;
     align-items: center;
     justify-content: center;
@@ -39,7 +39,7 @@ const clickBtn = () => {
         opacity: .9;
         position: fixed;
         width: 375px;
-        height: 500px;
+        height: 100%;
     }
 
     .dialog {

src/view/iframe/treasure-hunt/components/open-box.vue

@@ -50,7 +50,7 @@ const clickBtn = () => {
     .content {
         z-index: 2;
         width: 375px;
-        height: 500px;
+        height: 580px;
         text-align: center;
         position: relative;
 
@@ -62,7 +62,7 @@ const clickBtn = () => {
         }
 
         img {
-            margin-top: 15px;
+            margin-top: 75px;
             width: 250px;
             height: 250px;
             animation: show 0.5s;
@@ -70,7 +70,7 @@ const clickBtn = () => {
 
         .mark {
             position: absolute;
-            top: 246px;
+            top: 300px;
             width: 375px;
 
             p {

src/view/iframe/treasure-hunt/cover.vue

@@ -42,8 +42,10 @@
             <img :src="require('@/assets/svg/icon-three-line.svg')" alt="" />
             <span>to Hunt Treasure</span>
         </div>
-        <v-btn :txt="state.open_btn.txt" :font-size="'17px'" :icon="true" :disabled="false" @onClick="clickBtn"
-            :loading="state.btn_loading"></v-btn>
+        <div class="footer">
+            <v-btn :txt="state.open_btn.txt" :font-size="'17px'" :icon="true" :disabled="false" @onClick="clickBtn"
+                :loading="state.btn_loading"></v-btn>
+        </div>
     </div>
 
 </template>
@@ -392,8 +394,9 @@ const getUsersFollowStatus = () => {
 </script>
 <style lang="scss" scoped>
 .cover {
+    position: relative;
     width: 375px;
-    height: 500px;
+    height: 580px;
     background: linear-gradient(179.96deg, #25180D 38.82%, #5E4025 55.4%, #876635 61.6%, #24180C 71.59%);
     border-radius: 20px;
 
@@ -418,7 +421,7 @@ const getUsersFollowStatus = () => {
     }
 
     .waring {
-        margin-top: 54px;
+        margin-top: 94px;
         font-weight: 900;
         font-size: 34px;
         color: #FFFFFF;
@@ -433,7 +436,7 @@ const getUsersFollowStatus = () => {
 
     .in-invite {
         height: 28px;
-        margin-top: 20px;
+        margin-top: 30px;
         margin-bottom: 10px;
     }
 
@@ -541,6 +544,9 @@ const getUsersFollowStatus = () => {
 
     .box {
         text-align: center;
+        position: absolute;
+        width: 100%;
+        bottom: 155px;
 
         img {
             width: 160px;
@@ -550,14 +556,15 @@ const getUsersFollowStatus = () => {
     }
 
     .mark {
+        position: absolute;
+        bottom: 84px;
         display: flex;
         align-items: center;
         justify-content: center;
-        margin-top: 24px;
-        margin-bottom: 15px;
+        width: 100%;
 
         img {
-          margin-right: 9px;
+            margin-right: 9px;
         }
 
         span {
@@ -569,5 +576,10 @@ const getUsersFollowStatus = () => {
         }
     }
 
+    .footer {
+        width: 100%;
+        position: absolute;
+        bottom: 16px;
+    }
 }
 </style>

src/view/iframe/treasure-hunt/index.vue

@@ -345,14 +345,18 @@ body {
         z-index: 222;
         text-align: center;
         width: 375px;
-        height: 500px;
+        height: 580px;
         position: fixed;
         top: 0;
         left: 0;
         user-select: none;
 
         img {
-            margin-top: 172px;
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            margin-top: -65px;
+            margin-left: -65px;
             width: 130px;
             height: 130px;
         }