Commit 7e0a630c authored by isstuev's avatar isstuev

fixes 4

parent 879161c1
...@@ -69,7 +69,7 @@ const LatestBlocks = () => { ...@@ -69,7 +69,7 @@ const LatestBlocks = () => {
} }
if (isError) { if (isError) {
content = <Text>There are no blocks yet.</Text>; content = <Text>No data. Please reload page.</Text>;
} }
if (data) { if (data) {
......
...@@ -34,7 +34,7 @@ const LatestTransactions = () => { ...@@ -34,7 +34,7 @@ const LatestTransactions = () => {
} }
if (isError) { if (isError) {
content = <Text mt={ 4 }>There are no transactions. Please reload page.</Text>; content = <Text mt={ 4 }>No data. Please reload page.</Text>;
} }
if (data) { if (data) {
......
...@@ -27,7 +27,7 @@ const Home = () => { ...@@ -27,7 +27,7 @@ const Home = () => {
> >
Welcome to Blockscout explorer Welcome to Blockscout explorer
</Heading> </Heading>
<LightMode><SearchBar backgroundColor="white" isHomepage/></LightMode> <LightMode><SearchBar isHomepage/></LightMode>
</Box> </Box>
<Stats/> <Stats/>
<ChainIndicators/> <ChainIndicators/>
......
...@@ -8,12 +8,11 @@ import SearchBarMobile from './SearchBarMobile'; ...@@ -8,12 +8,11 @@ import SearchBarMobile from './SearchBarMobile';
import SearchBarMobileHome from './SearchBarMobileHome'; import SearchBarMobileHome from './SearchBarMobileHome';
type Props = { type Props = {
backgroundColor?: string;
withShadow?: boolean; withShadow?: boolean;
isHomepage?: boolean; isHomepage?: boolean;
} }
const SearchBar = ({ backgroundColor, isHomepage, withShadow }: Props) => { const SearchBar = ({ isHomepage, withShadow }: Props) => {
const [ value, setValue ] = React.useState(''); const [ value, setValue ] = React.useState('');
const handleChange = React.useCallback((event: ChangeEvent<HTMLInputElement>) => { const handleChange = React.useCallback((event: ChangeEvent<HTMLInputElement>) => {
...@@ -28,7 +27,7 @@ const SearchBar = ({ backgroundColor, isHomepage, withShadow }: Props) => { ...@@ -28,7 +27,7 @@ const SearchBar = ({ backgroundColor, isHomepage, withShadow }: Props) => {
return ( return (
<> <>
<SearchBarDesktop onChange={ handleChange } onSubmit={ handleSubmit } backgroundColor={ backgroundColor }/> <SearchBarDesktop onChange={ handleChange } onSubmit={ handleSubmit } isHomepage={ isHomepage }/>
{ !isHomepage && ( { !isHomepage && (
<SearchBarMobile <SearchBarMobile
onChange={ handleChange } onChange={ handleChange }
...@@ -40,7 +39,6 @@ const SearchBar = ({ backgroundColor, isHomepage, withShadow }: Props) => { ...@@ -40,7 +39,6 @@ const SearchBar = ({ backgroundColor, isHomepage, withShadow }: Props) => {
<SearchBarMobileHome <SearchBarMobileHome
onChange={ handleChange } onChange={ handleChange }
onSubmit={ handleSubmit } onSubmit={ handleSubmit }
backgroundColor={ backgroundColor }
/> />
) } ) }
</> </>
......
...@@ -7,17 +7,17 @@ import searchIcon from 'icons/search.svg'; ...@@ -7,17 +7,17 @@ import searchIcon from 'icons/search.svg';
interface Props { interface Props {
onChange: (event: ChangeEvent<HTMLInputElement>) => void; onChange: (event: ChangeEvent<HTMLInputElement>) => void;
onSubmit: (event: FormEvent<HTMLFormElement>) => void; onSubmit: (event: FormEvent<HTMLFormElement>) => void;
backgroundColor?: string; isHomepage?: boolean;
} }
const SearchBarDesktop = ({ onChange, onSubmit, backgroundColor }: Props) => { const SearchBarDesktop = ({ onChange, onSubmit, isHomepage }: Props) => {
return ( return (
<chakra.form <chakra.form
noValidate noValidate
onSubmit={ onSubmit } onSubmit={ onSubmit }
display={{ base: 'none', lg: 'block' }} display={{ base: 'none', lg: 'block' }}
w="100%" w="100%"
bg={ backgroundColor } backgroundColor={ isHomepage ? 'white' : 'none' }
borderRadius="10px" borderRadius="10px"
> >
<InputGroup> <InputGroup>
...@@ -30,7 +30,9 @@ const SearchBarDesktop = ({ onChange, onSubmit, backgroundColor }: Props) => { ...@@ -30,7 +30,9 @@ const SearchBarDesktop = ({ onChange, onSubmit, backgroundColor }: Props) => {
placeholder="Search by addresses / transactions / block / token... " placeholder="Search by addresses / transactions / block / token... "
ml="1px" ml="1px"
onChange={ onChange } onChange={ onChange }
border={ isHomepage ? 'none' : '2px solid' }
borderColor={ useColorModeValue('blackAlpha.100', 'whiteAlpha.200') } borderColor={ useColorModeValue('blackAlpha.100', 'whiteAlpha.200') }
color={ useColorModeValue('black', 'white') }
/> />
</InputGroup> </InputGroup>
</chakra.form> </chakra.form>
......
...@@ -10,7 +10,7 @@ interface Props { ...@@ -10,7 +10,7 @@ interface Props {
backgroundColor?: string; backgroundColor?: string;
} }
const SearchBarMobileHome = ({ onChange, onSubmit, backgroundColor }: Props) => { const SearchBarMobileHome = ({ onChange, onSubmit }: Props) => {
const commonProps = { const commonProps = {
noValidate: true, noValidate: true,
onSubmit: onSubmit, onSubmit: onSubmit,
...@@ -22,7 +22,7 @@ const SearchBarMobileHome = ({ onChange, onSubmit, backgroundColor }: Props) => ...@@ -22,7 +22,7 @@ const SearchBarMobileHome = ({ onChange, onSubmit, backgroundColor }: Props) =>
<LightMode> <LightMode>
<chakra.form <chakra.form
{ ...commonProps } { ...commonProps }
bgColor={ backgroundColor } bgColor="white"
h="60px" h="60px"
borderRadius="10px" borderRadius="10px"
> >
...@@ -36,6 +36,7 @@ const SearchBarMobileHome = ({ onChange, onSubmit, backgroundColor }: Props) => ...@@ -36,6 +36,7 @@ const SearchBarMobileHome = ({ onChange, onSubmit, backgroundColor }: Props) =>
ml="1px" ml="1px"
onChange={ onChange } onChange={ onChange }
border="none" border="none"
color="black"
/> />
</InputGroup> </InputGroup>
</chakra.form> </chakra.form>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment