From 3c9f06581ac24194c13f4e3edb5f55301fe78802 Mon Sep 17 00:00:00 2001
From: Nikhila Ravi <nikhilar@fb.com>
Date: Wed, 5 Feb 2020 10:54:17 -0800
Subject: [PATCH] update website css on mobile

Summary: Updated media queries for website on mobile.

Reviewed By: gkioxari

Differential Revision: D19745526

fbshipit-source-id: a8dc25fcc04726056231d2e1ebeb581251be9324
---
 website/static/css/custom.css | 47 +++++++++++++++++++++++++++++------
 1 file changed, 40 insertions(+), 7 deletions(-)

diff --git a/website/static/css/custom.css b/website/static/css/custom.css
index f3450ef5..d354a567 100644
--- a/website/static/css/custom.css
+++ b/website/static/css/custom.css
@@ -63,14 +63,13 @@ html body {
     rgba(129, 44, 229, 1) 0%,
     rgba(255, 175, 0, 1) 100%
   );
-  padding: 30px 0px;
+  padding: 25px 0px;
 }
 
 .splashLogo {
   display: block;
   margin: 0 auto;
-  height: 200px;
-  width: 800px;
+  width: 65%;
 }
 
 .projectTitle {
@@ -128,7 +127,10 @@ div.productShowcaseSection {
 }
 
 .productShowcaseSection div.container {
-  padding: 40px 0px;
+  padding-bottom: 40px;
+  padding-top: 10px;
+  padding-left: 0px;
+  padding-right: 0px;
 }
 
 .productShowcaseSection img {
@@ -289,13 +291,44 @@ p a:hover {
   max-width: 1400px;
 }
 
-@media only screen and (min-device-width: 360px) and (max-device-width: 736px) {
-}
 
-@media only screen and (min-width: 1024px) {
+@media only screen and (min-device-width: 360px) and (max-device-width: 736px) {
+  .fixedHeaderContainer header a:nth-child(2) {
+    position: absolute;
+    right: 150px;
+  }
+  .promoSection .button {
+    font-size: 12px;
+    margin: 3px;
+  }
+  .inner h2 {
+   margin-top: 0px;
+  }
+  .splashLogo {
+    width: 90%;
+  }
+  .headerTitleWithLogo {
+    display: block !important;
+  }
+  .blockContent > div span p {
+    margin-bottom: 30px
+  }
+  .productShowcaseSection div.container {
+    padding-top: 0px;
+  }
+  .productShowcaseSection > h2 {
+    padding-bottom: 20px;
+  }
 }
 
 @media only screen and (max-width: 1023px) {
+  .fixedHeaderContainer header a:nth-child(2) {
+    position: absolute;
+    right: 200px;
+  }
+}
+
+@media only screen and (min-width: 1024px) {
 }
 
 @media only screen and (min-width: 1400px) {