coop-cloud-chaos-patchs/outline
coop-cloud-chaos-patchs
/
outline
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge pull request #138 from jorilallo/jori/serach-ui 

Fixed width issues with search
This commit is contained in:
Jori Lallo 2017-07-12 22:50:02 -07:00 committed by GitHub
parent b69b714448 add1f0d9b6
commit 3b146d9b47
1 changed files with 12 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
frontend/scenes/Search/Search.js
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';
@ -23,7 +23,9 @@ type Props = {
};
const Container = styled(CenteredContent)`
position: relative;
> div {
position: relative;
}
`;
const ResultsWrapper = styled(Flex)`
@ -39,6 +41,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 +114,7 @@ const ResultList = styled(Flex)`
value={query || ''}
/>
<ResultList visible={hasResults}>
<ArrowKeyNavigation
<StyledArrowKeyNavigation
mode={ArrowKeyNavigation.mode.VERTICAL}
defaultActiveChildIndex={0}
>
@ -118,7 +126,7 @@ const ResultList = styled(Flex)`
highlight={this.store.searchTerm}
/>
))}
</ArrowKeyNavigation>
</StyledArrowKeyNavigation>
</ResultList>
</ResultsWrapper>
</Container>