mastofe

commit: 9891ff80f9679ed3dfdd6e8352abfb661f321a00
parent: 7232cdf7e8249f79078005931b1165e54e413fa9
Author: Lynx Kotoura <lynx@lv9.org>
Date:   Wed, 26 Jul 2017 04:31:56 +0900

Adjust mobile landing page (#4366)

* Adjust mobile landing page

Change mobile viewport threshold to 840px in consideration of padding. Fix loss of "container hero" padding in about/more under 675px.

* Fix indent

Diffstat:
M
app/javascript/styles/about.scss
12
+++++-------

1 file changed, 5 insertions(+), 7 deletions(-)
diff --git a/app/javascript/styles/about.scss b/app/javascript/styles/about.scss
@@ -646,7 +646,7 @@
     }
   }
 
-  @media screen and (max-width: 800px) {
+  @media screen and (max-width: 840px) {
     .container {
       padding: 0 20px;
     }
@@ -688,6 +688,10 @@
   @media screen and (max-width: 675px) {
     .header-wrapper {
       padding-top: 0;
+
+      &.compact .hero .heading {
+        padding-bottom: 20px;
+      }
     }
 
     .header .container,
@@ -701,15 +705,9 @@
     }
 
     .header {
-      padding-top: 0;
 
       .hero {
         margin-top: 30px;
-        padding: 0;
-
-        .heading {
-          padding-bottom: 20px;
-        }
       }
 
       .floats {