codeforpdx / PASS

PASS project - with HMIS module integration
MIT License
24 stars 23 forks source link

[Enhancement] - Add responsive mobile view for contacts table #648

Open andycwilliams opened 1 month ago

andycwilliams commented 1 month ago

Describe the Current Behavior/Feature:

606 covers refactoring the Documents table. This covers the one for Contacts.

Rationale:

Makes it responsive for small screens.

Proposed Changes:

Refactor table to match Figma design:

2024-05-29
andycwilliams commented 3 weeks ago

I'm experimenting with different styles of the card since there is more that needs to be included than is in the Figma design.

Right now I see two possible approaches.

Version 1: Dropdown menu

Card:

menu1a

Card (menu open):

menu1b

Card (with Web ID):

menu2

Version 2: Expand card

Card:

menu3a

Card (expanded):

menu3b

These are just to demonstrate. The final layout for whatever we choose will be cleaner.

Let me know your thoughts, whether you prefer one over the other, or have alternative ideas.