Skip to content

Draft: Add labels to todos/notifications buttons

Annabel Dunstone Gray requested to merge 428786-todo-notification-labels into master

What does this MR do and why?

1. Adds labels to todo and subscribe buttons

  • In internal feedback, users found it difficult to distinguish the difference between the two icon types
  • Adding explicit labels is more accessible

2. Removes color "active" state

  • We were using blue for subscribed and active todos, which mixed Pajamas button types (confirm and default)
  • Now that we're using labels, we don't need to rely on color to help distinguish icon types

3. Switches position of buttons (may not be necessary; definitely open to feedback here)

  • The button labels are updated on click, causing buttons to shift. Mark done/Add causes a bigger shift; placing it on the right ensures that the shift isn't as noticeable than the other option

4. Uses default button sizing on MR and small on issues/epics

  • Regular button size aligns with threads control on MRs (the small variant looks like a UI bug)
  • This is what we had originally

What does this MR not do?

  • Any changes to work items

Screenshots or screen recordings

Before After
Merge request Screenshot_2024-03-01_at_11.38.55_AM Screenshot_2024-03-01_at_11.36.56_AM
Merge request (sticky header) Screenshot_2024-03-01_at_11.39.04_AM Screenshot_2024-03-01_at_11.37.06_AM
Issue Screenshot_2024-03-01_at_11.39.19_AM Screenshot_2024-03-01_at_11.36.32_AM
Epic Screenshot_2024-03-01_at_11.39.12_AM Screenshot_2024-03-01_at_11.36.40_AM

How to set up and validate locally

  • Enable :notifications_todos_buttons
  • Check merge request, issue, and epic

Links

Edited by Annabel Dunstone Gray

Merge request reports