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

convert from grid to flex

This commit is contained in:
Corwin Smith 2022-10-21 12:41:07 -05:00
parent 87706df147
commit d77761ca6e
1 changed files with 78 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

150
src/components/layouts/Footer.tsx
View File

@ -1,4 +1,4 @@
import { Grid, GridItem, Image, Link, Stack, Text } from '@chakra-ui/react';
import { Box, Flex, Link, Stack, Text } from '@chakra-ui/react';
import { FC } from 'react';
import NextLink from 'next/link';
@ -18,55 +18,61 @@ import {
export const Footer: FC = () => {
return (
<Stack mt={4} border='2px solid' borderColor='brand.light.primary'>
<Grid templateColumns='repeat(2, 1fr)' sx={{ mt: '-2px !important' }}>
<GridItem
borderRight='2px solid'
borderBottom='2px solid'
borderColor='brand.light.primary'
color='brand.light.primary'
_hover={{
textDecoration: 'none',
bg: 'brand.light.primary',
color: 'yellow.50 !important'
}}
>
<NextLink href={DOWNLOADS_PAGE} passHref>
<Link _hover={{ textDecoration: 'none' }}>
<Text textStyle='home-section-link-label'>DOWNLOADS</Text>
</Link>
</NextLink>
</GridItem>
<Box mt={4} border='2px solid' borderColor='brand.light.primary'>
<Flex
direction={{ base: 'column'}}
>
<Flex sx={{ mt: '-2px !important' }}>
<Stack
flex={1}
borderRight='2px solid'
borderBottom='2px solid'
borderColor='brand.light.primary'
color='brand.light.primary'
_hover={{
textDecoration: 'none',
bg: 'brand.light.primary',
color: 'yellow.50 !important'
}}
>
<NextLink href={DOWNLOADS_PAGE} passHref>
<Link _hover={{ textDecoration: 'none' }}>
<Text textStyle='home-section-link-label'>DOWNLOADS</Text>
</Link>
</NextLink>
</Stack>
<GridItem
borderBottom='2px solid'
borderColor='brand.light.primary'
color='brand.light.primary'
_hover={{
textDecoration: 'none',
bg: 'brand.light.primary',
color: 'yellow.50 !important'
}}
>
<NextLink href={DOCS_PAGE} passHref>
<Link _hover={{ textDecoration: 'none' }}>
<Text textStyle='home-section-link-label'>DOCUMENTATION</Text>
</Link>
</NextLink>
</GridItem>
</Grid>
<Stack
flex={1}
borderBottom='2px solid'
borderColor='brand.light.primary'
color='brand.light.primary'
_hover={{
textDecoration: 'none',
bg: 'brand.light.primary',
color: 'yellow.50 !important'
}}
>
<NextLink href={DOCS_PAGE} passHref>
<Link _hover={{ textDecoration: 'none' }}>
<Text textStyle='home-section-link-label'>DOCUMENTATION</Text>
</Link>
</NextLink>
</Stack>
</Flex>
<Grid templateColumns='repeat(3, 1fr)' sx={{ mt: '0 !important' }}>
<GridItem
data-group
borderRight='2px solid'
borderBottom='2px solid'
borderColor='brand.light.primary'
_hover={{
bg: 'brand.light.primary',
}}
>
<Stack alignItems='center'>
<Flex sx={{ mt: '0 !important' }}>
<Stack
flex={1}
data-group
borderRight='2px solid'
borderBottom='2px solid'
borderColor='brand.light.primary'
_hover={{
bg: 'brand.light.primary',
}}
alignItems='center'
>
<NextLink href={GETH_TWITTER_URL} passHref>
<Link isExternal p={4}>
<TwitterIcon
@ -81,18 +87,18 @@ export const Footer: FC = () => {
</Link>
</NextLink>
</Stack>
</GridItem>
<GridItem
data-group
borderRight='2px solid'
borderBottom='2px solid'
borderColor='brand.light.primary'
_hover={{
bg: 'brand.light.primary',
}}
>
<Stack alignItems='center'>
<Stack
data-group
flex={1}
borderRight='2px solid'
borderBottom='2px solid'
borderColor='brand.light.primary'
_hover={{
bg: 'brand.light.primary',
}}
alignItems='center'
>
<NextLink href={GETH_DISCORD_URL} passHref>
<Link isExternal p={4}>
<DiscordIcon
@ -107,17 +113,17 @@ export const Footer: FC = () => {
</Link>
</NextLink>
</Stack>
</GridItem>
<GridItem
data-group
borderBottom='2px solid'
borderColor='brand.light.primary'
_hover={{
bg: 'brand.light.primary',
}}
>
<Stack alignItems='center'>
<Stack
data-group
flex={1}
borderBottom='2px solid'
borderColor='brand.light.primary'
_hover={{
bg: 'brand.light.primary',
}}
alignItems='center'
>
<NextLink href={GETH_REPO_URL} passHref>
<Link isExternal p={4}>
<GitHubIcon
@ -132,12 +138,12 @@ export const Footer: FC = () => {
</Link>
</NextLink>
</Stack>
</GridItem>
</Grid>
</Flex>
</Flex>
<Stack p={4} sx={{ mt: '0 !important' }} textAlign='center'>
<Text textStyle='footer-text'>© 2013–2022. The go-ethereum Authors.</Text>
</Stack>
</Stack>
</Box>
)
}