Merge branch 'master' of http://git.choozmo.com:3000/choozmo/HHH_Home_Decoration_2

desktop11/index.html

@@ -429,8 +429,8 @@
 
                         <div id="form-right">
                             <div id="fb_login">
-                                <button id="fb-button"  ><img src="./img/logo/facebook.png" alt="">
-                                    <p><span style="padding-right:3.5vw; color:#9B9B9B ;font-size: 28px;">｜</span>使用fb填入信箱與姓名</p>
+                                <button id="fb-button"><img src="./img/logo/facebook.png" alt="">
+                                   <span id="line" style=" font-size: 30px;">｜</span><p>使用fb填入信箱與姓名</p>
                                 </button>
                                 <span id="FB_STATUS_2"></span>
                             </div>

desktop11/style.css

@@ -632,10 +632,20 @@ body .arrow:hover {
 }
 
 #contact-us #contact-form #fb-button p {
-  line-height: 40px;
+  position: absolute;
+  top: 1vw;
+  left: 14vw;
   color: #626262;
 }
 
+#contact-us #contact-form #fb-button #line {
+  position: absolute;
+  color: #9b9b9b;
+  opacity: 0.8;
+  left: 8vw;
+  top: -0.1vw;
+}
+
 #contact-us #contact-form #fb-button img {
   position: absolute;
   left: 50px;
@@ -660,6 +670,10 @@ body .arrow:hover {
   color: #fff;
 }
 
+#contact-us #contact-form #fb-button:hover #line {
+  color: #fff;
+}
+
 #contact-us #contact-form a {
   text-decoration: none;
   color: #ee751b;

desktop11/style.scss

@@ -265,7 +265,6 @@ body {
             .text3 {
                 cursor: pointer;
                 margin: auto 0;
-        
 
                 .text-1,
                 .text-2,
@@ -273,7 +272,6 @@ body {
                     font-size: 23px;
                     font-weight: bolder;
                     // color: $title-color;
-                    
                 }
             }
         }
@@ -360,7 +358,6 @@ body {
 }
 // service-process
 #service-process {
- 
     background-color: #f7f7f7;
     padding-bottom: 150px;
     h1 {
@@ -548,58 +545,71 @@ body {
             //         padding: 30px;
             //     }
             // }
-           
+        }
+        #fb-button {
+            margin-top: 12px;
+            width: 29vw;
+            height: 50px;
+            border: 1px solid #3b5998;
+            text-align: right;
+            padding-right: 60px;
+            background-size: 32px 32px;
+            border-radius: 3px;
+            background-color: #fff;
+            transition: 0.3s;
+            position: relative;
+            p {
+                position: absolute;
+                top:1vw;
+                left:14vw;
+    
+                color: #626262;
             }
-            #fb-button{
-                margin-top: 12px;
-                width: 29vw;
-                height: 50px;
-                border: 1px solid #3b5998;
-                text-align: right;
-                padding-right: 60px;
-                background-size: 32px 32px;
-                border-radius: 3px;
-                background-color: #fff;
-                transition: 0.3s;
-                position: relative;
-               p{
-                line-height: 40px;
-                color:#626262;
-               }
+            #line {
+                position: absolute;
+                color: #9b9b9b;
+                opacity: 0.8;;
+                left:8vw;
+                top:-0.1vw;
+               
+            }
+            img {
+                position: absolute;
+                left: 50px;
+                top: 10px;
+                width: 32px;
+                height: 32px;
+                filter: invert(29%) sepia(70%) saturate(712%) hue-rotate(186deg) brightness(89%) contrast(81%);
+            }
+            &:hover {
+                background-color: #2a4f91;
+                color: #fff;
                 img {
-                    position: absolute;
-                    left: 50px;
-                    top: 10px;
-                    width: 32px;
-                    height: 32px;
-                    filter: invert(29%) sepia(70%) saturate(712%) hue-rotate(186deg) brightness(89%) contrast(81%);
+                    filter: invert(100%) sepia(100%) saturate(19%) hue-rotate(334deg) brightness(106%) contrast(106%);
                 }
-                &:hover {
-                    background-color: #2a4f91;
+                p {
+                    color: #fff;
+                }
+
+                #line {
                     color: #fff;
-                    img {
-                        filter: invert(100%) sepia(100%) saturate(19%) hue-rotate(334deg) brightness(106%)
-                            contrast(106%);
-                    }
-                    p{
-                    color:#fff;
-                    }
                 }
-            }
-            a {
-                text-decoration: none;
-                color: #ee751b;
-                font-weight: 900;
-            }
-    
-            #email,
-            #name,
-            #phone {
-                background: none;
-                background-color: #fff;
             }
         }
-    
+        a {
+            text-decoration: none;
+            color: #ee751b;
+            font-weight: 900;
+        }
+
+        #email,
+        #name,
+        #phone {
+            background: none;
+            background-color: #fff;
+        }
+    }
+
     .btn {
         margin: 50px auto;
         border: none;
@@ -680,24 +690,19 @@ body {
 }
 
 form label {
-  display: inline-block;
-  width: 100px;
+    display: inline-block;
+    width: 100px;
 }
 
-
 form div {
-  margin-bottom: 10px;
+    margin-bottom: 10px;
 }
 
-
-
 .error {
-  color: red;
-  margin-left: 5px;
+    color: red;
+    margin-left: 5px;
 }
 
-
-
 label.error {
-  display: inline;
+    display: inline;
 }