aboutsummaryrefslogtreecommitdiffstats
path: root/packages/instant/src
diff options
context:
space:
mode:
authorfragosti <francesco.agosti93@gmail.com>2018-10-24 06:01:22 +0800
committerfragosti <francesco.agosti93@gmail.com>2018-10-24 06:01:22 +0800
commitf0c79473bdaeb87f49a9eb59fc88336f02e81546 (patch)
treed2b0876b2732fe5bd71ee3af9d315f947029c491 /packages/instant/src
parentb7a5e40c62adfbd8732b3cd98d2c989a6a021c54 (diff)
downloaddexon-0x-contracts-f0c79473bdaeb87f49a9eb59fc88336f02e81546.tar.gz
dexon-0x-contracts-f0c79473bdaeb87f49a9eb59fc88336f02e81546.tar.zst
dexon-0x-contracts-f0c79473bdaeb87f49a9eb59fc88336f02e81546.zip
fix: dont allow heading to change height when input size changes
Diffstat (limited to 'packages/instant/src')
-rw-r--r--packages/instant/src/components/instant_heading.tsx4
-rw-r--r--packages/instant/src/components/ui/container.tsx3
-rw-r--r--packages/instant/src/components/ui/flex.tsx3
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')};
`;