Link Overlay

1
import { Box, LinkOverlay } from 'styled-system/jsx'
2

3
function App() {
4
  return (
5
    <Box pos="relative">
6
      <img src="https://via.placeholder.com/150" alt="placeholder" />
7
      <LinkOverlay href="#">
8
        View more
9
      </LinkOverlay>
10
    </Box>
11
  )
12
}

1
import { LinkOverlay } from "styled-system/jsx";

1
<LinkOverlay href="https://example.com">
2
  Click here
3
</LinkOverlay>

1
import { Box, LinkOverlay } from 'styled-system/jsx'
2
function App() {
3
  return (
4
    <Box pos="relative">
5
      <img src="https://via.placeholder.com/150" alt="placeholder" />
6
      <LinkOverlay href="https://example.com">
7
        View more
8
      </LinkOverlay>
9
    </Box>
10
  )
11
}