mirror of
https://github.com/hanzoai/gui.git
synced 2026-10-25 02:31:41 +00:00
71 lines
816 B
TypeScript
71 lines
816 B
TypeScript
import { YStack, styled } from '@hanzo/gui'
|
|
|
|
const variants = {
|
|
hide: {
|
|
true: {
|
|
pointerEvents: 'none',
|
|
opacity: 0,
|
|
},
|
|
},
|
|
} as const
|
|
|
|
export const Container = styled(YStack, {
|
|
mx: 'auto',
|
|
px: '$4',
|
|
width: '100%',
|
|
position: 'relative',
|
|
|
|
$gtSm: {
|
|
px: '$6',
|
|
maxW: 760,
|
|
},
|
|
|
|
$gtMd: {
|
|
maxW: 810,
|
|
},
|
|
|
|
$gtLg: {
|
|
maxW: 810,
|
|
},
|
|
|
|
variants,
|
|
})
|
|
|
|
export const ContainerLarge = styled(YStack, {
|
|
mx: 'auto',
|
|
px: '$4',
|
|
width: '100%',
|
|
position: 'relative',
|
|
|
|
$gtSm: {
|
|
maxW: 980,
|
|
},
|
|
|
|
$gtMd: {
|
|
maxW: 1140,
|
|
},
|
|
|
|
variants,
|
|
})
|
|
|
|
export const ContainerXL = styled(YStack, {
|
|
mx: 'auto',
|
|
width: '100%',
|
|
position: 'relative',
|
|
|
|
$gtSm: {
|
|
px: '$4',
|
|
maxW: 980,
|
|
},
|
|
|
|
$gtMd: {
|
|
maxW: 1240,
|
|
},
|
|
|
|
$gtLg: {
|
|
maxW: 1440,
|
|
},
|
|
|
|
variants,
|
|
})
|