Implement bulk operation designs

Created on 26 July 2019, over 5 years ago

Updated 31 July 2023, over 1 year ago

Problem/Motivation

The bulk operation form takes space on top of the form and in some cases pushes the content of the view below the fold, meaning that to see any content on the page, the user has to scroll (see #2 for a screenshot). Presumably in most cases the bulk operation form is not being utilized most of the time users access a view. However, this could be the opposite for some views such as moderate comments view.

The connection between checkboxes and the bulk operation form could be also unclear. The checkboxes don't have any label and the bulk operation form is lacking a legend.

Proposed resolution

Move the bulk operation form below the view content. After a user has clicked a checkbox, make the bulk operations form position fixed. After user has clicked a checkbox the bulk operations form becomes the primary actions on the page and there's a strong reason to believe that the user wants to trigger an action. This will also add some clarity on the connection to checkboxes, as well as make it easier to activate an action.

An animated example to show the interaction behavior is linked to in #6
Designs can be found here: https://www.figma.com/file/NpZUAp8BEkMJvm5gKBCDBB/Claro?node-id=16591%3A...

Remaining tasks

Before full implementation, there are several things that must be figured out that aren't covered by the design.

Consider how the implementation will impact the Views Bulk Operations contrib module. This redesign may require VBO to make some changes, but ideally these changes should not require anything too convoluted.
Are there tab order concerns since this is sticky?

After the above considerations are figured out, determine if any changes to the design are needed.

Implement the design.

📌 Task

Status

Fixed

Version

10.1 ✨

Component

Claro →

Last updated 3 days ago