diff --git a/nummi/main/static/main/css/form.css b/nummi/main/static/main/css/form.css index 5cb1504..06063b9 100644 --- a/nummi/main/static/main/css/form.css +++ b/nummi/main/static/main/css/form.css @@ -1,10 +1,3 @@ -form ul.errorlist { - color: var(--red); - font-weight: 550; - list-style-type: "! "; - margin: 0; -} - form { display: grid; gap: 0.5rem; @@ -29,26 +22,43 @@ form { border: none; } + ul.errorlist { + color: var(--red); + font-weight: 550; + list-style: none; + padding: 0; + margin: 0; + } + .field { display: grid; grid-auto-rows: min-content; align-items: center; - overflow: hidden; column-gap: 0.5rem; + ul.errorlist { + font-size: 0.8rem; + } + &:has(> textarea) { grid-template-rows: min-content 1fr; } - &:has(input[type="checkbox"]) { + &:has(> input[type="checkbox"]) { grid-template-columns: min-content 1fr; > label { font-size: inherit; grid-row: 1; grid-column: 2; + padding: 0.5rem; + line-height: initial; } > input { grid-row: 1; grid-column: 1; + margin: 0.5rem; + } + &:has(> :focus) { + background: var(--bg-01); } } @@ -64,13 +74,19 @@ form { font: inherit; line-height: initial; border: none; + border: 1px solid transparent; border-bottom: 1px solid var(--gray); background: none; z-index: 1; - padding: 0; + padding: 0.5rem; + + &:has(~ ul.errorlist) { + border-color: var(--red); + } &:not([type="checkbox"]) { width: 100%; + margin: 0; } &[name*="value"] { @@ -95,6 +111,9 @@ form { grid-template-columns: 1fr; grid-auto-columns: max-content; grid-auto-flow: column; + a { + padding: 0.5rem; + } } input[type="file"] { @@ -107,6 +126,14 @@ form { display: grid; grid-template-columns: min-content 1fr; column-gap: 0.5rem; + align-items: center; + span[class|="ri"] { + padding: 0.5rem; + } + + &:has(> :focus) { + background: var(--bg-01); + } } } } diff --git a/nummi/main/templates/main/form/fileinput.html b/nummi/main/templates/main/form/fileinput.html index 77989ae..8dd3985 100644 --- a/nummi/main/templates/main/form/fileinput.html +++ b/nummi/main/templates/main/form/fileinput.html @@ -5,7 +5,7 @@
{{ "file"|remix }}{% translate "File" %} [{{ widget.value|extension }}] {% if not widget.required %} - +
-{% comment %} - - {% if widget.is_initial %} - - - - - {% if not widget.required %} - - - - - {% endif %} - - - - - -
{{ widget.initial_text }} - {% translate "File" %} [{{ widget.value|extension }}] -
- - - -
{{ widget.input_text }} - {% else %} -
- {% endif %} - -
-{% endcomment %} diff --git a/nummi/main/templates/main/form/form_base.html b/nummi/main/templates/main/form/form_base.html index 86341b8..4989c4b 100644 --- a/nummi/main/templates/main/form/form_base.html +++ b/nummi/main/templates/main/form/form_base.html @@ -12,10 +12,16 @@ {% for fieldset in group %}
{% for field in fieldset %} - {% if field.errors %}

{{ field.errors }}

{% endif %}
{{ field }} + {% if field.errors %} + + {% endif %}
{% endfor %}