refactor(templates): the last inline styles that Bootstrap covers

- The VM list's power forms (style="display:inline") are d-inline.
- The fields scripts show and hide are d-none, and the scripts add and
  remove that class instead of calling jQuery's show() and hide(),
  which could not undo it: the custom memory boxes of the Resize tab,
  the ISO upload's error message and the clone dialog's metadata row.
- The please-wait dialog's full bar is w-100.
- The create-VM pages' own 56rem width (.create-vm) goes: pages stop
  at 960px now, about the same.
- static/css/font-awesome.min.css goes: no page loaded it, no element
  used its classes and its fonts were never in the repository.

instances/templates/create_instance_w1.html

@@ -5,17 +5,13 @@
 
 {% block title %}{% trans "Create new instance" %} - {% trans "Machine" %}{% endblock %}
 
-{% block style %}
-    <style>.create-vm { max-width: 56rem; }</style>
-{% endblock %}
-
 {% block page_heading%}
 {% blocktrans with host=compute.name %}New instance on {{ host }} {% endblocktrans %}
 {% endblock page_heading %}
 
 {% block content %}
     {% include 'pleasewaitdialog.html' %}
-    <div class="create-vm mx-auto">
+    <div>
         {% include "create_steps.html" with step=2 %}
 
         <section class="card mb-3" aria-labelledby="machine-heading">

instances/templates/create_instance_w2.html

@@ -13,7 +13,6 @@
     <style>
         /* the chosen images and networks are listed below the pickers, not in them */
         #image-control + .ts-wrapper .ts-control > .item, #network-control + .ts-wrapper .ts-control > .item { display: none; }
-        .create-vm { max-width: 56rem; }
         .source-option { cursor: pointer; }
         /* the chosen card by its border only: the Bootswatch dark themes keep light "subtle" backgrounds */
         .source-option:has(input:checked) { border-color: var(--bs-primary) !important; box-shadow: inset 0 0 0 1px var(--bs-primary); }
@@ -27,7 +26,7 @@
 
 {% block content %}
     {% include 'pleasewaitdialog.html' %}
-    <div class="create-vm mx-auto">
+    <div>
         {% include "create_steps.html" with step=3 %}
 
         {% if vm_form %}

instances/templates/instance.html

@@ -316,7 +316,7 @@
         $('.js-custom__checkbox').change(function () {
             var container  = $(this).closest('.js-custom__container');
             var toggles    = container.find('.js-custom__toggle');
-            toggles.toggle();
+            toggles.toggleClass("d-none");
             // a custom value is sent only while its box is ticked
             container.find('input.js-custom__toggle').prop('disabled', !this.checked);
         });

instances/templates/instance_actions.html

@@ -9,12 +9,12 @@
             {% bs_icon 'copy' %}
         </a>
     {% elif "poweron" in actions %}
-        <form action="{% url 'instances:poweron' instance.id %}" method="post" style="display:inline;" onsubmit="showPleaseWaitDialog()">
+        <form action="{% url 'instances:poweron' instance.id %}" method="post" class="d-inline" onsubmit="showPleaseWaitDialog()">
             {% csrf_token %}
             <button type="submit" class="btn btn-sm btn-secondary" title="{% trans "Power On" %}">{% bs_icon 'play-fill' %}</button>
         </form>
     {% elif "resume" in actions %}
-        <form action="{% url 'instances:resume' instance.id %}" method="post" style="display:inline;">
+        <form action="{% url 'instances:resume' instance.id %}" method="post" class="d-inline">
             {% csrf_token %}
             <button type="submit" class="btn btn-sm btn-secondary" title="{% trans "Resume" %}">{% bs_icon 'play-fill' %}</button>
         </form>
@@ -23,7 +23,7 @@
     {% endif %}
 
     {% if "suspend" in actions %}
-        <form action="{% url 'instances:suspend' instance.id %}" method="post" style="display:inline;">
+        <form action="{% url 'instances:suspend' instance.id %}" method="post" class="d-inline">
             {% csrf_token %}
             <button type="submit" class="btn btn-sm btn-secondary" title="{% trans "Suspend" %}">{% bs_icon 'pause-fill' %}</button>
         </form>
@@ -32,12 +32,12 @@
     {% endif %}
 
     {% if "poweroff" in actions %}
-        <form action="{% url 'instances:poweroff' instance.id %}" method="post" style="display:inline;">
+        <form action="{% url 'instances:poweroff' instance.id %}" method="post" class="d-inline">
             {% csrf_token %}
             <button type="submit" class="btn btn-sm btn-secondary" title="{% trans "Power Off" %}">{% bs_icon 'power' %}</button>
         </form>
     {% elif "force_off" in actions %}
-        <form action="{% url 'instances:force_off' instance.id %}" method="post" style="display:inline;">
+        <form action="{% url 'instances:force_off' instance.id %}" method="post" class="d-inline">
             {% csrf_token %}
             <button type="submit" class="btn btn-sm btn-secondary" title="{% trans "Force Off" %}"
                     data-confirm="{% blocktrans with name=instance.name %}Force off {{ name }}? It stops at once, as after a power cut; what the guest has not written to disk is lost.{% endblocktrans %}"
@@ -48,7 +48,7 @@
     {% endif %}
 
     {% if "powercycle" in actions %}
-        <form action="{% url 'instances:powercycle' instance.id %}" method="post" style="display:inline;">
+        <form action="{% url 'instances:powercycle' instance.id %}" method="post" class="d-inline">
             {% csrf_token %}
             <button type="submit" class="btn btn-sm btn-secondary" title="{% trans "Power Cycle" %}"
                     data-confirm="{% blocktrans with name=instance.name %}Power cycle {{ name }}? It stops at once, as after a power cut, and starts again; what the guest has not written to disk is lost.{% endblocktrans %}"

instances/templates/instances/resize_tab.html

@@ -97,7 +97,7 @@
                                 <option value="{{ mem }}" {% if mem == instance.cur_memory %}selected{% endif %}>{{ mem }}</option>
                             {% endfor %}
                             </select>
-                            <input type="text" name="cur_memory_custom" class="form-select js-custom__toggle" style="display: none" disabled />
+                            <input type="text" name="cur_memory_custom" class="form-select js-custom__toggle d-none" disabled />
                             <small><input type="checkbox" class="js-custom__checkbox" /> {% trans "Custom value" %}</small>
                         </div>
                     </div>
@@ -113,7 +113,7 @@
                             {% endfor %}
                             </select>
                             {% if instance.status == 5 %}
-                            <input type="text" name="memory_custom" class="form-select js-custom__toggle" style="display: none" disabled />
+                            <input type="text" name="memory_custom" class="form-select js-custom__toggle d-none" disabled />
                             <small><input type="checkbox" class="js-custom__checkbox" /> {% trans "Custom value" %}</small>
                             {% else %}
                             <small class="text-body-secondary">{% trans "Shut off the VM to change the maximum" %}</small>