Skip to content
This repository has been archived by the owner on Jun 24, 2022. It is now read-only.

Use theme colors. #2113

Merged
merged 4 commits into from
Jan 14, 2022
Merged

Use theme colors. #2113

merged 4 commits into from
Jan 14, 2022

Conversation

fairlighteth
Copy link
Contributor

Summary

Waterfall PR start, to gradually further improve the CLAIM flow styling. This one:

  • Refactors the claim styles, by using the CowSwap theme colors instead.
  • Show 0 CoW by using the 0 as a fallback number.

Screen Shot 2022-01-12 at 15 54 36

Screen Shot 2022-01-12 at 15 54 30

@fairlighteth fairlighteth requested review from a team January 12, 2022 14:57
@github-actions
Copy link
Contributor

  • 🔭 GP Swap: Gnosis Protocol v2 Swap UI

@elena-zh
Copy link

Hey @biocom , great changes!

Some questions:

  1. Claim page itself looks fine, but when compare it with the 'Swap' page, espesially in a mobile view, it becomes highly visible that we use different boarder radius for forms on pages
    claim

swap

  1. As for the background, we also use mix of designs for Swap/Content pages on the Claim page. I mean, there is a clear background+black boarder on the form on the Swap page; blurred background and almost transaparen section boarder on a content page. But on the Claim page we use blurred background and the Black boarder. Should we leave it as it is?
  2. I'm not sure if this issue is related to the current PR or not, but it would be nice to remove 'token' from the validation message
    image

Thanks!

@elena-zh
Copy link

elena-zh commented Jan 12, 2022 •
edited
Loading

  1. Grid lines are visible in the dark mode and not visible in the light mode. Could we make them visible on both themes?
    image
    image

  2. The same with instructions on the Approve tokens page.
    image
    image
    But I'd remove a different color there

  3. I would change checkboxes color to match more or less the themes colors (I see them in blue in Win10)

  4. Maybe we could make the positive message look brighter a bit? Looks a bit depressive to me..
    image

@elena-zh
Copy link

I did not report issue related to a mobile view, due to as far as I can understand, it will be covered in another PR.

anxolin pushed a commit that referenced this pull request Jan 12, 2022
@JFrankfurt
add link (#2113)
a7f5991
alfetopito
alfetopito approved these changes Jan 12, 2022
View reviewed changes
Copy link
Contributor

@alfetopito alfetopito left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looking absolutely gorgeous 10/10 would claim again

src/custom/pages/Claim/ClaimSummary.tsx Outdated
@@ -31,7 +31,7 @@ export default function ClaimSummary({ hasClaims, unclaimedAmount }: ClaimSummar
<div>
<ClaimTotal>
<b>Total available to claim</b>
<p>{formatSmart(unclaimedAmount)} vCOW</p>
<p>{formatSmart(unclaimedAmount) || 0} vCOW</p>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for that 👍

anxolin
anxolin approved these changes Jan 13, 2022
View reviewed changes
Copy link
Contributor

@anxolin anxolin left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nice!

fairlighteth and others added 3 commits January 14, 2022 10:27
@fairlighteth
Update header button and misc styling. (#2129)
fef1965 
* Update header button and misc styling.

* Update header button mobile part 1. (#2132)

* Update header button mobile part 1.

* Re-structure claim button and mobile responsive. (#2137)

* Re-structure claim button and mobile responsive.

* Claim style improve 5 (#2146)

* Update

* Update

* Investing table styling start
@fairlighteth
Merge branch 'claim' into claim-styleImprove-1
b616bbf
Post merge styling.
0c52d81
@fairlighteth fairlighteth requested a review from a team January 14, 2022 11:11
This was referenced Jan 14, 2022
Closed
Closed
Closed
@W3stside
Copy link
Contributor

cool! seeing border radius issues, maybe weren't fixed yet:
image

@fairlighteth
Copy link
Contributor Author

cool! seeing border radius issues, maybe weren't fixed yet: image

Yes one of the things I still need to polish...

@elena-zh
Copy link

I noticed that in the current PR something wrong with claim amounts:

  1. the app still shows available to claim tokens when they have beed already claimed
    0

  2. Airdrop claim option is not displayed in the investment grid
    missing

@elena-zh elena-zh mentioned this pull request Jan 14, 2022
Merged
@fairlighteth fairlighteth merged commit 37fcffd into claim Jan 14, 2022
@alfetopito alfetopito mentioned this pull request Jan 25, 2022
Merged
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@alfetopito alfetopito alfetopito approved these changes

@anxolin anxolin anxolin approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
5 participants
@fairlighteth @elena-zh @W3stside @alfetopito @anxolin