Fix forms

nummi/main/static/main/css/form.css

@@ -32,6 +32,7 @@ form {
     .field {
       display: grid;
       grid-auto-rows: min-content;
+      overflow: hidden;
 
       &:has(> textarea) {
         grid-template-rows: min-content 1fr;
@@ -43,9 +44,9 @@ form {
         z-index: 10;
       }
 
-      > input,
+      input,
-      > select,
+      select,
-      > textarea {
+      textarea {
         font: inherit;
         line-height: initial;
         border: none;
@@ -73,19 +74,22 @@ form {
           grid-auto-columns: max-content;
           grid-auto-flow: column;
         }
+
+        input[type="file"] {
+          &::file-selector-button {
+            display: none;
+          }
+        }
       }
     }
   }
   .buttons {
     grid-column: 1 / -1;
     display: grid;
-    grid-auto-columns: min-content;
+    grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
+    grid-auto-rows: 1fr;
     grid-gap: var(--gap);
-    align-items: baseline;
+    align-items: center;
-
-    & > * {
-      grid-row: 1;
-    }
 
     input {
       font: inherit;
@@ -100,17 +104,14 @@ form {
       &[type="submit"] {
         border: 0.1rem solid var(--green);
         background: var(--green-1);
-        grid-column: 1;
       }
       &[type="reset"] {
         border: 0.1rem solid var(--red);
         background: var(--red-1);
-        grid-column: 2;
       }
     }
     a.del {
       color: var(--red);
-      grid-column: 3;
     }
   }
 }

nummi/main/templates/main/form/form_base.html

@@ -35,15 +35,15 @@
   {% endif %}
   <div class="buttons">
     {% block buttons %}
-      {% if not form.instance|adding %}
-        <a class="del" href="{{ form.instance.get_delete_url }}">{% translate "Delete" %}</a>
-      {% endif %}
-      <input type="reset" value="{% translate "Reset" %}">
       {% if form.instance|adding %}
         <input type="submit" value="{% translate "Create" %}">
       {% else %}
         <input type="submit" value="{% translate "Save" %}">
       {% endif %}
+      <input type="reset" value="{% translate "Reset" %}">
+      {% if not form.instance|adding %}
+        <a class="del" href="{{ form.instance.get_delete_url }}">{% translate "Delete" %}</a>
+      {% endif %}
     {% endblock buttons %}
   </div>
 {% endblock fields %}