upp

src/views/PaintingDetail.vue

@@ -395,7 +395,7 @@ function showBigPainting() {
     position: absolute;
     left: 50%;
     top: calc(
-      15 / v-bind("windowSizeWhenDesignForRef") *
+      30 / v-bind("windowSizeWhenDesignForRef") *
         v-bind("windowSizeInCssForRef")
     );
     transform: translate(-50%, 0);
@@ -491,10 +491,10 @@ function showBigPainting() {
         v-bind("windowSizeInCssForRef")
     );
     height: calc(
-      180 / v-bind("windowSizeWhenDesignForRef") *
+      150 / v-bind("windowSizeWhenDesignForRef") *
         v-bind("windowSizeInCssForRef")
     );
-    overflow: auto;
+    // overflow: auto;
     transition: height 2s ease;
 
     .info-title-content {
@@ -709,6 +709,7 @@ function showBigPainting() {
     // }
   }
   > .desc-text-up {
+    overflow: auto;
     height: calc(
       360 / v-bind("windowSizeWhenDesignForRef") *
         v-bind("windowSizeInCssForRef")
@@ -775,6 +776,7 @@ function showBigPainting() {
   #painting-wrap-id {
     height: 100vw !important;
     left: 50% !important;
+    top: 12%;
     // transform: translate(-50%, 0) rotate(-90deg) scale(0.6) !important;
     .myRowBoxImg {
       height: 100%;
@@ -806,5 +808,17 @@ function showBigPainting() {
       overflow: visible;
     }
   }
+  .desc-text {
+    height: calc(
+      230 / v-bind("windowSizeWhenDesignForRef") *
+        v-bind("windowSizeInCssForRef")
+    );
+  }
+  .desc-text-up{
+    height: calc(
+      360 / v-bind("windowSizeWhenDesignForRef") *
+        v-bind("windowSizeInCssForRef")
+    );
+  }
 }
 </style>