Merge branch 'main' into feat/update-modal-component-by-removing-trig…

…ger-from-component-structure

rocky/assets/css/components/form-checkbox.scss

@@ -1,5 +1,12 @@
 form {
   input[type="checkbox"] {
+    overflow: hidden;
+    text-overflow: ellipsis;
+
+    & + label {
+      font-weight: normal;
+    }
+
     &:disabled {
       opacity: 1;
     }

rocky/assets/css/components/form-inline.scss

@@ -1,3 +1,4 @@
-form.inline.layout-wide {
+form.layout-wide {
   width: 100%;
+  max-width: 100%;
 }

rocky/assets/css/themes/soft/manon/filter.scss

@@ -16,10 +16,12 @@
   --filter-button-icon-before-close-content: "\ea62";
 }
 
+.filter:has(form:not([hidden])) {
+  border-bottom: 1px solid var(--colors-grey-200);
+}
+
 .filter form {
-  background-color: transparent;
   padding: 1.5rem 2rem 2rem;
-  border-bottom: 1px solid var(--colors-grey-200);
 }
 
 /* Temporary fix, this needs to be updated after this issue has been solved in Manon */

rocky/assets/css/themes/soft/manon/form.scss

@@ -2,6 +2,11 @@
 
 :root {
   --form-base-text-color: var(--application-base-text-color);
+  --form-base-background-color: transparent;
+  --form-base-padding-top: 0;
+  --form-base-padding-bottom: 0;
+  --form-base-padding-left: 0;
+  --form-base-max-width: 40rem;
 
   /* Accent color */
   --form-accent-color-color: var(--branding-color-2);
@@ -32,5 +37,33 @@
 }
 
 form fieldset .checkbox input[type="checkbox"] + label {
-  max-width: 40rem;
+  max-width: var(--form-base-max-width);
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+
+form label {
+  font-weight: bold;
+}
+
+form.help fieldset {
+  &.column-2 {
+    gap: var(--layout-column-2-gap);
+  }
+
+  &.column-3 {
+    gap: var(--layout-column-3-gap);
+  }
+
+  &.column-4 {
+    gap: var(--layout-column-4-gap);
+  }
+}
+
+.checkbox-list {
+  row-gap: 0;
+}
+
+form textarea {
+  border-radius: var(--form-input-border-radius);
 }

rocky/assets/css/themes/soft/manon/link.scss

@@ -2,6 +2,7 @@
 
 :root {
   --link-text-decoration: underline;
+  --link-font-weight: normal;
 }
 
 a {

rocky/assets/css/vendor_overrides/manon/form-fieldset-required.scss

@@ -1,11 +1,14 @@
 /* Form fieldset required */
 
 form.horizontal-view div.required {
+  --nota-bene-height: calc(
+    var(--form-horizontal-view-fieldset-nota-bene-required-margin-bottom) +
+      1.75rem /* Nota bene line height */
+  );
+  --input-height-quarter: calc(var(--form-input-min-height) * 0.25);
+
   label {
-    margin-top: calc(
-      var(--form-horizontal-view-fieldset-nota-bene-required-margin-bottom) +
-        var(--form-input-min-height) / 2
-    );
+    margin-top: calc(var(--nota-bene-height) + var(--input-height-quarter));
   }
 
   select + div + .help-button {

rocky/assets/css/vendor_overrides/manon/form-radio.scss

@@ -2,4 +2,8 @@
 
 form input[type="radio"] {
   margin: var(--form-radio-margin);
+
+  & + label {
+    font-weight: normal;
+  }
 }

rocky/katalogus/templates/clone_settings.html

@@ -11,7 +11,7 @@ <h2>{% translate "Clone settings" %}</h2>
         </p>
         <form action="{% url "katalogus_settings" organization.code %}"
               method="post"
-              class="horizontal-view help"
+              class="help"
               novalidate>
             {% csrf_token %}
             {% include "partials/form/fieldset.html" with legend=name fields=form %}

rocky/katalogus/templates/partials/plugin_settings_required.html

@@ -8,7 +8,7 @@
                 {% if not form %}
                     <h1>{% translate "The form could not be initialized." %}</h1>
                 {% else %}
-                    <form novalidate method="post" class="horizontal-view help">
+                    <form novalidate method="post" class="help">
                         {% csrf_token %}
                         {% translate "Required settings" as fieldset_legend %}
                         {% include "partials/form/fieldset.html" with legend=fieldset_legend fields=form %}

rocky/katalogus/templates/plugin_settings_add.html

@@ -24,7 +24,7 @@ <h1>
           {% endblocktrans %}
                 </p>
                 <div class="layout-form">
-                    <form novalidate method="post" class="horizontal-view help">
+                    <form novalidate method="post" class="help">
                         {% csrf_token %}
                         {% include "partials/form/form_errors.html" with form=form %}
                         {% include "partials/form/fieldset.html" with legend=name fields=form %}

rocky/onboarding/templates/account/step_2a_organization_setup.html

@@ -24,7 +24,7 @@ <h2>{% translate "Organization setup" %}</h2>
                 <form novalidate
                       action="{% url "step_organization_setup" %}"
                       method="post"
-                      class="horizontal-view help layout-form">
+                      class="help layout-form">
                     {% csrf_token %}
                     {% translate "Organization details" as fieldset_legend %}
                     {% include "partials/form/fieldset.html" with legend=fieldset_legend fields=form %}

rocky/onboarding/templates/account/step_2a_organization_update.html

@@ -20,7 +20,7 @@ <h2>{% translate "Organization setup" %}</h2>
                         page within OpenKAT when necessary.
                     {% endblocktranslate %}
                 </p>
-                <form novalidate method="post" class="horizontal-view help layout-form">
+                <form novalidate method="post" class="help layout-form">
                     {% csrf_token %}
                     {% translate "Organization details" as fieldset_legend %}
                     {% include "partials/form/fieldset.html" with legend=fieldset_legend fields=form %}

rocky/onboarding/templates/account/step_4_account_setup_admin.html

@@ -21,7 +21,7 @@ <h2>{% translate "Admin account setup" %}</h2>
                         as well as organization details.
                     {% endblocktranslate %}
                 </p>
-                <form novalidate method="post" class="horizontal-view help">
+                <form novalidate method="post" class="help">
                     {% csrf_token %}
                     {% translate "Admin details" as fieldset_legend %}
                     {% include "partials/form/fieldset.html" with legend=fieldset_legend fields=form %}

rocky/onboarding/templates/account/step_5_account_setup_red_teamer.html

@@ -15,7 +15,7 @@ <h1>{% translate "OpenKAT setup" %}</h1>
                 <h2>{% translate "Red teamer account setup" %}</h2>
                 <strong>{% translate "Red teamer" %}</strong>
                 <p>{% translate "A red teamer account can run scans and generate reports." %}</p>
-                <form novalidate method="post" class="horizontal-view help">
+                <form novalidate method="post" class="help">
                     {% csrf_token %}
                     {% translate "Red teamer details" as fieldset_legend %}
                     {% include "partials/form/fieldset.html" with legend=fieldset_legend fields=form %}

rocky/onboarding/templates/account/step_6_account_setup_client.html

@@ -20,7 +20,7 @@ <h2>{% translate "Client account setup (optional)" %}</h2>
                         Adding a client account to the organization is optional.
                     {% endblocktranslate %}
                 </p>
-                <form novalidate method="post" class="horizontal-view help">
+                <form novalidate method="post" class="help">
                     {% csrf_token %}
                     {% translate "User details" as fieldset_legend %}
                     {% include "partials/form/fieldset.html" with legend=fieldset_legend fields=form %}

rocky/onboarding/templates/step_3b_setup_scan_ooi_add.html

@@ -43,17 +43,15 @@ <h3>{% translate "Dependencies" %}</h3>
                         the process of creating them manually.
                     {% endblocktranslate %}
                 </p>
-                <form novalidate method="post" class="horizontal-view help layout-form">
+                <form novalidate method="post" class="help layout-form">
                     {% csrf_token %}
                     {% translate type as fieldset_legend %}
                     {% include "partials/form/fieldset.html" with legend=fieldset_legend fields=form %}
 
                     <div class="button-container">
                         <button type="submit">{% translate "Create object" %}</button>
-                        <div class="button-container">
-                            <a href="{% url "complete_onboarding" organization.code %}"
-                               class="button ghost">{% translate "Skip onboarding" %}</a>
-                        </div>
+                        <a href="{% url "complete_onboarding" organization.code %}"
+                           class="button ghost">{% translate "Skip onboarding" %}</a>
                     </div>
                 </form>
             </div>

rocky/onboarding/templates/step_3f_set_clearance_level.html

@@ -20,20 +20,17 @@ <h2>{% translate "Setup scan - Set clearance level for" %} {{ ooi|human_readable
                         For the onboarding we will suggest to set the clearance level to L{{ dns_report_least_clearance_level }}.
                     {% endblocktranslate %}
                 </p>
-                <form novalidate
-                      action=""
-                      method="post"
-                      class="horizontal-view help layout-form">
+                <form novalidate action="" method="post" class="help layout-form">
                     {% csrf_token %}
                     {% translate "Set clearance level" as fieldset_legend %}
                     {% include "partials/form/fieldset.html" with legend=fieldset_legend fields=form %}
 
-                    <button type="submit">{% translate "Set clearance level" %}</button>
+                    <div class="button-container">
+                        <button type="submit">{% translate "Set clearance level" %}</button>
+                        <a href="{% url "complete_onboarding" organization.code %}"
+                           class="button ghost">{% translate "Skip onboarding" %}</a>
+                    </div>
                 </form>
-                <div class="button-container">
-                    <a href="{% url "complete_onboarding" organization.code %}"
-                       class="button ghost">{% translate "Skip onboarding" %}</a>
-                </div>
             </div>
         </section>
     </main>

rocky/rocky/templates/finding_type_add.html

@@ -12,7 +12,7 @@
                 <h1>{% translate "Add finding type:" %}</h1>
                 <form action="{% url "finding_type_add" organization_code=organization.code %}"
                       method="post"
-                      class="horizontal-view help">
+                      class="help">
                     {% csrf_token %}
                     {% translate "Finding Type" as fieldset_legend %}
                     {% include "partials/form/fieldset.html" with legend=fieldset_legend fields=form %}

rocky/rocky/templates/findings/finding_add.html

@@ -12,7 +12,7 @@
                 <h1>{% translate "Add finding:" %}</h1>
                 <form action="{% url "finding_add" organization.code %}"
                       method="post"
-                      class="horizontal-view help">
+                      class="help">
                     {% csrf_token %}
                     {% translate "Finding" as fieldset_legend %}
                     {% include "partials/form/fieldset.html" with legend=fieldset_legend fields=form %}

rocky/rocky/templates/findings/findings_filter.html

@@ -12,13 +12,10 @@
     </div>
     <form method="get" class="help">
         {% include "partials/form/fieldset.html" with fields=observed_at_form %}
+        {% include "partials/form/fieldset.html" with fields=severity_filter fieldset_class="filter-fields-direction column" %}
+        {% include "partials/form/fieldset.html" with fields=muted_findings_filter fieldset_class="filter-fields-direction column" %}
+        {% include "partials/form/fieldset.html" with fields=finding_search_form %}
 
-        <div class="column-3 filter-fields-direction row">
-            {% include "partials/form/fieldset.html" with fields=severity_filter fieldset_class="filter-fields-direction column" %}
-            {% include "partials/form/fieldset.html" with fields=muted_findings_filter fieldset_class="filter-fields-direction column" %}
-            {% include "partials/form/fieldset.html" with fields=finding_search_form %}
-
-        </div>
         <div class="button-container">
             <input type="submit"
                    value="{% if submit_text %}{{ submit_text }}{% else %}{% translate "Set filters" %}{% endif %}" />

rocky/rocky/templates/oois/ooi_detail_add_related_object.html

@@ -12,7 +12,7 @@
             <section>
                 <div>
                     <h3>{% translate "Add related object" %}</h3>
-                    <form method="get" class="horizontal-view help">
+                    <form method="get" class="help">
                         {% if ooi_id %}<input type="hidden" name="ooi_id" value="{{ ooi_id }}" />{% endif %}
                         <fieldset>
                             <legend>{% translate "Object details" %}</legend>

rocky/rocky/templates/oois/ooi_mute_finding.html

@@ -14,7 +14,7 @@ <h1>{% translate "Mute finding:" %} {{ ooi.human_readable }}</h1>
                 <form action="{% url 'ooi_add' ooi_type=ooi_type organization_code=organization.code %}"
                       novalidate
                       method="post"
-                      class="horizontal-view help">
+                      class="help">
                     {% csrf_token %}
                     {% translate "Mute finding" as fieldset_legend %}
                     {% include "partials/form/fieldset.html" with legend=fieldset_legend fields=form %}

rocky/rocky/templates/organizations/organization_add.html

@@ -17,7 +17,7 @@ <h1>{% translate "Organization setup" %}</h1>
                         page within OpenKAT when necessary.
                     {% endblocktranslate %}
                 </p>
-                <form novalidate method="post" class="horizontal-view help layout-form">
+                <form novalidate method="post" class="help layout-form">
                     {% csrf_token %}
                     {% translate "Organization details" as fieldset_legend %}
                     {% include "partials/form/fieldset.html" with legend=fieldset_legend fields=form %}

rocky/rocky/templates/organizations/organization_edit.html

@@ -11,7 +11,7 @@
         <section>
             <div>
                 <h1>{% translate "Edit organization" %} {{ organization.name }}</h1>
-                <form method="post" class="horizontal-view help">
+                <form method="post" class="help">
                     {% csrf_token %}
                     <fieldset>
                         {% for field in form %}

rocky/rocky/templates/organizations/organization_member_add.html

@@ -10,7 +10,7 @@
         <section>
             <div>
                 <h1>{{ view.kwargs.account_type|capfirst }}{% translate " member account setup" %}</h1>
-                <form novalidate  method="post" class="horizontal-view help">
+                <form novalidate  method="post" class="help">
                     {% csrf_token %}
                     {% translate "Member details" as fieldset_legend %}
                     {% include "partials/form/fieldset.html" with legend=fieldset_legend fields=form %}

rocky/rocky/templates/organizations/organization_member_add_account_type.html

@@ -11,7 +11,7 @@
             <div class="layout-form">
                 <h1>{% translate "Member account type setup" %}</h1>
                 <p>{% translate "Choose an account type for this new member." %}</p>
-                <form novalidate  method="get" class="horizontal-view help">
+                <form novalidate  method="get" class="help">
                     {% translate "Account type details" as fieldset_legend %}
                     {% include "partials/form/fieldset.html" with legend=fieldset_legend fields=form %}
 

rocky/rocky/templates/organizations/organization_member_edit.html

@@ -11,7 +11,7 @@
         <section>
             <div>
                 <h1>{% translate "Edit member" %} {{ object.user.full_name }}</h1>
-                <form method="post" class="horizontal-view help">
+                <form method="post" class="help">
                     {% csrf_token %}
                     {% include "partials/form/fieldset.html" with fields=form %}
 

rocky/rocky/templates/organizations/organization_member_upload.html

@@ -20,10 +20,7 @@ <h1>{% translate "Upload a csv file with members for organisation" %} "{{ organi
                 <ul>
                     {% for criterion in criteria %}<li>{{ criterion }}</li>{% endfor %}
                 </ul>
-                <form novalidate
-                      method="post"
-                      class="horizontal-view help"
-                      enctype="multipart/form-data">
+                <form novalidate method="post" class="help" enctype="multipart/form-data">
                     {% csrf_token %}
                     {% include "partials/form/fieldset.html" with legend=fieldset_legend fields=form %}
 

rocky/rocky/templates/partials/elements/ooi_add_type_select_form.html

@@ -1,7 +1,7 @@
 {% load i18n %}
 
 {% spaceless %}
-    <form method="get" class="horizontal-view help">
+    <form method="get" class="help">
         {% if ooi %}<input type="hidden" name="ooi_id" value="{{ ooi.primary_key }}" />{% endif %}
         <fieldset>
             <legend>{% translate "Object details" %}</legend>

rocky/rocky/templates/partials/elements/ooi_list_settings_form.html

@@ -6,7 +6,7 @@
     {% if ooi_id %}<input type="hidden" name="ooi_id" value="{{ ooi_id }}" />{% endif %}
     {% include "partials/form/field_hidden_from_list.html" with list=mandatory_fields form=observed_at_form %}
     {% include "partials/form/fieldset.html" with fields=observed_at_form %}
-    {% include "partials/form/fieldset.html" with fields=ooi_type_form custom_class="column-4" %}
+    {% include "partials/form/fieldset.html" with fields=ooi_type_form custom_class="column-2 checkbox-list" %}
 
     {% if ooi_type_form.fields.ooi_type.choices|length > 4 %}
         <button type="button"

rocky/rocky/templates/partials/form/field_input.html

@@ -1,7 +1,7 @@
 {% load i18n %}
 
 <div {% if field.field.required %}class="required"{% endif %}>
-    <p class="de-emphasized">{{ field.label_tag }}</p>
+    {{ field.label_tag }}
     <p id="input-description" class="nota-bene">{{ field.field.widget.attrs.description }}</p>
     {% if form_view != "vertical" %}
         <div>

rocky/rocky/templates/scan_profiles/scan_profile_detail.html

@@ -62,7 +62,7 @@ <h2>{% translate "Set clearance level" %}</h2>
                           novalidate
                           action="{% ooi_url "scan_profile_detail" ooi.primary_key organization.code %}#set_clearance_level"
                           method="post"
-                          class="horizontal-view help">
+                          class="help">
                         {% csrf_token %}
                         {% translate "Set clearance level" as fieldset_legend %}
                         <input type="hidden" name="action" value="change_clearance_level">