From 2afbb1e2082c176cf54c7660097a2e1e7e4674f7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Javier=20S=C3=A1nchez=20Parra?= <jsanchez@soleta.eu>
Date: Mon, 7 Mar 2022 14:53:38 +0100
Subject: [PATCH] Group scopes buttons into dropdowns

Group related actions in the "scopes" section inside a dropdown button.

Declutters the panel in which the buttons are displayed.
---
 ogcp/templates/scopes.html | 45 ++++++++++++++++++++++++++++----------
 1 file changed, 33 insertions(+), 12 deletions(-)

diff --git a/ogcp/templates/scopes.html b/ogcp/templates/scopes.html
index 81b2403..c4d4740 100644
--- a/ogcp/templates/scopes.html
+++ b/ogcp/templates/scopes.html
@@ -16,18 +16,39 @@
 {% endblock %}
 
 {% block commands %}
-  <input class="btn btn-light" type="submit" value="{{ _('Add client') }}"
-         form="scopesForm" formaction="{{ url_for('action_client_add') }}" formmethod="get">
-  <input class="btn btn-light" type="submit" value="{{ _('Add room') }}"
-         form="scopesForm" formaction="{{ url_for('action_room_add') }}" formmethod="get">
-  <input class="btn btn-light" type="submit" value="{{ _('Add center') }}"
-         form="scopesForm" formaction="{{ url_for('action_center_add') }}" formmethod="get">
-  <input class="btn btn-light" type="submit" value="{{ _('Delete client') }}"
-         form="scopesForm" formaction="{{ url_for('action_client_delete') }}" formmethod="get">
-  <input class="btn btn-light" type="submit" value="{{ _('Delete room') }}"
-         form="scopesForm" formaction="{{ url_for('action_room_delete') }}" formmethod="get">
-  <input class="btn btn-light" type="submit" value="{{ _('Delete center') }}"
-         form="scopesForm" formaction="{{ url_for('action_center_delete') }}" formmethod="get">
+  <div class="dropdown btn">
+    <button class="btn btn-secondary btn-light dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-expanded="false">
+        {{ _('Client') }}
+    </button>
+    <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+      <input class="btn btn-light dropdown-item" type="submit" value="{{ _('Add client') }}"
+             form="scopesForm" formaction="{{ url_for('action_client_add') }}" formmethod="get">
+      <input class="btn btn-light dropdown-item" type="submit" value="{{ _('Delete client') }}"
+             form="scopesForm" formaction="{{ url_for('action_client_delete') }}" formmethod="get">
+    </div>
+  </div>
+  <div class="dropdown btn">
+    <button class="btn btn-secondary btn-light dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-expanded="false">
+        {{ _('Room') }}
+    </button>
+    <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+      <input class="btn btn-light dropdown-item" type="submit" value="{{ _('Add room') }}"
+             form="scopesForm" formaction="{{ url_for('action_room_add') }}" formmethod="get">
+      <input class="btn btn-light dropdown-item" type="submit" value="{{ _('Delete room') }}"
+             form="scopesForm" formaction="{{ url_for('action_room_delete') }}" formmethod="get">
+    </div>
+  </div>
+  <div class="dropdown btn">
+    <button class="btn btn-secondary btn-light dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-expanded="false">
+        {{ _('Center') }}
+    </button>
+    <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+      <input class="btn btn-light dropdown-item" type="submit" value="{{ _('Add center') }}"
+             form="scopesForm" formaction="{{ url_for('action_center_add') }}" formmethod="get">
+      <input class="btn btn-light dropdown-item" type="submit" value="{{ _('Delete center') }}"
+             form="scopesForm" formaction="{{ url_for('action_center_delete') }}" formmethod="get">
+    </div>
+  </div>
 {% endblock %}
 
 {% block content %}