No _hover for <Box />

Hi!

I’m trying to add hover effect to the <Box /> component which is used as a <Link/> component but it does not seem to be working.

<Box
       as={Link}
       cursor="pointer"
       margin="0 10px"
       to={link.route}
       transition="all .2s"
       _hover={{
              bg: colors.orangeDark,
        }}
>
        {link.label}
</Box>

_hover seems to work perfectly for <Button/> component.

<Button
  bg={colors.orange}
  _hover={{
    bg: colors.orangeDark,
  }}
>
  {buttonText}
</Button>

Thanks.

[santialbo]

try with content: '""'

[with-heart]

@santialbo Good catch! Wasn’t even paying attention 🙃