hackforla / hackforla/internship
TWE Design System Components: Input Cards
- Dominant language
- CSS
- Stars
- 20
- Forks
- 6
- PR merge metrics
- No merged PRs in 30d
Description
### Dependencies
- [ ] https://github.com/hackforla/internship/issues/739
### Overview
We need to create Input Cards for the TWE design system for the future website development & handoff.
### Input Cards
These cards can be used in forms and data collection interfaces within the website. These cards are designed to present a form field or a set of related form fields in an organized manner. They can display error messages or validation feedback to users when they submit incomplete or incorrect data, helping users correct their inputs.
### Action Items
- [ ] Research general styling for Google's M3
- [ ] Research M3 Cards
- [ ] Create Building Blocks - or see which current components will be included (i.e. dropdown menus, text fields).
- [ ] Create Style variations
- [ ] Create Configuration Variants
- [ ] 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
- [ ] 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 https://github.com/hackforla/internship/issues/397
- [ ] leave a comment on https://github.com/hackforla/internship/issues/455 with the following text
```
Issue #[REPLACE WITH YOUR ISSUE NUMBER] has been released by design
```
### Resources/Instructions
- 1.03 Material Design relevant URLs:
[ - https://mui.com/material-ui/react-pagination/?srsltid=AfmBOoqIAc8UpVZFqrmV7CezCdmdnTuHvSlxTzoaMNZ8OgyPlRfdNpQE)](https://m3.material.io/components/cards/overview)
- 1.04 Figma File: [Internships Figma, Design System - WIP](https://www.figma.com/file/TTRS2FWXsrymHYpPJL1IdH/Internship-Team-Main-file?node-id=2-45&t=UnquUaQhvcuGgsKH-0)
- 1.04.01 Example Figma page: Design System - WIP, Profile Card
Details

- 1.04.02 ~[Internship Figma File, Design System, Pagination](https://www.figma.com/design/TTRS2FWXsrymHYpPJL1IdH/Internship-Team-Main-file?node-id=2790-13408&t=LIwAbNbbuuqGDm0N-0)~ -We're going to replace this
- Google Doc: [HfLA Design System Guide for Designers (v2)](https://docs.google.com/document/d/14BZYFEa5s5FESeASNorEDLH6zEW0LTYcpD1NVyE66iM/edit#heading=h.pq5p3t1w1lw2)
Contributor guide
Assessment
This issue has not been assessed yet.