Skip to content

OCD-5313 Adjust Footer & Other Styling Elements - #1523

Open
mattystank wants to merge 14 commits into
chpladmin:stagingfrom
mattystank:OCD-5313
Open

OCD-5313 Adjust Footer & Other Styling Elements #1523
mattystank wants to merge 14 commits into
chpladmin:stagingfrom
mattystank:OCD-5313

Conversation

@mattystank

@mattystank mattystank commented Jul 20, 2026

Copy link
Copy Markdown
Contributor

This pull request introduces several UI improvements and refactorings to enhance layout consistency, loading feedback, and page structure across the application. The most significant updates include the addition of a global route loading spinner, refactoring of page layouts to use standardized ChplPageHeader and ChplPageBody components, and various style and code cleanups for better maintainability.

Global Loading Feedback:

  • Implemented a global route loading spinner that appears during all route transitions, ensuring users receive consistent visual feedback when navigating between pages. The spinner is shown for a minimum duration to guarantee visibility. (src/app/index.run.js, src/app/components/util/chpl-loading-spinner.jsx, [1] [2] [3]

Page Layout Refactoring:

  • Refactored several pages (Compare, Listing Edit, Complaints Wrapper) to use the new ChplPageHeader and ChplPageBody components, replacing custom header and container code for improved consistency and easier future maintenance. (src/app/pages/compare/compare.jsx, src/app/pages/listing/listing-edit.jsx, src/app/components/surveillance/complaints/complaints-wrapper.jsx, [1] [2] [3] [4]

Component and Style Updates:

  • Enhanced the ChplPageHeader component to support additional props like actions and titleAdornment, allowing for more flexible header content. (src/app/components/util/chpl-page-header.jsx, [1] [2] [3]
  • Updated the AppWrapper and navigation layout to use CSS flexbox, ensuring the footer stays at the bottom and content fills the viewport. (src/app/app-wrapper.jsx, [1] [2]; src/app/navigation/navigation-bottom.jsx, [3]

Code and Style Cleanup:

  • Removed redundant container and header styles from individual pages in favor of the new shared components, simplifying the codebase. (src/app/pages/compare/compare.jsx, [1]; src/app/components/listing/listing-edit-upload.jsx, [2] [3] [4] [5] [6]

Miscellaneous:

  • Added ChplLoadingSpinner to the shared util exports for use throughout the app. (src/app/components/util/index.js, [1] [2]
  • Minor style adjustments for Swagger UI and other UI elements. (src/app/index.scss, [1]; src/app/index.js, [2]

These changes collectively improve the user experience, visual consistency, and maintainability of the application.

…illance pages for improved layout

[#OCD-5313]
…geHeader and ChplPageBody components for improved layout

[#OCD-5313]
…ody components for improved layout consistency

[#OCD-5313]
# Conflicts:
#	src/app/app-wrapper.jsx
#	src/app/pages/reports/questionable-activity/questionable-activity-view.jsx
#	src/app/pages/resources/api/api.jsx
#	src/app/pages/resources/cms-lookup/cms-lookup.jsx
#	src/app/pages/resources/download/download.jsx
#	src/app/pages/surveillance/activity-reporting/activity-reporting.jsx
Restore ChplPageHeader/ChplPageBody + Card layout migration on top of the
upstream/staging merge, reconciled with the CloudDownloadOutlinedIcon
standardization and HashProvider from staging.

[#OCD-5313]
…geBody components in ChplComparePage

[#OCD-5313]
…d ChplPageBody in multiple pages

[#OCD-5313]
@mattystank
mattystank marked this pull request as ready for review July 21, 2026 18:53
@mattystank
mattystank requested a review from andlar as a code owner July 21, 2026 18:53
Comment thread src/app/components/util/chpl-loading-spinner.jsx Outdated
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.

2 participants