Re-order the groups list

Contribute UX
15

I found it is possible to arrange elements on containers with CSS display: flex or display: grid.

In Horizon it is by design and as default, so it is worth checking the active theme to adapt it if necessary:

.group-box[data-group-name="group1"] {
order: -3;
}
.group-box[data-group-name="group2"] {
order: -2;
}
.group-box[data-group-name="group3"] {
order: -1;
}

The hacky alternative was renaming the groups internal names to ``1_group``, ``2_group``, ``3_group`` but it was straining my eyes :smiling_face_with_tear:, so I found this solution by exploring TCs and through trial and error.

I hope it helps.

2 Likes