TWE Design System Components: Input Cards

karina-sato commented 1 year ago

Dependency

[x] #543
[x] #542
[x] #538

Overview

We need to create components 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

[ ] Create organized component
[ ] Create variations (ex: website, mobile, other states)
[ ] Organize the handoff layout for dev
[ ] When these steps are done, go to https://github.com/hackforla/internship/issues/402 and check off the dependency.
[ ] Add this issue to the icebox, with a dependency label, and remove your assignment.
[ ] Add comment that identifies which micosite template this one will use.
[ ] When this issue is complete, please check it as "done" and add label "ready for the dev lead"

Resources/Instructions

mklmrgn commented 9 months ago

Update and Proposed Solutions

See my sandbox page for more https://www.figma.com/file/TTRS2FWXsrymHYpPJL1IdH/Internship-Team-Main-file?type=design&node-id=4534%3A19148&mode=design&t=1dYg6Rz9hyIBllBl-1

Challenges -Incorporating different types of atoms (Text input fields, dropdowns, etc) -Expandable, Flexible, 1 or 2 Item rows

Possible Features Title and Supporting text

Text Input Fields -possible various arrangements -Includes larger text area field component

Option to swap for various Input Selections -Dropdown -Date picker -Check box

Proposed Solutions

karina-sato commented 9 months ago

Hi @mklmrgn , I added the dependencies to this issue. As mentioned in our team meeting, we need to finish the dependencies before moving on. Can you update how far you went in this issue, unassign yourself, and put it back in the ice box?

hackforla / internship