Fixed width issues wit search

This commit is contained in:
Jori Lallo 2017-07-12 01:05:28 -07:00
parent b69b714448
commit efa5bf6a54
1 changed files with 9 additions and 3 deletions

View File

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