upp

src/views/PoemList.vue

@@ -15,7 +15,8 @@
     <div
       class="RWbox"
       :style="`width: ${domWidth}px; left:-${
-        baseRWboxLeft ? 500 : indexAc * pageWidth}px;
+        baseRWboxLeft ? 500 : indexAc * pageWidth
+      }px;
         `"
     >
       <div
@@ -87,12 +88,10 @@
     <div class="shandow-box" />
 
     <!-- 返回按钮 -->
-    <div class="RWback">
-      <BtnBack
-        class="button-back"
-        @click="btnBackFu"
-      />
-    </div>
+    <BtnBack
+      class="button-back"
+      @click="btnBackFu"
+    />
 
     <!-- 选择 时代 -->
     <div
@@ -136,7 +135,6 @@ import { useRouter } from "vue-router"
 import useSizeAdapt from "@/useFunctions/useSizeAdapt"
 import { arrList } from "./PoemList.js"
 
-
 import useMoveFu from "../moveFu"
 
 const { touchstart, touchmove, touchend } = useMoveFu()
@@ -742,34 +740,38 @@ const isMoveFu = (index, num) => {
     pointer-events: auto;
   }
   // 返回按钮
-  .RWback {
-    position: absolute;
-    z-index: 22;
-    left: 20px;
-    bottom: 20px;
-    width: 30px;
-    height: 30px;
-    border-radius: 50%;
-    // background-color: rgba(0, 0, 0, 0.5);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-  }
   .btn-back {
     position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-    max-width: 100%;
-    max-height: 100%;
+    z-index: 22;
+
+    left: calc(
+      17 / v-bind("windowSizeWhenDesignForRef") *
+        v-bind("windowSizeInCssForRef")
+    );
+    bottom: calc(
+      36 / v-bind("windowSizeWhenDesignForRef") *
+        v-bind("windowSizeInCssForRef")
+    );
+    width: calc(
+      30 / v-bind("windowSizeWhenDesignForRef") *
+        v-bind("windowSizeInCssForRef")
+    );
+    height: calc(
+      30 / v-bind("windowSizeWhenDesignForRef") *
+        v-bind("windowSizeInCssForRef")
+    );
   }
 
-  .shandow-box{
+  .shandow-box {
     width: 100%;
-    height:130px;
-    left:0;
-    background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%);
-    position:absolute;
+    height: 130px;
+    left: 0;
+    background: linear-gradient(
+      0deg,
+      rgba(0, 0, 0, 0.5) 0%,
+      rgba(0, 0, 0, 0) 100%
+    );
+    position: absolute;
     bottom: 0;
     z-index: 2;
   }