TWE Design System Components: Sliders

[RobinElayn]

Overview

We need to create Sliders for the TWE design system for the future website development & handoff.

Action Items

• Research styling for Google's M3
• Create Building Blocks (if applicable)
• Research Googles M3 guidelines to see what style, state and/or configuration variants are needed
• Create State Variants (see resource 1.01 and M3 guidelines 1.03)
• Create Configuration Variants (see resource 1.02 and M3 guidelines 1.03)
• Weekly (or more often if needed) communicate changes in issues comments (below) and with design team
• Get sign-off from Design Lead
• Get sign-off from Product Manager (general and dev)
• Update Figma page: Design System - WIP (resource 1.04)
  • Add all the details that canvas asks for (see resources 1.04.01 for example of what/where you are updating)
  • If there is a link with a strike-through on 1.04.02, please go to the link, and remove that content from the NEED TEMPLATE/REVISION section.
• Update Figma page: Microsite Ready for Dev
• Close Issue
• Update epic by checking box TWE Design System: Create Generic Design Components and Mockups #397
• leave a comment on Develop Design System Microsite based on Material for MKDocs #455 with the following text

  Issue #[REPLACE WITH YOUR ISSUE NUMBER] has been released by design
  

Resources/Instructions

• 1.01 State Variants

  • https://m3.material.io/components/sliders/overview

• 1.02 Configuration Variants

  • https://m3.material.io/components/sliders/overview
  • Continuous, Discrete, Centered, Range Selection

• 1.03 Material Design relevant URLs:

  • https://m3.material.io/components/sliders/overview

• 1.04 Figma File: Internships Figma, Design System - WIP

  • 1.04.01 Example Figma page: Design System - WIP, Profile Card

    Details

    

• Google Doc: HfLA Design System Guide for Designers (v2)

[RobinElayn]

Updated styles within component. Checked that all variations were properly linked to Master Component.