continuing template update started with 926e2e82

fixing margin issue that clash with columns
use col-* for all forms and nested forms
remove usage of formset-item-inline-grid
move delete button to the top right

ippisite/ippidb/forms.py

@@ -838,6 +838,11 @@ class CompoundActivityResultForm(ModelForm):
             "activity": widgets.HiddenInput(),
         }
 
+    def __init__(self, *args, **kwargs):
+        super().__init__(*args, **kwargs)
+        for f in self.fields.values():
+            f.widget.attrs.update({"class": "col-3"})
+
     def has_changed(self):
         """
         Test if the form has changed, we consider that it has not changed if it is not linked to an actual instance and
@@ -1038,7 +1043,7 @@ class TestActivityDescriptionForm(forms.ModelForm):
         self.fields["test_name"].widget.attrs.update({"class": "col-9"})
         self.fields["test_modulation_type"].widget.attrs.update({"class": "col-2"})
         self.fields["nb_active_compounds"].widget.attrs.update({"class": "col-3"})
-        self.fields["cell_line_name"].widget.attrs.update({"class": "col-6"})
+        self.fields["cell_line_name"].widget.attrs.update({"class": "col-7"})
 
     def has_changed(self):
         """
@@ -1166,6 +1171,11 @@ class CompoundCytotoxicityResultForm(ModelForm):
         fields = ("compound_name", "toxicity")
         widgets = {"toxicity": forms.Select(choices=((True, "True"), (False, "False")))}
 
+    def __init__(self, *args, **kwargs):
+        super().__init__(*args, **kwargs)
+        for f in self.fields.values():
+            f.widget.attrs.update({"class": "col-3"})
+
     def has_changed(self):
         """
         Test if the form has changed, we consider that it has not changed if it is not linked to an actual instance and
@@ -1280,6 +1290,9 @@ class TestCytotoxDescriptionForm(forms.ModelForm):
     def __init__(self, *args, **kwargs):
         super().__init__(*args, **kwargs)
         self.fields["compound_concentration"].required = True
+        self.fields["cell_line_name"].widget.attrs.update({"class": "col"})
+        self.fields["compound_concentration"].widget.attrs.update({"class": "col"})
+        self.fields["test_name"].widget.attrs.update({"class": "col"})
 
     def has_changed(self):
         """
@@ -1378,6 +1391,13 @@ class CompoundPKResultForm(ModelForm):
             )
         }
 
+    def __init__(self, *args, **kwargs):
+        super().__init__(*args, **kwargs)
+        for f in self.fields.values():
+            f.widget.attrs.update({"class": "col-3"})
+            if isinstance(f, forms.BooleanField) and not isinstance(f.widget, forms.Select):
+                f.widget.attrs.update({"class": "col-3 ml-3"})
+
     def has_changed(self):
         """
         Test if the form has changed, we consider that it has not changed if it is not linked to an actual instance and
@@ -1489,6 +1509,8 @@ class TestPKDescriptionForm(forms.ModelForm):
         super().__init__(*args, **kwargs)
         for f in ["administration_mode", "dose"]:
             self.fields[f].required = True
+        for f in self.fields.values():
+            f.widget.attrs.update({"class": "col-3"})
 
     def has_changed(self):
         """

ippisite/ippidb/static/css/admin-session.css

@@ -225,7 +225,7 @@ Description: IPPI-DB Theme
 
 .input_field {
   width: 100%;
-  margin-right: 2px;
+  margin-right: 0px;
   font-family: "BrandonGrotesqueReg";
   text-align: left;
   margin-top: 0px;
@@ -356,6 +356,9 @@ Description: IPPI-DB Theme
 .formset-item .formset-item-delete-host {
   font-size: initial;
   text-align: right;
+  position: absolute;
+  right: 3em;
+  margin-top: -4em;
 }
 
 .formset-item-delete-host input {
@@ -1352,6 +1355,7 @@ Description: IPPI-DB Theme
 .test_title {
   text-align: left;
   margin-top: 15px;
+  margin-bottom: 1.5em;
 }
 
 .tests {

ippisite/ippidb/templates/form_with_nested_formset.html

@@ -11,7 +11,7 @@
 
 </script>
 {% endblock extra_js %}
-<div class="formset-item">
+<div class="formset-item mb-4">
     <h3 class="test_title">Test description</h3>
     <div class="row">
         {{ form|bootstrap}}
@@ -20,15 +20,19 @@
         {{ form.nested.management_form }}
         {{ form.nested.non_form_errors|bootstrap }}
         {% if nested_form %}
-        <div class="formset-nested-item  formset-item-inline-grid">
+        <div class="formset-nested-item ">
             <h3 class="test_title">Test results</h3>
-            {{ nested_form|bootstrap }}
+            <div class="row">
+                {{ nested_form|bootstrap }}
+            </div>
         </div>
         {% endif %}
         {% for nested_form in nested_forms %}
-        <div class="formset-nested-item  formset-item-inline-grid">
+        <div class="formset-nested-item">
             <h3 class="test_title">Test results</h3>
-            {{ nested_form|bootstrap }}
+            <div class="row">
+                {{ nested_form|bootstrap }}
+            </div>
         </div>
         {% endfor %}
         <div class="form_div">

ippisite/ippidb/templatetags/customtags.py

@@ -84,13 +84,23 @@ def bootstrap_core(object):
             # HACK : If the field is the DELETE button of the formset
             attrs["onchange"] = "delete_button_clicked(this);"
             field.label = ugettext("DELETE_label")
-            wrapping_classes += " formset-item-delete-host delete-btn"
+            wrapping_classes += " formset-item-delete-host delete-btn col order-1"
             css_classes.add("formset-item-delete")
         # HACK: if the css_class is a bootstrap column layout, transfer it to container element
         for css_class in css_classes:
-            if css_class.startswith("col-"):
+            if css_class.startswith("col") or css_class.startswith("order-") or css_class.startswith("ml-"):
                 wrapping_classes += f" {css_class}"
-        css_classes = set([css_class for css_class in css_classes if not(css_class.startswith('col-'))])
+        css_classes = set(
+            [
+                css_class
+                for css_class in css_classes
+                if not (
+                    css_class.startswith("col")
+                    or css_class.startswith("order-")
+                    or css_class.startswith("ml-")
+                )
+            ]
+        )
 
         # overwrite the css classes
         attrs["class"] = " ".join(css_classes)