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

119/button styling #132

Merged
merged 10 commits into from
Nov 13, 2024
Merged

119/button styling #132

merged 10 commits into from
Nov 13, 2024

Conversation

nichgalzin
Copy link
Contributor

Description

Closes #119

This pull request includes several updates to the BackButton, PopupCard, and global button styles, along with a minor change to the FavouritesPage component. The most important changes are summarised below:

Updates to BackButton component:

  • Increased the size of the back button in BackButton.css to improve visibility.
  • Removed unnecessary text-xl class from the back button in BackButton.tsx to simplify the styling.

Updates to PopupCard component:

  • Added a new close-button--container class and adjusted the popup-card--remove-button class in PopupCard.css to enhance the styling and positioning of the remove button.
  • Updated the PopupCard.tsx to include a new close button container and refactored the remove button handling for better user interaction.

Global button styles:

  • Modified global button styles in globals.css to reset border, background, and text alignment properties, and added focus styles for better accessibility.

Minor changes:

  • Adjusted the FavouritesPage.tsx to move the key prop to the correct element for better React key management.
  • Updated button styles in PopupInfo.css to align with global button styles and ensure consistency.

UI changes

Screenshot 2024-11-13 at 09 52 08

@nichgalzin nichgalzin marked this pull request as ready for review November 13, 2024 09:53
Copy link
Contributor

@camelPhonso camelPhonso left a comment

Choose a reason for hiding this comment

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

It's looking sharp but we've got some unintended changes going on need a bit of a fix for the z-index in the new buttons

src/components/globals.css Outdated Show resolved Hide resolved
src/components/PopupCard/PopupCard.css Show resolved Hide resolved
Copy link
Contributor

@camelPhonso camelPhonso left a comment

Choose a reason for hiding this comment

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

Smashing!

@camelPhonso camelPhonso merged commit d9f451e into dev Nov 13, 2024
1 check passed
@camelPhonso camelPhonso deleted the 119/button-styling branch November 13, 2024 12:42
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.

Fix button focus for accessibility and keyboard navigation
2 participants