Request type legend - map - collapsible (desktop/mobile)

[adamkendis]

Description

A collapsible map legend displaying request type names and colors.

Action Items

Standard stuff:

• Functional component using React Hooks strongly encouraged.
• Styling via one of material-ui's styling options.

Component stuff:

1. Implement button to show map legend. Use material-ui.

   • Must be able to tab to the button. (desktop)
   • When button is focused, activate via mouseclick, space or enter keypresses. (desktop)
   • Tap to activate (mobile).

2. Implement legend.

   • When open, the close/X button should be tabbable. (desktop)
   • Close/X button activated via mouseclick, space or enter keypresses. (desktop)
   • Close/X button activated via tap (mobile)
   • Individual items within the legend should not be tabbable (probably - discuss if you think otherwise)
   • Do not hardcode the request types/colors into the component jsx. We will ultimately fetch the request types/colors from the backend. Basically, this component should receive and render the list via props. Okay to create a list of request types/colors for frontend use until backend is ready.

Resources

https://material-ui.com/styles/advanced/#makestyles

Collapsed:

Expanded:

[tan-nate]

Still working on this, took a little while than I thought wrapping my head around Material UI. Got the expanded legend done and now just working on the collapsible feature.

[adamkendis]

Moving ticket to prioritized backlog. In progress branch https://github.com/hackforla/311-data/tree/834-collapsible-legend

[github-actions]

This issue is stale because it has been open 90 days with no activity. Remove stale label or comment or this will be closed in X days.

[captain-nimo]

Please provide update:

1. Progress
2. Blocks
3. Availability
4. ETA

[KristenDLR]

Progress: In progress, material-ui button to show map legend.
Blocks: Need some guidance on functionality, will discuss a scheduled meeting for this upcoming week.
Availability: Wednesday anytime after 2pm, Friday anytime after 2pm

[KristenDLR]

Progress: Component constructed and finishing styling with makeStyles/themes

Blocks:

• When open, the close/X button should be tabbable. (desktop)
• Close/X button is activated via mouseclick, space or enter keypresses. (desktop)
• Close/X button activated via tap (mobile)

Availability: Monday anytime before 8pm, or Wednesay anytime.

[KristenDLR]

Progress: Issued pull request, collapsable legend. After the meeting and PR received suggested changes. Will be working on it this week, for next week's review.

[ExperimentsInHonesty]

@KristenDLR Please provide update

1. Progress
2. Blockers
3. Availability
4. ETA

[ExperimentsInHonesty]

@KristenDLR Please provide update
Progress
Blockers
Availability
ETA