Set pills width

Set the same width to all pills.

ogcp/static/css/soleta.css

@@ -35,3 +35,7 @@ html, body {
   color: white !important;
   background-color: #99791a !important;
 }
+
+.og-pill {
+  width: 11em;
+}

ogcp/static/js/ogcp.js

@@ -8,7 +8,7 @@ function showSelectedClient(client_checkbox) {
 
     if (client_checkbox.checked) {
         if (!($('#' + pill_id).length))
-            $(container).append('<div class="badge badge-pill badge-light" ' +
+            $(container).append('<div class="badge badge-pill og-pill badge-light" ' +
                                 'id="'+ pill_id + '">' + client_checkbox.name +
                                 '<br>' + client_checkbox.value + '</div>');
         return;

ogcp/templates/macros.html

@@ -58,7 +58,7 @@
 <div class="d-flex flex-wrap justify-content-center">
     {% set max_clients = 50 %}
     {% for name_id, ip in selected_clients[:max_clients] %}
-    <div id="pill-{{ name_id|replace(".", "_") }}" class="badge badge-pill badge-light">
+    <div id="pill-{{ name_id|replace(".", "_") }}" class="badge badge-pill og-pill badge-light">
         {{ name_id }}<br>{{ ip }}
     </div>
     {% if loop.last and (selected_clients|length > max_clients) %}