interesting
/
go-ethereum
mirror of https://github.com/ethereum/go-ethereum.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Limit SVG width on mobile [Fixes #38] (#41) 

* fix horizontal scroll on mobile downloads

* padding change requests

* fix: DownloadsHero padding

* fix: border color

Co-authored-by: Corwin Smith <cssmittys@gmail.com>
Co-authored-by: Nicolás Quiroz <nh.quiroz@gmail.com>
This commit is contained in:
Paul Wackerow 2022-11-24 02:29:03 +01:00 committed by GitHub
parent bd80434b83
commit 865802bdff
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 13 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/components/UI/downloads/DownloadsHero.tsx
View File

@ -1,4 +1,4 @@
import { Box, Button, Center, Grid, HStack, Image, Link, Stack,Text } from '@chakra-ui/react'; import { Box, Button, Center, Grid, HStack, Image, Link, Stack, Text } from '@chakra-ui/react';
import { FC } from 'react'; import { FC } from 'react';
import NextLink from 'next/link'; import NextLink from 'next/link';
@ -43,7 +43,7 @@ export const DownloadsHero: FC<DownloadsHero> = ({
mb={4} mb={4}
templateColumns={{ base: 'repeat(1, 1fr)', md: '1fr 300px', lg: '1fr' }} templateColumns={{ base: 'repeat(1, 1fr)', md: '1fr 300px', lg: '1fr' }}
gap={4} gap={4}
p={4} py={4}
> >
<Stack> <Stack>
<Box as='h1' textStyle='h1'> <Box as='h1' textStyle='h1'>
@ -66,20 +66,17 @@ export const DownloadsHero: FC<DownloadsHero> = ({
</Text> </Text>
</Stack> </Stack>
<Stack <Center
py={{ base: 0 }} p={{ base: 0, md: 8 }}
px={{ base: 8 }}
flex={{ base: 'none' }} flex={{ base: 'none' }}
display={{ base: 'block', lg: 'none' }} display={{ base: 'block', lg: 'none' }}
order={{ base: -1, md: 1 }} order={{ base: -1, md: 1 }}
> >
<Center> <GopherDownloads aria-label='Gopher plugged in' w={{ base: '100%' }} />
<GopherDownloads aria-label='Gopher plugged in' w={{ md: 96 }} />
</Center> </Center>
</Stack>
</Grid> </Grid>
<Grid templateColumns={{ base: 'repeat(1, 1fr)', md: 'repeat(2, 1fr)' }} gap={4} mb={4}> <Grid templateColumns={{ base: 'repeat(1, 1fr)', md: 'repeat(2, 1fr)' }} gap={4}>
{Object.keys(DOWNLOAD_HEADER_BUTTONS).map((key: string) => { {Object.keys(DOWNLOAD_HEADER_BUTTONS).map((key: string) => {
const { name, buildURL, Svg, ariaLabel } = DOWNLOAD_HEADER_BUTTONS[key]; const { name, buildURL, Svg, ariaLabel } = DOWNLOAD_HEADER_BUTTONS[key];
return ( return (
@ -87,12 +84,10 @@ export const DownloadsHero: FC<DownloadsHero> = ({
<Button as='a' variant='downloadsHeader' width={{ base: '100%' }} h={16}> <Button as='a' variant='downloadsHeader' width={{ base: '100%' }} h={16}>
<HStack spacing={4}> <HStack spacing={4}>
<Stack alignItems='center'> <Stack alignItems='center'>
<Svg aria-label={ariaLabel} maxH="44px" /> <Svg aria-label={ariaLabel} maxH='44px' />
</Stack> </Stack>
<Box> <Box>
<Text textStyle='downloads-button-label'> <Text textStyle='downloads-button-label'>For {name}</Text>
For {name}
</Text>
<Text textStyle='downloads-button-sublabel'>geth {currentBuildVersion}</Text> <Text textStyle='downloads-button-sublabel'>geth {currentBuildVersion}</Text>
</Box> </Box>
</HStack> </HStack>
@ -102,7 +97,7 @@ export const DownloadsHero: FC<DownloadsHero> = ({
})} })}
</Grid> </Grid>
<Box textAlign={'center'}> <Box textAlign={'center'} pt={1} pb={2}>
<Link href={releaseNotesURL} isExternal variant='light'> <Link href={releaseNotesURL} isExternal variant='light'>
Release notes for {currentBuild} Release notes for {currentBuild}
</Link> </Link>

2
src/components/UI/downloads/DownloadsSection.tsx
View File

@ -44,7 +44,7 @@ export const DownloadsSection: FC<Props> = ({
p={4} p={4}
borderLeft={{ base: 'none', md: '2px' }} borderLeft={{ base: 'none', md: '2px' }}
borderTop={{ base: '2px', md: 'none' }} borderTop={{ base: '2px', md: 'none' }}
borderColor='primary' borderColor='primary !important'
> >
{sectionDescription} {sectionDescription}
</Center> </Center>

9
src/components/UI/downloads/SpecificVersionsSection.tsx
View File

@ -20,18 +20,13 @@ export const SpecificVersionsSection: FC<Props> = ({ children }) => {
justifyContent='center' justifyContent='center'
borderBottom={{ base: '2px', md: 'none' }} borderBottom={{ base: '2px', md: 'none' }}
borderRight={{ base: 'none', md: '2px' }} borderRight={{ base: 'none', md: '2px' }}
borderColor='primary' borderColor='primary !important'
flex='none' flex='none'
> >
<GopherHomeLinks /> <GopherHomeLinks />
</Flex> </Flex>
<Flex flexDir='column'> <Flex flexDir='column'>
<Stack <Stack p={4} borderBottom='2px' borderColor='primary' sx={{ mt: '0 !important' }}>
p={4}
borderBottom='2px'
borderColor='primary'
sx={{ mt: '0 !important' }}
>
<Box as='h2' textStyle='h2'> <Box as='h2' textStyle='h2'>
Specific Versions Specific Versions
</Box> </Box>