1
0
mirror of https://github.com/trezor/trezor-wallet synced 2024-11-27 18:58:08 +00:00

fix fee label overflow

This commit is contained in:
slowbackspace 2019-01-09 13:26:42 +01:00
parent 8820aa68f7
commit e59c3436bb
2 changed files with 30 additions and 4 deletions

View File

@ -87,6 +87,19 @@ const FeeOptionWrapper = styled.div`
justify-content: space-between;
`;
const OptionValue = styled(P)`
flex: 0 0 0;
margin-right: 5px;
`;
const OptionLabel = styled(P)`
flex: 0 1 auto;
overflow: hidden;
text-overflow: ellipsis;
text-align: right;
word-break: break-all;
`;
const FeeLabelWrapper = styled.div`
display: flex;
align-items: center;
@ -348,8 +361,8 @@ const AccountSend = (props: Props) => {
options={feeLevels}
formatOptionLabel={option => (
<FeeOptionWrapper>
<P>{option.value}</P>
<P>{option.label}</P>
<OptionValue>{option.value}</OptionValue>
<OptionLabel>{option.label}</OptionLabel>
</FeeOptionWrapper>
)}
/>

View File

@ -74,6 +74,19 @@ const FeeOptionWrapper = styled.div`
justify-content: space-between;
`;
const OptionValue = styled(P)`
flex: 0 0 0;
margin-right: 5px;
`;
const OptionLabel = styled(P)`
flex: 0 1 auto;
overflow: hidden;
text-overflow: ellipsis;
text-align: right;
word-break: break-all;
`;
const FeeLabelWrapper = styled.div`
display: flex;
align-items: center;
@ -302,8 +315,8 @@ const AccountSend = (props: Props) => {
options={feeLevels}
formatOptionLabel={option => (
<FeeOptionWrapper>
<P>{option.value}</P>
<P>{option.label}</P>
<OptionValue>{option.value}</OptionValue>
<OptionLabel>{option.label}</OptionLabel>
</FeeOptionWrapper>
)}
/>