頁面修正

mobile/index.html

@@ -93,7 +93,7 @@
 
     <div id="menu-box" class="container-fluid" style="padding:0;margin:0 ">
         <div id="menu-box2">
-            <div id="menu1" class="menu-text"><a style="letter-spacing: 5px;" href="https://hhh.com.tw/">首頁</a>
+            <div id="menu1" class="menu-text"><a style="letter-spacing: 5px; padding-top: 3vw;" href="https://hhh.com.tw/">首頁</a>
                 <div class="menu-text"><a class="link" data-gt-target="#contact-us" data-gt-duration="800"
                         data-gt-offset="-300">我有裝修需求</a></div>
                 <div class="menu-text"><a class="link" data-gt-target="#feedback" data-gt-duration="500"

mobile/style.css

@@ -929,13 +929,13 @@ body .arrow:hover {
 
 @media screen and (max-width: 767px) {
   #menu-box {
-    height: 45vh;
+    height: 47vh;
   }
 }
 
 @media screen and (max-width: 350px) {
   #menu-box {
-    height: 50vh;
+    height: 55vh;
   }
 }
 
@@ -963,7 +963,7 @@ body .arrow:hover {
 
 @media screen and (max-width: 350px) {
   #menu-box #menu-box2 {
-    height: 50vh;
+    height: 55vh;
   }
 }
 
@@ -987,6 +987,13 @@ body .arrow:hover {
           filter: invert(34%) sepia(7%) saturate(1111%) hue-rotate(347deg) brightness(98%) contrast(88%);
 }
 
+@media screen and (max-width: 767px) {
+  #menu-box #menu-box2 .menu-logo img {
+    width: 35px;
+    height: 35px;
+  }
+}
+
 @media screen and (max-width: 350px) {
   #menu-box #menu-box2 .menu-logo img {
     width: 35px;
@@ -1000,11 +1007,12 @@ body .arrow:hover {
   color: #65584c;
   font-size: 16px;
   margin-top: 20px;
+  font-weight: 900;
 }
 
-@media screen and (max-width: 350px) {
+@media screen and (max-width: 767px) {
   #menu-box #menu-box2 a {
-    margin-top: 10px;
+    margin-top: 4vw;
   }
 }
 
@@ -1013,4 +1021,10 @@ body .arrow:hover {
   text-align: center;
   margin-bottom: 10px;
 }
+
+@media screen and (max-width: 767px) {
+  #menu-box #menu-box2 .menu-text {
+    margin-bottom: 5px !important;
+  }
+}
 /*# sourceMappingURL=style.css.map */

mobile/style.scss

@@ -705,10 +705,10 @@ body {
     z-index: 5;
     overflow: hidden;
     @media screen and(max-width:$moblie) {
-        height: 45vh;
+        height: 47vh;
     }
     @media screen and(max-width:350px) {
-        height: 50vh;
+        height: 55vh;
     }
 
 
@@ -731,7 +731,7 @@ body {
             height: 45vh;
         }
         @media screen and(max-width:350px) {
-            height: 50vh;
+            height: 55vh;
         }
     
         #menu-link {
@@ -739,6 +739,7 @@ body {
             grid-template-columns: repeat(3, 1fr);
             width: 80vw;
             margin: 0 auto;
+           
         }
         .menu-logo {
             opacity: 1;
@@ -746,6 +747,10 @@ body {
                 width: 40px;
                 height: 40px;
                 filter: invert(34%) sepia(7%) saturate(1111%) hue-rotate(347deg) brightness(98%) contrast(88%);
+                @media screen and(max-width:$moblie) {
+                    width: 35px;
+                    height: 35px;
+                }
                 @media screen and(max-width:350px) {
                     width: 35px;
                     height: 35px;
@@ -759,15 +764,21 @@ body {
             color: #65584c;
             font-size: 16px;
             margin-top: 20px;
-            @media screen and(max-width:350px) {
-                margin-top: 10px;
+            font-weight: 900;
+            @media screen and(max-width:$moblie) {
+                margin-top: 4vw;
             }
+           
         }
 
         .menu-text {
             width: 100vw;
             text-align: center;
             margin-bottom: 10px;
+            @media screen and(max-width:$moblie) {
+                margin-bottom: 5px !important;
+            }
+            
         }
     }
 }