diff --git a/apps/accounts/templates/provider_registration/base_form.html b/apps/accounts/templates/provider_registration/base_form.html index 840e53df..d6ba4617 100644 --- a/apps/accounts/templates/provider_registration/base_form.html +++ b/apps/accounts/templates/provider_registration/base_form.html @@ -15,12 +15,12 @@ {% endblock %} {% if form.is_multipart %} -
+ {% else %} - + {% endif %} {% csrf_token %} - +
{{ wizard.management_form }} {% if wizard.form.forms %} {{ wizard.form.management_form }} @@ -35,7 +35,7 @@ {% if wizard.steps.prev %} -
+ diff --git a/apps/accounts/templates/provider_registration/consent.html b/apps/accounts/templates/provider_registration/consent.html index 402cc5a9..32e203b8 100644 --- a/apps/accounts/templates/provider_registration/consent.html +++ b/apps/accounts/templates/provider_registration/consent.html @@ -15,14 +15,14 @@

One last thing...

{% endblock %} {% if form.is_multipart %} - + {% else %} - + {% endif %} {% csrf_token %} -
+
{{ wizard.management_form }} {% if wizard.form.forms %} @@ -38,7 +38,7 @@

One last thing...

{% if wizard.steps.prev %} -
+ diff --git a/apps/accounts/templates/provider_registration/evidence.html b/apps/accounts/templates/provider_registration/evidence.html index b561b4c4..edc98e7a 100644 --- a/apps/accounts/templates/provider_registration/evidence.html +++ b/apps/accounts/templates/provider_registration/evidence.html @@ -140,7 +140,7 @@

Submit your evidence

{% if wizard.steps.prev %} -
+ diff --git a/apps/accounts/templates/provider_registration/locations.html b/apps/accounts/templates/provider_registration/locations.html index 539b0407..9fc1d32b 100644 --- a/apps/accounts/templates/provider_registration/locations.html +++ b/apps/accounts/templates/provider_registration/locations.html @@ -58,11 +58,9 @@

Where is your organisation active?

{% endcomment %} {% if wizard.form.non_field_errors %}
-
-
-
- {{ wizard.form.non_field_errors}} -
+
+
+ {{ wizard.form.non_field_errors}}
@@ -101,7 +99,7 @@

Where is your organisation active?

{% if wizard.steps.prev %} -
+ diff --git a/apps/accounts/templates/provider_registration/network_footprint.html b/apps/accounts/templates/provider_registration/network_footprint.html index 41e003b6..565f90d2 100644 --- a/apps/accounts/templates/provider_registration/network_footprint.html +++ b/apps/accounts/templates/provider_registration/network_footprint.html @@ -65,9 +65,9 @@

Network footprint

{% if form.is_multipart %} - + {% else %} - + {% endif %} {% csrf_token %} @@ -86,28 +86,25 @@

Network footprint

{% if wizard.form.non_field_errors %} -
-
-
-
- {{ wizard.form.non_field_errors }} -
-
+
+
+ {{ wizard.form.non_field_errors }}
{% endif %} -
+

Identify this provider by IP range

You can submit one or more IP ranges which will be used to identify any websites running on this provider.

-

Notes:

-
    -
  • IPv4 and IPv6 formats are supported
  • -
  • To add a single IP address, put the same address in both the START and END fields
  • -
+ +

Notes:

+
    +
  • IPv4 and IPv6 formats are supported
  • +
  • To add a single IP address, put the same address in both the START and END fields
  • +
{{ wizard.form.ips.management_form }} @@ -122,7 +119,7 @@

Identify this provider by IP range

{% endfor %}
-
+
@@ -155,7 +152,7 @@

Identify this provider by ASN

{% endfor %}
-
+
@@ -183,8 +180,6 @@

Identify this provider by ASN

{{ wizard.form.extra.missing_network_explanation.as_widget }} - -
-
- +
+ {% if wizard.steps.prev %} -
+ diff --git a/apps/accounts/templates/provider_registration/partials/_location_form.html b/apps/accounts/templates/provider_registration/partials/_location_form.html index acddd8b7..96ebbc03 100644 --- a/apps/accounts/templates/provider_registration/partials/_location_form.html +++ b/apps/accounts/templates/provider_registration/partials/_location_form.html @@ -21,8 +21,8 @@
{% endfor %} -

+

-

+
diff --git a/apps/theme/static_src/src/css/custom/forms-custom.css b/apps/theme/static_src/src/css/custom/forms-custom.css index e8fe4316..cd7154a7 100644 --- a/apps/theme/static_src/src/css/custom/forms-custom.css +++ b/apps/theme/static_src/src/css/custom/forms-custom.css @@ -1,18 +1,24 @@ /* 0. GENERAL CUSTOM FORM STYLES */ -/* 0.1 BASE SIZED TEXT FIELDS */ +/* 0.1 ERROR LIST */ +/* 0.2 HELPTEXT */ +/* 0.3 BASE SIZED TEXT FIELDS */ + +/* General form layout */ +/* 1. DEFAULT gwf-form */ +/* 11. EVIDENCE FORM */ +/* 12. CONSENT TABLE */ +/* 13. DIRECTORY FORMS */ /* Styles for forms that are laid out as tables */ -/* 1. GENERAL form_table */ /* 2. NETWORK FOOTPRINT TABLE */ -/* 3. CONSENT TABLE */ -/* Other kinds of form layout. */ -/* 21. EVIDENCE FORM */ -/* 22. DIRECTORY FORMS */ +/* **************************** */ /* 0. GENERAL CUSTOM FORM STYLES */ + +/* 0.1 ERROR LIST */ .errorlist { @apply text-purple; } @@ -20,15 +26,25 @@ .errorlist + select { @apply border-purple; } +ul.errorlist { + @apply mb-4; + @apply list-none; + @apply pl-0; +} .errorlist li { @apply mb-4; + @apply pl-0; +} +.errorlist li:last-of-type { + @apply mb-0; } +/* 0.2 HELPTEXT */ .helptext { @apply text-base; } -/* 0.1 BASE SIZED TEXT FIELDS */ +/* 0.3 BASE SIZED TEXT FIELDS */ .form__basetext-fields .form__row { @apply my-6; } @@ -36,101 +52,43 @@ @apply text-base; @apply font-bold; } - .form__basetext-fields input[type="text"], .form__basetext-fields input[type="password"] { @apply w-full; } - /* **************************** */ -/* 1. GENERAL form_table */ -.form__table { - @apply my-8; + +/* 1. DEFAULT gwf-form */ +.gwf-form { + @apply mt-8; } -.form__table tr { +.gwf-form > div { @apply flex; @apply flex-col; @apply items-start; @apply py-8; @apply border-b-0; } -.form__table tr > * { +.gwf-form > div > * { @apply w-full; } - -.form__table td { - @apply flex; - @apply flex-col; - @apply pl-0; -} -.form__table label { +.gwf-form label { @apply block; @apply text-left; } -.form__table span.helptext { - @apply order-first; +.gwf-form .helptext { @apply pb-6; } -.form__table ul { - @apply my-0; - @apply list-none; - @apply pl-0; -} -.form__table .errorlist { - @apply order-2; -} - -table[class^="form__table--"] tbody { - @apply flex; - @apply gap-8; -} -table[class^="form__table--"] tbody > * { +.gwf-form .nav-buttons { + @apply block; @apply py-0; - @apply w-1/5; -} -/* Typically within the th element */ -table[class^="form__table--"] label { - @apply text-sm; - @apply uppercase; - @apply font-normal; -} - - -/* 2. NETWORK FOOTPRINT TABLE */ -.form__table--network tbody { - @apply flex-wrap; - @apply 2xl:flex-nowrap; } -.form__table--network tbody > tr { +.gwf-form .nav-buttons > * { @apply w-auto; } -.form__table--network label { - @apply mb-1; -} -/* 3. CONSENT TABLE */ -.form__table--consent tr { - @apply relative; -} -.form__table--consent tr th { - @apply ml-16; -} -.form__table--consent tr td input { - @apply absolute; - @apply top-10; - width: 2rem; - height: 2rem; - @apply border-2; -} -.form__table--consent .helptext { - @apply ml-16; -} - - -/* **************************** */ - -/* 21. EVIDENCE FORM */ +/* 11. EVIDENCE FORM */ .form__evidence .convenient-form { @apply md:flex; @apply flex-wrap; @@ -172,9 +130,34 @@ table[class^="form__table--"] label { @apply order-first; @apply mb-0; } +.form__evidence--field-id, +.form__evidence--field-DELETE { + @apply mb-0; + @apply !pt-0; +} +/* 12. CONSENT TABLE */ +.form__consent > div { + @apply relative; +} +.form__consent label { + @apply w-auto; + @apply ml-16; + @apply text-xl; + @apply lg:text-2xl; +} +.form__consent > div input { + @apply absolute; + @apply top-10; + width: 2rem; + height: 2rem; + @apply border-2; +} +.form__consent .helptext { + @apply ml-16; +} -/* 22. DIRECTORY FORMS */ +/* 13. DIRECTORY FORMS */ .form__directory label { @apply block; @apply text-white; @@ -204,3 +187,36 @@ table[class^="form__table--"] label { .form__directory p { @apply lg:col-span-2; } + + +/* **************************** */ + +/* 2. NETWORK FOOTPRINT TABLE */ +.form__table--network tbody { + @apply flex; + @apply flex-wrap; + @apply gap-x-8; +} +.form__table--network tbody > tr { + @apply w-auto; + @apply border-0; +} +/* Targetting the errors list, which won't have a th before the td */ +.form__table--network tbody > tr >td:first-child { + @apply w-full; + @apply p-0; +} +.form__table--network tbody .errorlist { + @apply my-0; +} +.form__table--network tbody th { + @apply w-16; +} +.form__table--network tbody td { + @apply w-52; +} +.form__table--network label { + @apply mb-0; + @apply pb-0; + @apply text-med; +} \ No newline at end of file diff --git a/apps/theme/static_src/src/css/custom/forms.css b/apps/theme/static_src/src/css/custom/forms.css index 88009d13..086e1b02 100644 --- a/apps/theme/static_src/src/css/custom/forms.css +++ b/apps/theme/static_src/src/css/custom/forms.css @@ -1,6 +1,13 @@ -label { +label, +legend { @apply text-4xl; @apply text-black; + @apply leading-normal; + @apply pb-4; +} +fieldset label { + @apply text-base; + @apply uppercase; } [type="text"], @@ -38,9 +45,3 @@ textarea { [type="radio"]:checked { @apply bg-black; } - -/* Form layouts specific to Django HTML output */ -form li label { - @apply text-base; - @apply uppercase; -}