Box

Base component for all design system styles

Installation

npm install --save @gladio/box

Usage

import Box from "@gladio/box"
function App () {
  return <Box>Content Here</Box>
}

Playground

Code Editor

<Box
  padding="4"
  marginTop="8"
  marginX="4"
  backgroundColor="gray-100"
  border="2"
  borderColor="gray-600"
  rounded="lg"
  boxShadow
  boxShadowHover="lg"
  backgroundColorHover="white"
  cursor="pointer"
>
  <Box as="h3" fontSize="lg" fontWeight="medium" marginTop="0" marginBottom="2">
    Support
  </Box>
  <Box as="p" fontSize="sm" textColor="gray-600">
    Please contact our support team for any help
  </Box>
</Box>

<Box
  padding="4"
  marginTop="8"
  marginX="4"
  backgroundColor="gray-100"
  border="2"
  borderColor="gray-600"
  rounded="lg"
  boxShadow
  boxShadowHover="lg"
  backgroundColorHover="white"
  cursor="pointer"
>
  <Box as="h3" fontSize="lg" fontWeight="medium" marginTop="0" marginBottom="2">
    Support
  </Box>
  <Box as="p" fontSize="sm" textColor="gray-600">
    Please contact our support team for any help
  </Box>
</Box>

Support

Please contact our support team for any help

Props

Coming soon...

Components

Icons

Box

Installation

Usage

Playground

Support

Props