chore: add Link variants
This commit is contained in:
parent
80afacda50
commit
d2c4ffa523
@ -51,7 +51,7 @@ export const HomeSection: FC<Props> = ({
|
||||
|
||||
<Stack sx={{ mt: '0 !important' }}>
|
||||
<NextLink href={buttonHref} passHref>
|
||||
<Link variant='secondary' isExternal={buttonHref.startsWith('http')}>
|
||||
<Link variant='button-link-secondary' isExternal={buttonHref.startsWith('http')}>
|
||||
<Text textStyle='home-section-link-label'>{linkLabel}</Text>
|
||||
</Link>
|
||||
</NextLink>
|
||||
|
@ -31,41 +31,11 @@ const HomePage: NextPage = ({}) => {
|
||||
>
|
||||
<Text fontFamily='"Inter", sans-serif' lineHeight='26px'>
|
||||
Geth (go-ethereum) is a{' '}
|
||||
<Link
|
||||
href='https://go.dev/'
|
||||
isExternal
|
||||
textDecoration='underline'
|
||||
color='brand.light.primary'
|
||||
_hover={{ color: 'brand.light.body', textDecorationColor: 'brand.light.body' }}
|
||||
_focus={{
|
||||
color: 'brand.light.primary',
|
||||
boxShadow: '0 0 0 1px #11866f !important',
|
||||
textDecoration: 'none'
|
||||
}}
|
||||
_pressed={{
|
||||
color: 'brand.light.secondary',
|
||||
textDecorationColor: 'brand.light.secondary'
|
||||
}}
|
||||
>
|
||||
<Link href='https://go.dev/' isExternal variant='light'>
|
||||
Go
|
||||
</Link>{' '}
|
||||
implementation of{' '}
|
||||
<Link
|
||||
href={ETHEREUM_ORG_URL}
|
||||
isExternal
|
||||
textDecoration='underline'
|
||||
color='brand.light.primary'
|
||||
_hover={{ color: 'brand.light.body', textDecorationColor: 'brand.light.body' }}
|
||||
_focus={{
|
||||
color: 'brand.light.primary',
|
||||
boxShadow: '0 0 0 1px #11866f !important',
|
||||
textDecoration: 'none'
|
||||
}}
|
||||
_pressed={{
|
||||
color: 'brand.light.secondary',
|
||||
textDecorationColor: 'brand.light.secondary'
|
||||
}}
|
||||
>
|
||||
<Link href={ETHEREUM_ORG_URL} isExternal variant='light'>
|
||||
Ethereum
|
||||
</Link>{' '}
|
||||
- a gateway into the decentralized web.
|
||||
@ -139,22 +109,7 @@ const HomePage: NextPage = ({}) => {
|
||||
We welcome contributions from anyone on the internet, and are grateful for even the
|
||||
smallest of fixes! If you'd like to contribute to the Geth source code, please
|
||||
fork the{' '}
|
||||
<Link
|
||||
href={GETH_REPO_URL}
|
||||
isExternal
|
||||
textDecoration='underline'
|
||||
color='brand.light.primary'
|
||||
_hover={{ color: 'brand.light.body', textDecorationColor: 'brand.light.body' }}
|
||||
_focus={{
|
||||
color: 'brand.light.primary',
|
||||
boxShadow: '0 0 0 1px #11866f !important',
|
||||
textDecoration: 'none'
|
||||
}}
|
||||
_pressed={{
|
||||
color: 'brand.light.secondary',
|
||||
textDecorationColor: 'brand.light.secondary'
|
||||
}}
|
||||
>
|
||||
<Link href={GETH_REPO_URL} isExternal variant='light'>
|
||||
Github repository
|
||||
</Link>
|
||||
, fix, commit and send a pull request for the maintainers to review and merge into the
|
||||
|
@ -1,6 +1,6 @@
|
||||
export const Link = {
|
||||
variants: {
|
||||
secondary: {
|
||||
'button-link-secondary': {
|
||||
color: 'brand.light.primary',
|
||||
bg: 'green.50',
|
||||
_hover: { textDecoration: 'none', bg: 'brand.light.primary', color: 'yellow.50' },
|
||||
@ -11,6 +11,20 @@ export const Link = {
|
||||
boxShadow: 'inset 0 0 0 3px #f0f2e2 !important'
|
||||
},
|
||||
_active: { textDecoration: 'none', bg: 'brand.light.secondary', color: 'yellow.50' }
|
||||
},
|
||||
light: {
|
||||
textDecoration: 'underline',
|
||||
color: 'brand.light.primary',
|
||||
_hover: { color: 'brand.light.body', textDecorationColor: 'brand.light.body' },
|
||||
_focus: {
|
||||
color: 'brand.light.primary',
|
||||
boxShadow: '0 0 0 1px #11866f !important',
|
||||
textDecoration: 'none'
|
||||
},
|
||||
_pressed: {
|
||||
color: 'brand.light.secondary',
|
||||
textDecorationColor: 'brand.light.secondary'
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
Loading…
Reference in New Issue
Block a user