service header with consultation in mobile layout

10 years ago · a4686b9f38
parent 0635262659
commit a4686b9f38
1 changed files with 89 additions and 1 deletions
--- a/zsite/static/less/service.less
+++ b/zsite/static/less/service.less
@ -235,7 +235,95 @@
 }

 .service-header {
-        margin-bottom: 30px;
+    margin-bottom: 30px;
+    
+    .make-row();
+
+
+      @media (min-width: 0) {
+        .service-header-description {
+            .make-xs-column(12);
+        }
+        .consultation-person {
+            .make-xs-column(10);
+            .make-xs-column-offset(2);
+        }
+      }
+
+      @media (min-width: @screen-phone) {
+        .service-header-description {
+            .make-xs-column(10  );
+            .make-sm-column(6);
+        }
+
+        .consultation-person {
+            .make-xs-column(2);
+            .make-xs-column-offset(0);
+
+            .make-sm-column(4);
+            .make-sm-column-offset(2);
+            
+            
+      
+           .people-visual {
+                margin: 0;
+                margin-left: -25px;
+            }
+
+            .people-link {
+                font-size: 11px;
+                white-space: nowrap;
+            }
+
+            .people-description {
+                padding: 0;
+                margin: 0;
+
+                font-size: 11px;
+            }
+
+            .consultation {
+                margin-left: -90px;
+            }
+        }
+      }
+
+       @media (min-width: @screen-tablet) {
+        // .service-header-description {
+        //     .make-xs-column(10  );
+        //     .make-sm-column(6);
+        // }
+
+        .consultation-person {
+            // .make-xs-column(2);
+            // .make-xs-column-offset(0);
+
+            // .make-sm-column(4);
+            // .make-sm-column-offset(2);
+            
+            
+      
+           .people-visual {
+                margin-bottom: 10px;
+                margin-left: -90px;
+            }
+
+            .people-link {
+                font-size: 14px;
+            }
+
+            .people-description {
+                font-size: 14px;
+
+                padding-top: 36px;
+                padding-left: 15px;
+            }
+
+            .consultation {
+                margin-left: 0;
+            }
+        }
+      }
 }

 .service-main-row {