From efa5bf6a544c5398f1040627629c420eb4bcf2b9 Mon Sep 17 00:00:00 2001
From: Jori Lallo <jtlallo@gmail.com>
Date: Wed, 12 Jul 2017 01:05:28 -0700
Subject: [PATCH] Fixed width issues wit search

---
 frontend/scenes/Search/Search.js | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/frontend/scenes/Search/Search.js b/frontend/scenes/Search/Search.js
index 6a9f184c9..a6436ae28 100644
--- a/frontend/scenes/Search/Search.js
+++ b/frontend/scenes/Search/Search.js
@@ -9,10 +9,10 @@ import { searchUrl } from 'utils/routeHelpers';
 import styled from 'styled-components';
 import ArrowKeyNavigation from 'boundless-arrow-key-navigation';
 
+import CenteredContent from 'components/CenteredContent';
 import SearchField from './components/SearchField';
 import SearchStore from './SearchStore';
 
-import CenteredContent from 'components/CenteredContent';
 import DocumentPreview from 'components/DocumentPreview';
 import PageTitle from 'components/PageTitle';
 
@@ -39,6 +39,12 @@ const ResultList = styled(Flex)`
   transition: all 400ms cubic-bezier(0.65, 0.05, 0.36, 1);
 `;
 
+const StyledArrowKeyNavigation = styled(ArrowKeyNavigation)`
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+`;
+
 @observer class Search extends React.Component {
   firstDocument: HTMLElement;
   props: Props;
@@ -106,7 +112,7 @@ const ResultList = styled(Flex)`
             value={query || ''}
           />
           <ResultList visible={hasResults}>
-            <ArrowKeyNavigation
+            <StyledArrowKeyNavigation
               mode={ArrowKeyNavigation.mode.VERTICAL}
               defaultActiveChildIndex={0}
             >
@@ -118,7 +124,7 @@ const ResultList = styled(Flex)`
                   highlight={this.store.searchTerm}
                 />
               ))}
-            </ArrowKeyNavigation>
+            </StyledArrowKeyNavigation>
           </ResultList>
         </ResultsWrapper>
       </Container>