Resources Section Template Updates

[r-bartlett-gsa]

User story

As a site user (challenge manager, evaluator or public solver), in order to interact with the site features and content with confidence, I would like to be able to easily access site resources and find help quickly.

Acceptance Criteria:

• Users are able to navigate to resources section by selecting their role
• The following page templates are updated per new designs (screenshots in comments below; designs can also be viewed in Figma: https://www.figma.com/design/sLkJM1Ua9Zu3HW2h4mVdgr/Challenge.gov-Eval-(Updated-01%2F27%2F25)?node-id=7087-101275&t=ZmkvhVHoPmI5Jk9J-0
  • User role icons and cards on homepage are updated
  • Resources page is updated with contact information at the top, followed by cards for linked pages / site sections
  • FAQ page template is updated to use accordions for each question
  • User Guide landing page is updated to include a hero banner, followed by cards for parent categories
  • Two templates for Parent category page are created:
    • To display child categories: page contains a hero banner and cards for child categories
    • To display content without child categories
    • Both templates include a side nav on the left hand side that indicate current category
      • Child categories are expanded only for current categories
  • A template for child category page is create to accommodate content, images and a side nav

Development tasks:

• Task 1
• Task 2

Definition of Done

Doing (dev team)

• Code complete
• Code is organized appropriately
• Any known trade offs are documented in the associated GH issue
• Code is documented, modules, shared functions, etc.
• Automated testing has been added or updated in response to changes in this PR
• The feature is smoke tested to confirm it meets requirements
• Database changes have been peer reviewed for index changes and performance bottlenecks
• PR that changes or adds UI
  • include a screenshot of the WAVE report for the altered pages
  • Confirm changes were validated for mobile responsiveness
• PR approved / Peer reviewed
• Security scans passed
• Automate accessibility tests passed
• Build process and deployment is automated and repeatable
• Feature toggles if appropriate
• Deploy to staging
• Move card to testing column in the board

---

Staging

• Accessibility tested (Marni)
  • Keyboard navigation
  • Focus confirmed
  • Color contrast compliance
  • Screen reader testing
• Usability testing: mobile and desktop (Tracy or Marni)
• Cross browser testing - UI rendering is performant on below listed devices/browsers (Tracy or Marni)
  • Windows/Chrome
  • Windows/Edge
  • Mac/Chrome
  • Mac/Safari
  • iOS/Safari
• AC review (Renata)
• Deploy to production (production-like environment for eval capability) (dev team)
• Move to production column in the board

---

Production

• User and security documentation has been reviewed for necessary updates (Renata/Tracy/Dev team)
• PO / PM approved (Jarah or Renata)
• AC is met and it works as expected (Jarah or Renata)
• Move to done column in the board (Jarah or Renata)

[r-bartlett-gsa]