feat: Relates to #337. Part 2 of 2 - Change Tx Recap Unlock design#364
feat: Relates to #337. Part 2 of 2 - Change Tx Recap Unlock design#364amaury1093 merged 23 commits intomasterfrom
Conversation
* Create TokenAddress similar to TokenBalance but doesn't need balance info from @withbalance
|
I've pushed another commit that allows the user to copy the address of the card that's used on that screen
|
There was a problem hiding this comment.
Thanks, it looks good. Some nits:
- Can we try to keep the same spacing as on the account list (but keep the full address of course on the approve sceen). Here is a side by side:
account list:
approve screen:
^ Also reducing the space with the icon may enable us to keep the same font size for the address accross both screens while making the address fit on 1 line.
PR unrelated nits, at your own will.
- I realized that the password field isn't autofocused, could we add it?
- can we rename the "Cancel" button with "Back", because all it does is go back :)
…own font size * Use `-webkit-transform-origin-x: 0;` to have no padding on left side when scale font size smaller. See https://stackoverflow.com/questions/13031158/unwanted-left-margin-when-using-webkit-transform-scale * Refactor code to only use `shortAddress` to determine whether to show full address on screen. `screen` prop not necessary * Remove `-narrow` from Information and Name, only need it for Address component * Increase scale to 0.95 so address just fits in on the tx summary page that uses the Unlock component
|
@Tbaut I found out that doing So I was able to keep the same spacing as on the account list page (but using full address on the approve screen). Both just have Note: I had to scale the address font-size down to 95% to fit it in on the approve screen.
|
|
@Tbaut I've pushed a commit so it's also shown on SignedTxSummary |
|
I get a
|
|
@Tbaut I've pushed a commit that removes the invalid |
amaury1093
left a comment
amaury1093
left a comment
There was a problem hiding this comment.
FetherForm.Field is a "dumb" component, just UI. We need to connect it to state (via react-final-form) with <Field render={FetherForm.Field} />
I get the following erorr now.
| /> | ||
|
|
||
| <Field | ||
| <FetherForm.Field |
There was a problem hiding this comment.
We need to use Field from final-form here, with the correct render prop
There was a problem hiding this comment.
@amaurymartiny I've pushed a commit that addresses the issue. I also changed it from defaultValue to value to overcome a warning
…om defaultValue to value to overcome warning
amaury1093
left a comment
amaury1093
left a comment
There was a problem hiding this comment.
Works well! Just 2 small nits
| className='form_field_amount' | ||
| as='textarea' | ||
| className='form_field_value' | ||
| value={tx.to} |
There was a problem hiding this comment.
The values are already set in initialValues a couple of lines above, so we don't need value here
| as='textarea' | ||
| className='-sm' | ||
| className='form_field_value' | ||
| value={`${tx.amount} ${token.symbol}`} |
There was a problem hiding this comment.
same here, set the initial value above to ${tx.amount} ${token.symbol}
…xisting initialValue for Amount
|
@amaurymartiny I've pushed a commit addressing your latest comments, thanks |
3 participants
Part 2 of 2 - Transaction Recap (see second wireframe #337)
This PR just covers the 2nd wireframe of issue #337.
Note that a separate PR has been made for Part 1 of 2 - Account View
Create TokenAddress similar to TokenBalance but doesn't need balance info from @withbalance
Narrow full address so it fully fits
Copyable card address