arno/trezor-wallet
1
0
Fork 0
mirror of https://github.com/trezor/trezor-wallet synced 2024-12-23 23:48:07 +00:00
Code Issues Releases Wiki Activity

Fix AdvanceForm composition for a smaller screen width

Browse Source
This commit is contained in:
Vasek Mlejnsky 2018-09-24 10:45:40 +02:00
parent 86fbce53a5
commit 162ddebd6c
1 changed files with 18 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/views/Wallet/views/AccountSend/components/AdvancedForm/index.js
View File

@ -13,6 +13,11 @@ import ICONS from 'config/icons';
import type { Props } from '../../Container';
// TODO: Decide on a small screen width for the whole app
// and put it inside config/variables.js
// same variable also in "AccountSend/index.js"
const SmallScreenWidth = '850px';
const InputRow = styled.div`
margin-bottom: 20px;
`;
@ -38,12 +43,24 @@ const AdvancedSettingsWrapper = styled.div`
const GasInputRow = styled(InputRow)`
width: 100%;
display: flex;
@media screen and (max-width: ${SmallScreenWidth}) {
flex-direction: column;
}
`;
const GasInput = styled(Input)`
min-height: 85px;
&:first-child {
padding-right: 20px;
}
@media screen and (max-width: ${SmallScreenWidth}) {
&:first-child {
padding-right: 0;
margin-bottom: 2px;
}
}
`;
const StyledTextarea = styled(Textarea)`
@ -204,7 +221,7 @@ const AdvancedForm = (props: Props) => {
</InputLabelWrapper>
)}
bottomText={errors.data || warnings.data || infos.data}
disabled={networkSymbol !== currency}
isDisabled={networkSymbol !== currency}
value={networkSymbol !== currency ? '' : data}
onChange={event => onDataChange(event.target.value)}
/>