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

Table: Fixed border issue #7432

Merged
merged 9 commits into from
Apr 4, 2024
Merged

Table: Fixed border issue #7432

merged 9 commits into from
Apr 4, 2024

Conversation

clmedders
Copy link
Contributor

@clmedders clmedders commented Mar 20, 2024

Summary

Fixed table styles and improved code quality and readability.

Preview

Link to Preview

Solution

Removed and updated custom table styles that were conflicting base USWDS designs.

This was found 11 times through out the site but have been checked and not major visual regressions were found but all tables are now looking like the USWDS table design.

Below is a table to compare the live site to what the tables will look like with this update.

Live Preview
about page - live about page - preview
hcd feedback page - live hcd feedback page - preview
hcd methods page - live hcd methods page - preview
understanding data guide - live understanding data guide - live
only table not broken - live only table not broken - preview
content page - live content page - preview
content page - live content page - preview
resource page - live resource page - preview
resource page - live resource page - preview
resource page - live resource page - preview
resource page - live resource page - preview

How To Test

  1. Visit the the links in the table above and verify that tables are now designed as USWDS tables.

Dev Checklist

  • PR has correct labels
  • A11y testing (voice over testing, meets WCAG, run axe tools)
  • Code is formatted properly

Copy link

🔍 Preview in Federalist

@clmedders clmedders changed the title Cm table bug Table: Fixed border issue Mar 20, 2024
@clmedders clmedders self-assigned this Mar 20, 2024
@clmedders clmedders added the Dev: frontend ideas and issues related to the presentation layer of the site label Mar 22, 2024
@clmedders clmedders marked this pull request as ready for review March 22, 2024 13:33
nick-mon1

This comment was marked as outdated.

- Avoid nested selector
- Use baseline alignment instead of `super` for improved readability
Copy link
Contributor

@mejiaj mejiaj left a comment

Choose a reason for hiding this comment

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

Looks good.

I've updated alignment to baseline for readability in 5728896. It was previously set as super, but that can cause unexpected display issues - vertical-align - CSS: Cascading Style Sheets | MDN.

@mejiaj mejiaj requested a review from nick-mon1 March 28, 2024 15:55
Copy link
Contributor

@nick-mon1 nick-mon1 left a comment

Choose a reason for hiding this comment

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

Thanks @mejiaj for the correction. Approved!

@ToniBonittoGSA ToniBonittoGSA self-requested a review April 4, 2024 15:11
Copy link
Contributor

@ToniBonittoGSA ToniBonittoGSA left a comment

Choose a reason for hiding this comment

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

Looks great!

@ToniBonittoGSA ToniBonittoGSA merged commit 413b0e6 into main Apr 4, 2024
4 checks passed
@ToniBonittoGSA ToniBonittoGSA deleted the cm-table-bug branch April 4, 2024 15:11
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Dev: frontend ideas and issues related to the presentation layer of the site
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants