Skip to content

Resolve "Unbox on-call schedule UI"

Paulina Sedlak-Jakubowska requested to merge 387079-unbox-on-call-schedule-ui into master

What does this MR do and why?

Describe in detail what your merge request does and why.

From the main issue:

  1. Header section changes - increase the font size of page title to H1; change the "Add a schedule" button text to "Add schedule" and change the button variant to primary, small
  2. Move the edit/delete icon buttons into a three dot menu. Move the expand/collapse caret next to it (rather than next to the schedule title)
  3. Update the header section of the schedule to include the schedule title (now, h2/04 base size), schedule description, and timezone
  4. Switch the background colors of the header and "body" sections of the schedule. The body is now neutral grey-200 and the header, white.
  5. Rotations text size increased to H3 (note: the tag changed to h3 and headline hierarchy has been improved on the whole view, font size was adjusted with a class, to match figma design)
  6. Move the date to a new row beneath the Rotations text
  7. Time range picker - change the split button into a dropdown, small variant. Change the one day option to, hourly. When hourly is selected, change Date text to Hour
  8. Move the forward/backward buttons here, and use the small button variant.

Screenshots or screen recordings

Screenshots are required for UI changes, and strongly recommended for all other merge requests.

context before after
default oncall_schedules_before oncall_schedules_after_default
card menu open same as above oncall_schedules_after_card_menu
day preview same as above oncall_schedules_after_day_preview

How to set up and validate locally

Numbered steps to set up and validate the change are strongly suggested.

Prerequisite:

You must have at least the Maintainer role.

To create an on-call schedule:

  • On the top bar, select Main menu > Projects and find your project.
  • On the left sidebar, select Monitor > On-call Schedules.
  • Select Add a schedule.
  • Enter the schedule’s name and description and select a time zone.
  • Select Add schedule.

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Related to #387079 (closed)

Edited by Paulina Sedlak-Jakubowska

Merge request reports