diff options
author | fragosti <francesco.agosti93@gmail.com> | 2018-10-24 06:01:22 +0800 |
---|---|---|
committer | fragosti <francesco.agosti93@gmail.com> | 2018-10-24 06:01:22 +0800 |
commit | f0c79473bdaeb87f49a9eb59fc88336f02e81546 (patch) | |
tree | d2b0876b2732fe5bd71ee3af9d315f947029c491 | |
parent | b7a5e40c62adfbd8732b3cd98d2c989a6a021c54 (diff) | |
download | dexon-0x-contracts-f0c79473bdaeb87f49a9eb59fc88336f02e81546.tar dexon-0x-contracts-f0c79473bdaeb87f49a9eb59fc88336f02e81546.tar.gz dexon-0x-contracts-f0c79473bdaeb87f49a9eb59fc88336f02e81546.tar.bz2 dexon-0x-contracts-f0c79473bdaeb87f49a9eb59fc88336f02e81546.tar.lz dexon-0x-contracts-f0c79473bdaeb87f49a9eb59fc88336f02e81546.tar.xz dexon-0x-contracts-f0c79473bdaeb87f49a9eb59fc88336f02e81546.tar.zst dexon-0x-contracts-f0c79473bdaeb87f49a9eb59fc88336f02e81546.zip |
fix: dont allow heading to change height when input size changes
-rw-r--r-- | packages/instant/src/components/instant_heading.tsx | 4 | ||||
-rw-r--r-- | packages/instant/src/components/ui/container.tsx | 3 | ||||
-rw-r--r-- | packages/instant/src/components/ui/flex.tsx | 3 |
3 files changed, 7 insertions, 3 deletions
diff --git a/packages/instant/src/components/instant_heading.tsx b/packages/instant/src/components/instant_heading.tsx index defe3b8b1..7664d31ae 100644 --- a/packages/instant/src/components/instant_heading.tsx +++ b/packages/instant/src/components/instant_heading.tsx @@ -69,7 +69,9 @@ export const InstantHeading: React.StatelessComponent<InstantHeadingProps> = pro </Text> </Container> <Flex direction="row" justify="space-between"> - <SelectedAssetAmountInput startingFontSizePx={45} /> + <Flex height="65px"> + <SelectedAssetAmountInput startingFontSizePx={45} /> + </Flex> <Flex direction="column" justify="space-between"> <Container marginBottom="5px"> <Text fontSize="16px" fontColor={ColorOption.white} fontWeight={500}> diff --git a/packages/instant/src/components/ui/container.tsx b/packages/instant/src/components/ui/container.tsx index 8b204826d..293042120 100644 --- a/packages/instant/src/components/ui/container.tsx +++ b/packages/instant/src/components/ui/container.tsx @@ -1,4 +1,3 @@ - import { ColorOption, styled } from '../../style/theme'; import { cssRuleIfExists } from '../../style/util'; @@ -10,6 +9,7 @@ export interface ContainerProps { bottom?: string; left?: string; width?: string; + height?: string; maxWidth?: string; margin?: string; marginTop?: string; @@ -37,6 +37,7 @@ export const Container = styled<ContainerProps, 'div'>('div')` ${props => cssRuleIfExists(props, 'bottom')} ${props => cssRuleIfExists(props, 'left')} ${props => cssRuleIfExists(props, 'width')} + ${props => cssRuleIfExists(props, 'height')} ${props => cssRuleIfExists(props, 'max-width')} ${props => cssRuleIfExists(props, 'margin')} ${props => cssRuleIfExists(props, 'margin-top')} diff --git a/packages/instant/src/components/ui/flex.tsx b/packages/instant/src/components/ui/flex.tsx index 2b430129d..d4e14d979 100644 --- a/packages/instant/src/components/ui/flex.tsx +++ b/packages/instant/src/components/ui/flex.tsx @@ -1,4 +1,3 @@ - import { ColorOption, styled } from '../../style/theme'; import { cssRuleIfExists } from '../../style/util'; @@ -8,6 +7,7 @@ export interface FlexProps { justify?: 'flex-start' | 'center' | 'space-around' | 'space-between' | 'space-evenly' | 'flex-end'; align?: 'flex-start' | 'center' | 'space-around' | 'space-between' | 'space-evenly' | 'flex-end'; width?: string; + height?: string; backgroundColor?: ColorOption; className?: string; } @@ -19,6 +19,7 @@ export const Flex = styled<FlexProps, 'div'>('div')` justify-content: ${props => props.justify}; align-items: ${props => props.align}; ${props => cssRuleIfExists(props, 'width')} + ${props => cssRuleIfExists(props, 'height')} background-color: ${props => (props.backgroundColor ? props.theme[props.backgroundColor] : 'none')}; `; |