From 563b16886aa29583c62f81560bd8913fb4b062b7 Mon Sep 17 00:00:00 2001
From: Mike Allanson <michael.allanson@gmail.com>
Date: Mon, 5 Feb 2018 17:01:07 +0000
Subject: [PATCH] Fix positioning of search results at mobile breakpoint on
 homepage (#3867)

---
 www/src/components/search-form.js | 5 +++++
 www/src/layouts/index.js          | 2 +-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/www/src/components/search-form.js b/www/src/components/search-form.js
index c6294e1a2e20d..fe629620c72ff 100644
--- a/www/src/components/search-form.js
+++ b/www/src/components/search-form.js
@@ -24,6 +24,10 @@ css.insert(`
     box-shadow: 0 3px 10px 0.05rem ${hex2rgba(colors.lilac, 0.25)} !important;
   }
 
+  .is-homepage .algolia-autocomplete .ds-dropdown-menu {
+    top: ${rhythm(2.5)} !important;
+  }
+
   /* .searchWrap to beat docsearch.css' !important */
   .searchWrap .algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu,
   .searchWrap .algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu {
@@ -193,6 +197,7 @@ css.insert(`
   }
 
   @media ${presets.tablet} {
+    .is-homepage .algolia-autocomplete .ds-dropdown-menu,
     .algolia-autocomplete .ds-dropdown-menu {
       top: 100% !important;
       position: absolute !important;
diff --git a/www/src/layouts/index.js b/www/src/layouts/index.js
index 3bef463fa15bf..8f12924b2e5fc 100644
--- a/www/src/layouts/index.js
+++ b/www/src/layouts/index.js
@@ -68,7 +68,7 @@ class DefaultLayout extends React.Component {
     }
 
     return (
-      <div>
+      <div className={isHomepage && `is-homepage`}>
         <Helmet defaultTitle={`GatsbyJS`} titleTemplate={`%s | GatsbyJS`}>
           <meta name="twitter:site" content="@gatsbyjs" />
           <meta name="og:type" content="website" />