diff options
Diffstat (limited to 'packages/instant')
-rw-r--r-- | packages/instant/public/index.html | 1 | ||||
-rw-r--r-- | packages/instant/src/components/buy_button.tsx | 2 | ||||
-rw-r--r-- | packages/instant/src/components/order_details.tsx | 2 | ||||
-rw-r--r-- | packages/instant/src/components/ui/container.tsx | 3 | ||||
-rw-r--r-- | packages/instant/src/components/zero_ex_instant_container.tsx | 12 |
5 files changed, 11 insertions, 9 deletions
diff --git a/packages/instant/public/index.html b/packages/instant/public/index.html index 851d155a9..044a9137b 100644 --- a/packages/instant/public/index.html +++ b/packages/instant/public/index.html @@ -14,6 +14,7 @@ } body { + margin: 0; background-color: rgba(0, 0, 0, 0.2); } </style> diff --git a/packages/instant/src/components/buy_button.tsx b/packages/instant/src/components/buy_button.tsx index 9a70d127f..5a32b9575 100644 --- a/packages/instant/src/components/buy_button.tsx +++ b/packages/instant/src/components/buy_button.tsx @@ -7,7 +7,7 @@ import { Button, Container, Text } from './ui'; export interface BuyButtonProps {} export const BuyButton: React.StatelessComponent<BuyButtonProps> = props => ( - <Container backgroundColor={ColorOption.white} padding="20px" width="100%"> + <Container padding="20px" width="100%"> <Button width="100%"> <Text fontColor={ColorOption.white} fontWeight={600} fontSize="20px"> Buy diff --git a/packages/instant/src/components/order_details.tsx b/packages/instant/src/components/order_details.tsx index f90ee9f6f..dbf2c1f0b 100644 --- a/packages/instant/src/components/order_details.tsx +++ b/packages/instant/src/components/order_details.tsx @@ -7,7 +7,7 @@ import { Container, Flex, Text } from './ui'; export interface OrderDetailsProps {} export const OrderDetails: React.StatelessComponent<OrderDetailsProps> = props => ( - <Container backgroundColor={ColorOption.white} padding="20px" width="100%"> + <Container padding="20px" width="100%"> <Container marginBottom="10px"> <Text letterSpacing="1px" diff --git a/packages/instant/src/components/ui/container.tsx b/packages/instant/src/components/ui/container.tsx index bc47ba0aa..64b5d4129 100644 --- a/packages/instant/src/components/ui/container.tsx +++ b/packages/instant/src/components/ui/container.tsx @@ -18,7 +18,6 @@ export interface ContainerProps { marginBottom?: string; marginLeft?: string; padding?: string; - boxShadow?: string; borderRadius?: string; border?: string; borderColor?: ColorOption; @@ -33,6 +32,7 @@ const PlainContainer: React.StatelessComponent<ContainerProps> = ({ children, cl ); export const Container = styled(PlainContainer)` + box-sizing: border-box; ${props => cssRuleIfExists(props, 'display')} ${props => cssRuleIfExists(props, 'position')} ${props => cssRuleIfExists(props, 'top')} @@ -47,7 +47,6 @@ export const Container = styled(PlainContainer)` ${props => cssRuleIfExists(props, 'margin-bottom')} ${props => cssRuleIfExists(props, 'margin-left')} ${props => cssRuleIfExists(props, 'padding')} - ${props => cssRuleIfExists(props, 'box-shadow')} ${props => cssRuleIfExists(props, 'border-radius')} ${props => cssRuleIfExists(props, 'border')} ${props => cssRuleIfExists(props, 'border-top')} diff --git a/packages/instant/src/components/zero_ex_instant_container.tsx b/packages/instant/src/components/zero_ex_instant_container.tsx index d6df3ccc0..d33b4bfd5 100644 --- a/packages/instant/src/components/zero_ex_instant_container.tsx +++ b/packages/instant/src/components/zero_ex_instant_container.tsx @@ -10,9 +10,11 @@ import { Container, Flex, Text } from './ui'; export interface ZeroExInstantContainerProps {} export const ZeroExInstantContainer: React.StatelessComponent<ZeroExInstantContainerProps> = props => ( - <Flex direction="column" width="350px" justify="flex-start"> - <InstantHeading /> - <OrderDetails /> - <BuyButton /> - </Flex> + <Container hasBoxShadow={true} width="350px" backgroundColor={ColorOption.white}> + <Flex direction="column" justify="flex-start"> + <InstantHeading /> + <OrderDetails /> + <BuyButton /> + </Flex> + </Container> ); |