Я поиграл с этим и обнаружил, что группы можно переставлять, если они находятся внутри flex-контейнера.
В Horizon это сделано по умолчанию и является частью дизайна, поэтому стоит проверить активную тему и при необходимости адаптировать её:
.groups-boxes .group-box[data-group-name="group1"] {
order: -3;
}
.groups-boxes .group-box[data-group-name="group2"] {
order: -2;
}
.groups-boxes .group-box[data-group-name="group3"] {
order: -1;
}
Я не тестировал совместимость, но, судя по всему, это широко поддерживается современными браузерами, так как flex-отображение является общим стандартом.
Единственная проблема, которую я обнаружил, заключается в том, что блоки групп не подхватывали мои CSS-стили. Уже пытался использовать body.group-boxes, но безрезультатно.
Буду рад предложениям 