Claim style improve 20

[fairlighteth]

Summary

• Styling of investing summary table
• Progress bar styling
• Replace GNO icon with more recent one
• Adding xDAI logo image. Needs to be linked up with @alfetopito PR where he commented xDAI out for now.
• General image compression

Screen.Recording.2022-01-20.at.14.05.16.mov

Todo:

• Improve styles a bit more on the summary table. Mainly spacing things out.
• Decide on what content to show. I suggested to inform the user on each investment, that they cannot invest the remaining amount after claiming. This is only shown on <100 or >0 percentage numbers.

[fairlighteth]

Noticed the % string missing in the progress bar, when on the investing summary (last) page. This happens only on smaller percentage numbers.

[fairlighteth]

Noticed the % string missing in the progress bar, when on the investing summary (last) page. This happens only on smaller percentage numbers.

A fix has been pushed to solve for this:

[github-actions]

• 🔭 GP Swap: Gnosis Protocol v2 Swap UI

[elena-zh]

Hey @biocom , will it be fixed when responsive views are implemented?

[fairlighteth]

When you selected an investment, but end up not investing at all

we could still show the row. But then emphasize that you won't be able to invest later. Something like this message:

And perhaps hide the progress bar (when 0%).

What do you think?

[elena-zh]

I would disable 'Review' button when one of the selected options has 0 amount..

And one of the selected options does not have an 'approved' token

[elena-zh]

Could we please round this amount to 2 decimals?

[elena-zh]

Also, I still think that it would be great to make this text left-aligned

[alfetopito]

When you selected an investment, but end up not investing at all

we could still show the row. But then emphasize that you won't be able to invest later. Something like this message:

And perhaps hide the progress bar (when 0%).

What do you think?

This will not be possible when we implement the proper validations, so don't worry about handling it as a special case

[alfetopito]

Looks awesome!

I say we merge as is (after rebasing against develop) and I can address the pending code related comments in a follow up PR

[anxolin]

❤️ pretty!