amirho/react.dev
1
0
Fork 0
mirror of https://github.com/reactjs/react.dev.git synced 2026-02-24 20:53:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

Do the yarn prettier

Browse Source
This commit is contained in:
Lucas Lentz
2017-10-19 15:17:52 -02:00
parent 993df14915
commit 238ffd9709
1 changed files with 91 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

182
src/components/DocSearch/DocSearch.js
View File

@@ -8,103 +8,103 @@ import React, {Component} from 'react';
import {colors, media} from 'theme';
class DocSearch extends Component {
state = {
disabled: false
}
componentDidMount() {
// Initialize Algolia search.
// TODO Is this expensive? Should it be deferred until a user is about to search?
// eslint-disable-next-line no-undef
if(window.docsearch) {
docsearch({
apiKey: '36221914cce388c46d0420343e0bb32e',
indexName: 'react',
inputSelector: '#algolia-doc-search',
});
} else {
this.setState({ disabled: true})
}
state = {
disabled: false,
};
componentDidMount() {
// Initialize Algolia search.
// TODO Is this expensive? Should it be deferred until a user is about to search?
// eslint-disable-next-line no-undef
if (window.docsearch) {
docsearch({
apiKey: '36221914cce388c46d0420343e0bb32e',
indexName: 'react',
inputSelector: '#algolia-doc-search',
});
} else {
this.setState({disabled: true});
}
}
render() {
const {disabled} = this.state
render() {
const {disabled} = this.state;
return (
<form
css={{
display: 'flex',
flex: '0 0 auto',
flexDirection: 'row',
alignItems: 'center',
paddingLeft: '0.5rem',
paddingRight: '0.5rem',
return (
<form
css={{
display: 'flex',
flex: '0 0 auto',
flexDirection: 'row',
alignItems: 'center',
paddingLeft: '0.5rem',
paddingRight: '0.5rem',
[media.lessThan('small')]: {
justifyContent: 'flex-end',
},
[media.lessThan('large')]: {
marginRight: 10,
},
[media.between('small', 'medium')]: {
width: 'calc(100% / 3)',
},
[media.between('medium', 'xlarge')]: {
width: 'calc(100% / 6)',
},
[media.greaterThan('small')]: {
minWidth: 120,
},
}}>
<input
disabled={disabled}
css={{
appearance: 'none',
background: 'transparent',
border: 0,
color: colors.white,
fontSize: 18,
fontWeight: 300,
fontFamily: 'inherit',
position: 'relative',
padding: '5px 5px 5px 29px',
backgroundImage: 'url(/search.svg)',
backgroundSize: '16px 16px',
backgroundRepeat: 'no-repeat',
backgroundPositionY: 'center',
backgroundPositionX: '5px',
[media.lessThan('small')]: {
justifyContent: 'flex-end',
},
[media.lessThan('large')]: {
marginRight: 10,
},
[media.between('small', 'medium')]: {
width: 'calc(100% / 3)',
},
[media.between('medium', 'xlarge')]: {
width: 'calc(100% / 6)',
},
[media.greaterThan('small')]: {
minWidth: 120,
},
}}>
<input
disabled={disabled}
css={{
appearance: 'none',
background: 'transparent',
border: 0,
color: colors.white,
fontSize: 18,
fontWeight: 300,
fontFamily: 'inherit',
position: 'relative',
padding: '5px 5px 5px 29px',
backgroundImage: 'url(/search.svg)',
backgroundSize: '16px 16px',
backgroundRepeat: 'no-repeat',
backgroundPositionY: 'center',
backgroundPositionX: '5px',
':focus': {
outline: 0,
backgroundColor: colors.lighter,
borderRadius: '0.25rem',
},
':focus': {
outline: 0,
backgroundColor: colors.lighter,
borderRadius: '0.25rem',
},
[media.lessThan('large')]: {
fontSize: 16,
},
[media.greaterThan('small')]: {
width: '100%',
},
[media.lessThan('small')]: {
width: '16px',
transition: 'width 0.2s ease, padding 0.2s ease',
paddingLeft: '16px',
[media.lessThan('large')]: {
fontSize: 16,
},
[media.greaterThan('small')]: {
width: '100%',
},
[media.lessThan('small')]: {
width: '16px',
transition: 'width 0.2s ease, padding 0.2s ease',
paddingLeft: '16px',
':focus': {
paddingLeft: '29px',
width: '8rem',
outline: 'none',
},
},
}}
id="algolia-doc-search"
type="search"
placeholder="Search docs"
aria-label="Search docs"
/>
</form>
);
}
':focus': {
paddingLeft: '29px',
width: '8rem',
outline: 'none',
},
},
}}
id="algolia-doc-search"
type="search"
placeholder="Search docs"
aria-label="Search docs"
/>
</form>
);
}
}
export default DocSearch;
export default DocSearch;