From Moodle4 .5. Moodle will represent subsections represented in the course index.

The subsections will add even more indentation to some course index elements. For example, an activity indented inside a subsection will have two extra white spaces at the beginning (one from the subsection, one from the indentation). The item can have some icons on the end, such as the lock icon or the completion.

Having all those elements represented on the thin course index drawers is becoming a problem, and using an unnecessary "move" icon on each entry when edit mode is on does not help.

The following image is an example of a subsection with indented content, a lock icon and a move icon on hover:

This issue is about finding a more contemporary way of showing an element is dragging.

The initial proposal is to remove the icon and add a CSS rule to show a draggable cursor when hovering.

✨ UX proposal

To avoid clutter in the course index, which already contains availability and restriction icons, the UX proposal suggests removing the crossbar icon in edit mode and using the system cursor change when hovering over a draggable item.

In digital products, users recognize actions faster when visual cues mimic physical actions. For example, drag-and-drop interactions should resemble moving physical objects.

The Nielsen Norman Group advises against creating custom icons and recommends using standard platform cursors for moving or resizing actions. On Macs, the cursor changes from an arrow to an open hand, then to a closed hand when grabbing an object. Windows uses a crossbar icon for the drag-and-drop.