mirror of
https://github.com/django/django.git
synced 2025-01-27 10:39:40 +00:00
[4.2.x] Fixed #34383 -- Fixed layout of admin fieldsets with multiple fields on the same line.
Thanks Antonio Candido Nazareth junior for the report. Regression in 96a598356a9ea8c2c05b22cadc12e256a3b295fd. Co-authored-by: Mariusz Felisiak <felisiak.mariusz@gmail.com> Backport of d687febce5868545f99974d2499a91f81a32fef5 from main
This commit is contained in:
parent
ded3334af6
commit
788f7b8100
@ -22,11 +22,15 @@ form .form-row p {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.form-row > div {
|
||||
.flex-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.form-multiline > div {
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
/* FORM LABELS */
|
||||
|
||||
label {
|
||||
@ -191,7 +195,6 @@ form .aligned table p {
|
||||
}
|
||||
|
||||
fieldset .fieldBox {
|
||||
float: left;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
|
@ -390,10 +390,6 @@ input[type="submit"], button {
|
||||
display: none;
|
||||
}
|
||||
|
||||
form .form-row p.datetime {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.datetime input {
|
||||
width: 50%;
|
||||
max-width: 120px;
|
||||
@ -564,8 +560,6 @@ input[type="submit"], button {
|
||||
|
||||
.aligned .form-row,
|
||||
.aligned .form-row > div {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
max-width: 100vw;
|
||||
}
|
||||
|
||||
@ -573,6 +567,10 @@ input[type="submit"], button {
|
||||
width: calc(100vw - 30px);
|
||||
}
|
||||
|
||||
.flex-container {
|
||||
flex-flow: column;
|
||||
}
|
||||
|
||||
textarea {
|
||||
max-width: none;
|
||||
}
|
||||
|
@ -170,7 +170,6 @@ form .wide input + div.help {
|
||||
}
|
||||
|
||||
fieldset .fieldBox {
|
||||
float: right;
|
||||
margin-left: 20px;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
@ -32,7 +32,7 @@
|
||||
|
||||
<div class="form-row">
|
||||
{{ form.password1.errors }}
|
||||
<div>{{ form.password1.label_tag }} {{ form.password1 }}</div>
|
||||
<div class="flex-container">{{ form.password1.label_tag }} {{ form.password1 }}</div>
|
||||
{% if form.password1.help_text %}
|
||||
<div class="help"{% if form.password1.id_for_label %} id="{{ form.password1.id_for_label }}_helptext">{% endif %}{{ form.password1.help_text|safe }}</div>
|
||||
{% endif %}
|
||||
@ -40,7 +40,7 @@
|
||||
|
||||
<div class="form-row">
|
||||
{{ form.password2.errors }}
|
||||
<div>{{ form.password2.label_tag }} {{ form.password2 }}</div>
|
||||
<div class="flex-container">{{ form.password2.label_tag }} {{ form.password2 }}</div>
|
||||
{% if form.password2.help_text %}
|
||||
<div class="help"{% if form.password2.id_for_label %} id="{{ form.password2.id_for_label }}_helptext"{% endif %}>{{ form.password2.help_text|safe }}</div>
|
||||
{% endif %}
|
||||
|
@ -5,27 +5,30 @@
|
||||
{% endif %}
|
||||
{% for line in fieldset %}
|
||||
<div class="form-row{% if line.fields|length == 1 and line.errors %} errors{% endif %}{% if not line.has_visible_field %} hidden{% endif %}{% for field in line %}{% if field.field.name %} field-{{ field.field.name }}{% endif %}{% endfor %}">
|
||||
{% if line.fields|length == 1 %}{{ line.errors }}{% endif %}
|
||||
{% if line.fields|length == 1 %}{{ line.errors }}{% else %}<div class="flex-container form-multiline">{% endif %}
|
||||
{% for field in line %}
|
||||
<div{% if not line.fields|length == 1 %} class="fieldBox{% if field.field.name %} field-{{ field.field.name }}{% endif %}{% if not field.is_readonly and field.errors %} errors{% endif %}{% if field.field.is_hidden %} hidden{% endif %}"{% elif field.is_checkbox %} class="checkbox-row"{% endif %}>
|
||||
<div>
|
||||
{% if not line.fields|length == 1 and not field.is_readonly %}{{ field.errors }}{% endif %}
|
||||
{% if field.is_checkbox %}
|
||||
{{ field.field }}{{ field.label_tag }}
|
||||
{% else %}
|
||||
{{ field.label_tag }}
|
||||
{% if field.is_readonly %}
|
||||
<div class="readonly">{{ field.contents }}</div>
|
||||
{% else %}
|
||||
{{ field.field }}
|
||||
{% endif %}
|
||||
<div class="flex-container{% if not line.fields|length == 1 %} fieldBox{% if field.field.name %} field-{{ field.field.name }}{% endif %}{% if not field.is_readonly and field.errors %} errors{% endif %}{% if field.field.is_hidden %} hidden{% endif %}{% elif field.is_checkbox %} checkbox-row{% endif %}">
|
||||
{% if field.is_checkbox %}
|
||||
{{ field.field }}{{ field.label_tag }}
|
||||
{% else %}
|
||||
{{ field.label_tag }}
|
||||
{% if field.is_readonly %}
|
||||
<div class="readonly">{{ field.contents }}</div>
|
||||
{% else %}
|
||||
{{ field.field }}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if field.field.help_text %}
|
||||
<div class="help"{% if field.field.id_for_label %} id="{{ field.field.id_for_label }}_helptext"{% endif %}>
|
||||
<div>{{ field.field.help_text|safe }}</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if field.field.help_text %}
|
||||
<div class="help"{% if field.field.id_for_label %} id="{{ field.field.id_for_label }}_helptext"{% endif %}>
|
||||
<div>{{ field.field.help_text|safe }}</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% if not line.fields|length == 1 %}</div>{% endif %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</fieldset>
|
||||
|
@ -33,12 +33,12 @@
|
||||
|
||||
<div class="form-row">
|
||||
{{ form.old_password.errors }}
|
||||
<div>{{ form.old_password.label_tag }} {{ form.old_password }}</div>
|
||||
<div class="flex-container">{{ form.old_password.label_tag }} {{ form.old_password }}</div>
|
||||
</div>
|
||||
|
||||
<div class="form-row">
|
||||
{{ form.new_password1.errors }}
|
||||
<div>{{ form.new_password1.label_tag }} {{ form.new_password1 }}</div>
|
||||
<div class="flex-container">{{ form.new_password1.label_tag }} {{ form.new_password1 }}</div>
|
||||
{% if form.new_password1.help_text %}
|
||||
<div class="help"{% if form.new_password1.id_for_label %} id="{{ form.new_password1.id_for_label }}_helptext"{% endif %}>{{ form.new_password1.help_text|safe }}</div>
|
||||
{% endif %}
|
||||
@ -46,7 +46,7 @@
|
||||
|
||||
<div class="form-row">
|
||||
{{ form.new_password2.errors }}
|
||||
<div>{{ form.new_password2.label_tag }} {{ form.new_password2 }}</div>
|
||||
<div class="flex-container">{{ form.new_password2.label_tag }} {{ form.new_password2 }}</div>
|
||||
{% if form.new_password2.help_text %}
|
||||
<div class="help"{% if form.new_password2.id_for_label %} id="{{ form.new_password2.id_for_label }}_helptext"{% endif %}>{{ form.new_password2.help_text|safe }}</div>
|
||||
{% endif %}
|
||||
|
@ -353,13 +353,13 @@ class TestInline(TestDataMixin, TestCase):
|
||||
)
|
||||
# The div containing the position field is hidden.
|
||||
self.assertInHTML(
|
||||
'<div class="fieldBox field-position hidden">'
|
||||
'<div class="flex-container fieldBox field-position hidden">'
|
||||
'<label class="inline">Position:</label>'
|
||||
'<div class="readonly">0</div></div>',
|
||||
response.rendered_content,
|
||||
)
|
||||
self.assertInHTML(
|
||||
'<div class="fieldBox field-position hidden">'
|
||||
'<div class="flex-container fieldBox field-position hidden">'
|
||||
'<label class="inline">Position:</label>'
|
||||
'<div class="readonly">1</div></div>',
|
||||
response.rendered_content,
|
||||
@ -382,14 +382,14 @@ class TestInline(TestDataMixin, TestCase):
|
||||
# The whole line containing position field is hidden.
|
||||
self.assertInHTML(
|
||||
'<div class="form-row hidden field-position">'
|
||||
"<div><label>Position:</label>"
|
||||
'<div class="readonly">0</div></div></div>',
|
||||
'<div><div class="flex-container"><label>Position:</label>'
|
||||
'<div class="readonly">0</div></div></div></div>',
|
||||
response.rendered_content,
|
||||
)
|
||||
self.assertInHTML(
|
||||
'<div class="form-row hidden field-position">'
|
||||
"<div><label>Position:</label>"
|
||||
'<div class="readonly">1</div></div></div>',
|
||||
'<div><div class="flex-container"><label>Position:</label>'
|
||||
'<div class="readonly">1</div></div></div></div>',
|
||||
response.rendered_content,
|
||||
)
|
||||
|
||||
|
@ -8076,11 +8076,13 @@ class TestLabelVisibility(TestCase):
|
||||
self.assert_field_visible(response, "second")
|
||||
|
||||
def assert_field_visible(self, response, field_name):
|
||||
self.assertContains(response, '<div class="fieldBox field-%s">' % field_name)
|
||||
self.assertContains(
|
||||
response, f'<div class="flex-container fieldBox field-{field_name}">'
|
||||
)
|
||||
|
||||
def assert_field_hidden(self, response, field_name):
|
||||
self.assertContains(
|
||||
response, '<div class="fieldBox field-%s hidden">' % field_name
|
||||
response, f'<div class="flex-container fieldBox field-{field_name} hidden">'
|
||||
)
|
||||
|
||||
def assert_fieldline_visible(self, response):
|
||||
|
Loading…
x
Reference in New Issue
Block a user