Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix: Funds card hover state #4043

Merged
merged 2 commits into from
Jan 13, 2025
Merged

Conversation

iamsamgibbs
Copy link
Contributor

Description

This PR addresses an issue where the funds cards were clickable before the card content had loaded in. It also fixes the hover styling.

Testing

Reload and hover over the funds whilst they are loading, make sure they are not clickable.

Once the are fully loaded, check the hover styling matches figma.

Screenshot 2025-01-07 at 15 47 13

Figma: https://www.figma.com/design/gac6xVgGNCAge5Bia933dp/Dashboard?node-id=4878-84953&t=OpWCmWBoyrScYokI-4

Diffs

New stuff

  • Added isLoading prop to WidgetCardsItem component and disabled button wrapper whilst loading

Changes 🏗

  • Fixed hover styling

Resolves #3654

@iamsamgibbs iamsamgibbs self-assigned this Jan 7, 2025
@iamsamgibbs iamsamgibbs marked this pull request as ready for review January 7, 2025 15:48
@iamsamgibbs iamsamgibbs requested a review from a team as a code owner January 7, 2025 15:48
Copy link
Contributor

@rumzledz rumzledz left a comment

Choose a reason for hiding this comment

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

Can confirm the cards are not clickable when they are in a loading state 💯

non-clickable

Copy link
Contributor

@bassgeta bassgeta left a comment

Choose a reason for hiding this comment

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

Nice and straight to the point 👌
Hover matches Figma ✔️
image

and they're not clickable when they load 💯

Copy link
Contributor

@mmioana mmioana left a comment

Choose a reason for hiding this comment

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

Nice work on this one @iamsamgibbs 🙌

Cards are no longer clickable while loading and the hover state matches Figma 😎

Screen.Recording.2025-01-13.at.09.45.45.mov

@iamsamgibbs iamsamgibbs merged commit 257394c into master Jan 13, 2025
2 checks passed
@iamsamgibbs iamsamgibbs deleted the fix/3654-funds-card-hover-state branch January 13, 2025 09:18
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

QA Dashboard: Remove hover & select on skeleton state
4 participants