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

mobile first UI improvements #655

Merged
merged 13 commits into from
Dec 5, 2023
Merged

Conversation

dpgraham4401
Copy link
Member

@dpgraham4401 dpgraham4401 commented Dec 5, 2023

Description

This PR makes a few changes to our UI to make the browser interface much more pleasant on mobile viewports, as well as some general refactoring/leaving the code in better place than we found it.

  1. We remove the SiteTable and replace it with a SiteListGroup. Since we've removed the table (which inherently was more sort-able) we included a new filter feature to help a user find a specific fite.
  2. We've removed some of the placeholder... garbage that was on the home page and replaced them with... well more placeholder garbage. But it's pretty placeholder garbage, a series of charts that mock what kind of information we could include on a user dashboard.
  3. adjust the style of some of our UI components (e.g., do not include a bright blue header on all cards). I'm still not getting into a theme, but this is looking a little less bootstrap-y.
  4. Cleaned up some things such as...
    • move more server queries to redux toolkit query
    • consolidate static assets into the public directory
    • remove unused components
    • fix layout of some components
    • move hard coded URLs to environment configs

Issue ticket number and link

Checklist

  • I have added tests that prove my fix is effective or that my feature works
  • I have commented my code, particularly in hard-to-understand areas
  • I have made corresponding changes to the documentation
  • My changes generate no new warnings

…omponents/features. While lazy loading components we use HtSpinner to signal to user
component-alize About section parts, use open sans for font, and jost for headers, and sans-serif as backup
…placeholder area chart on quantity of hazardous waste generated through current month
…ce the SiteTable but display the information well on mobile viewports. The new SiteList feature can also be filtered by EPA ID number and site name. Functionally, the SiteList feature stores state and the URL

remove old SiteTable component
…ng a single site's information from the server to our haztrakApi API RTK query slice
…ist of available by either EPA ID or site name. It stores state in the URL as query parameters. It shows a winking robot if no sites are returned.
@github-actions github-actions bot added client Related to front end workings (React/Redux) dependencies project dependency problems or modifications infrastructure changes dealing with our deployment setup and IaC labels Dec 5, 2023
@dpgraham4401 dpgraham4401 merged commit 2348b29 into USEPA:main Dec 5, 2023
6 checks passed
@dpgraham4401 dpgraham4401 deleted the UX_revamping branch December 5, 2023 00:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
client Related to front end workings (React/Redux) dependencies project dependency problems or modifications infrastructure changes dealing with our deployment setup and IaC
Projects
No open projects
Status: Done
Development

Successfully merging this pull request may close these issues.

1 participant