311-data icon indicating copy to clipboard operation
311-data copied to clipboard

Published 20 hours ago • verified publisher icon hackforla

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

Open adamkendis opened this issue 4 years ago • 9 comments

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)
    • [x] 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: Screen Shot 2020-11-19 at 5 26 06 PM

Expanded: Screen Shot 2020-11-19 at 5 26 44 PM

adamkendis avatar Nov 03 '20 01:11 adamkendis

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.

tan-nate avatar Jan 29 '21 01:01 tan-nate

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

adamkendis avatar Feb 19 '21 03:02 adamkendis

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.

github-actions[bot] avatar Jul 01 '21 02:07 github-actions[bot]

Please provide update:

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

captain-nimo avatar Aug 20 '21 01:08 captain-nimo

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 avatar Sep 10 '21 01:09 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 avatar Oct 14 '21 23:10 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.

KristenDLR avatar Dec 10 '21 03:12 KristenDLR

@KristenDLR Please provide update

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

ExperimentsInHonesty avatar Jan 07 '22 02:01 ExperimentsInHonesty

@KristenDLR Please provide update Progress Blockers Availability ETA

ExperimentsInHonesty avatar Jan 22 '22 01:01 ExperimentsInHonesty