diff options
author | fragosti <francesco.agosti93@gmail.com> | 2018-12-01 02:25:36 +0800 |
---|---|---|
committer | fragosti <francesco.agosti93@gmail.com> | 2018-12-01 02:25:36 +0800 |
commit | e65096ee7af7c6d442b5e106db0a07652cc5e047 (patch) | |
tree | e43fba0c7aab2154e9c7d21817aa014088c71334 /packages/website/ts/components/ui/container.tsx | |
parent | f1354632a1a2915159f6d662f90b68fe8c3bab38 (diff) | |
download | dexon-sol-tools-e65096ee7af7c6d442b5e106db0a07652cc5e047.tar.gz dexon-sol-tools-e65096ee7af7c6d442b5e106db0a07652cc5e047.tar.zst dexon-sol-tools-e65096ee7af7c6d442b5e106db0a07652cc5e047.zip |
feat: implement multi token select component
Diffstat (limited to 'packages/website/ts/components/ui/container.tsx')
-rw-r--r-- | packages/website/ts/components/ui/container.tsx | 6 |
1 files changed, 6 insertions, 0 deletions
diff --git a/packages/website/ts/components/ui/container.tsx b/packages/website/ts/components/ui/container.tsx index cd0ed9986..4b76ce8be 100644 --- a/packages/website/ts/components/ui/container.tsx +++ b/packages/website/ts/components/ui/container.tsx @@ -9,6 +9,7 @@ type StringOrNum = string | number; export type ContainerTag = 'div' | 'span'; export interface ContainerProps { + margin?: string; marginTop?: StringOrNum; marginBottom?: StringOrNum; marginRight?: StringOrNum; @@ -48,7 +49,9 @@ export interface ContainerProps { id?: string; onClick?: (event: React.MouseEvent<HTMLElement>) => void; overflowX?: 'scroll' | 'hidden' | 'auto' | 'visible'; + overflowY?: 'scroll' | 'hidden' | 'auto' | 'visible'; shouldDarkenOnHover?: boolean; + hasBoxShadow?: boolean; shouldAddBoxShadowOnHover?: boolean; } @@ -62,6 +65,7 @@ export const PlainContainer: React.StatelessComponent<ContainerProps> = props => onClick, shouldDarkenOnHover, shouldAddBoxShadowOnHover, + hasBoxShadow, // tslint:disable-next-line:trailing-comma ...style } = props; @@ -74,6 +78,8 @@ export const PlainContainer: React.StatelessComponent<ContainerProps> = props => }; export const Container = styled(PlainContainer)` + box-sizing: border-box; + ${props => (props.hasBoxShadow ? `box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1)` : '')}; &:hover { ${props => props.shouldDarkenOnHover |