export default function Example() {
  const StyledText = styled("p", {
    overflow: "wrap",
    width: "100px",
  });
  const Container = styled({
    padding: theme.space["100"],
  });
  return (
    <Box
      css={{
        display: "flex",
        justifyContent: "center",
        width: "100%",
        flexWrap: "wrap",
        gap: "$100",
      }}
    >
      <ul style={{ display: "flex", listStyleType: "none" }}>
        <li style={{ marginRight: "10px" }}>
          <Card
            css={{
              display: "flex",
              alignItems: "center",
              flexDirection: "column",
              padding: "0",
              maxWidth: "211px",
            }}
          >
            <img
              height="140"
              width="210"
              layout="fixed"
              alt="Vibrant quinoa bowl with carrots, tomatoes, and cucumbers"
              src="https://images.pexels.com/photos/1640777/pexels-photo-1640777.jpeg"
            />
            <Container>
              <StyledText>
                How Saria makes ready-to-eat <a href="">quinoa bowls</a> with
                lots of veggies.
              </StyledText>
            </Container>
          </Card>
        </li>
        <li>
          <Card
            css={{
              display: "flex",
              alignItems: "center",
              flexDirection: "column",
              padding: "0",
              maxWidth: "211px",
            }}
          >
            <img
              height="140"
              width="210"
              layout="fixed"
              alt="Pad thai plated with atop a green tablecloth."
              src="https://images.pexels.com/photos/12481161/pexels-photo-12481161.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2"
            />
            <Container>
              <StyledText>
                This <a href="">pad thai</a> with chicken and shrimp only takes
                15 minutes to prepare!
              </StyledText>
            </Container>
          </Card>
        </li>
      </ul>
    </Box>
  );
}