The Box component extends the functionality of the Container component. It inherits the same props and adds additional styling properties. Use it to create visually appealing boxes, tiles, or containers within your applications.
import React from "react";
import { Box } from "cherry-styled-components";
export default function Page() {
return (
<Box>
Boxing things around!
</Box>
);
}Box content.
Makes the box full-width without max-width constraints.
Text alignment within the box.
Base padding value.
Padding at xs breakpoint.
Padding at sm breakpoint.
Padding at md breakpoint.
Padding at lg breakpoint.
Padding at xl breakpoint.
Padding at xxl breakpoint.
Padding at xxxl breakpoint.
Cherry theme object.