Design: Update design for Submit Snapshot tables

[NilakshiS]

Dependency

• Design System: Consistency between table headers #2013

Overview

Please update the design of the table on the Submit Snapshot page so that it is consistent with the updated style guidelines from #2013 .

Details

The design of the tables on the Submit Snapshot page is inconsistent with the updated table design on the style guide. Incorporate blue section headers and other style guide updates to the design of this table so that it looks more cohesive with the rest of the website. Changes to improve readability of the page such as spacing, alignment, or change in font properties can be explored. However, the content and structure should remain the same. All changes must adhere to the design system.

Action Items

• Wait for Design System: Consistency between table headers #2013 to be completed.
• Design a UI mockup that solves this issue in accordance with the style guide updates from Design System: Consistency between table headers #2013 .
• Review with the design team. Update designs if needed based on feedback.
• Review with the product, development, and research teams. Update designs if needed based on feedback.
• Add a slide to the the staging deck.
• After the slide has been approved by production, move it to the stakeholder presentation deck for the next stakeholder meeting.
• Review the design at the stakeholder meeting. Update designs if needed based on feedback.
• After getting stakeholder approval, create a design handoff for the development team.

Resources/Instructions

• Link to Submit Snapshot on TDM Calculator Dev site
• Create separate form for submission #1407
• Link to the Design System on Figma