From: Lynx Kotoura <lynx@lv9.org>
Date: Tue, 25 Jul 2017 19:31:56 +0000 (+0900)
Subject: Adjust mobile landing page (#4366)
X-Git-Url: https://git.xn--scling-oua.cat.family/?a=commitdiff_plain;h=9891ff80f9679ed3dfdd6e8352abfb661f321a00;p=mastodon.git

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
---

diff --git a/app/javascript/styles/about.scss b/app/javascript/styles/about.scss
index 8aa5d8eb4..5a4bcef61 100644
--- 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 {