fix: Fix layout issue in ballot modals on narrow screens (#4911)
* fix: Fix layout issue in ballot modals on narrow screens Fixes #4902 * Also apply change to old positions * Fix tests * Use badge to indicate former ADs
This commit is contained in:
parent
e6e0d8fc1a
commit
ad5cf0bb01
|
@ -140,7 +140,7 @@ def ballot_icon(context, doc):
|
|||
i = i + 1
|
||||
|
||||
res.append("</tr></tbody></table></a>")
|
||||
res.append('<div id="modal-%d" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true"><div class="modal-dialog modal-dialog-scrollable modal-xl"><div class="modal-content"></div></div></div>' % ballot.pk)
|
||||
res.append('<div id="modal-%d" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true"><div class="modal-dialog modal-dialog-scrollable modal-xl modal-fullscreen-lg-down"><div class="modal-content"></div></div></div>' % ballot.pk)
|
||||
|
||||
return mark_safe("".join(res))
|
||||
|
||||
|
|
|
@ -1707,7 +1707,7 @@ class DocTestCase(TestCase):
|
|||
href = q(f'div.balloter-name a[href$="{author_slug}"]').attr('href')
|
||||
ids = [
|
||||
target.attr('id')
|
||||
for target in q(f'p.h5[id$="{author_slug}"]').items()
|
||||
for target in q(f'div.h5[id$="{author_slug}"]').items()
|
||||
]
|
||||
self.assertEqual(len(ids), 1, 'Should be exactly one link for the balloter')
|
||||
self.assertEqual(href, f'#{ids[0]}', 'Anchor href should match ID')
|
||||
|
|
|
@ -1198,9 +1198,9 @@ class BallotContentTests(TestCase):
|
|||
)
|
||||
|
||||
def _assertBallotMessage(self, q, balloter, expected):
|
||||
heading = q(f'p.h5[id$="_{slugify(balloter.plain_name())}"]')
|
||||
heading = q(f'div.h5[id$="_{slugify(balloter.plain_name())}"]')
|
||||
self.assertEqual(len(heading), 1)
|
||||
# <p.h5/> is followed by a panel with the message of interest, so use next()
|
||||
# <div.h5> is followed by a panel with the message of interest, so use next()
|
||||
self.assertEqual(
|
||||
len(heading.next().find(
|
||||
f'*[title="{expected}"]'
|
||||
|
@ -1381,4 +1381,4 @@ class BallotContentTests(TestCase):
|
|||
q = PyQuery(content)
|
||||
self._assertBallotMessage(q, balloters[0], 'No email send requests for this discuss')
|
||||
self._assertBallotMessage(q, balloters[1], 'No ballot position send log available')
|
||||
self._assertBallotMessage(q, old_balloter, 'No ballot position send log available')
|
||||
self._assertBallotMessage(q, old_balloter, 'No ballot position send log available')
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
{% load ietf_filters %}
|
||||
{% load textfilters %}
|
||||
<div class="row">
|
||||
<div class="col-md-2 d-none d-md-block d-sm-block d-lg-block d-xl-block d-xxl-block">
|
||||
<div class="col-md-2">
|
||||
{% for n, positions in position_groups %}
|
||||
<p class="h5">
|
||||
<span class="badge rounded-pill {{ n|pos_to_label_format }}">{{ n.name }}</span>
|
||||
|
@ -85,10 +85,12 @@
|
|||
{% for n, positions in position_groups %}
|
||||
{% for p in positions %}
|
||||
{% if not p.is_old_pos %}
|
||||
<p class="h5 mt-4"
|
||||
id="{{ doc.name|slugify }}_{{ p.balloter.plain_name|slugify }}">
|
||||
{{ p.balloter.plain_name }}
|
||||
<span class="float-end">
|
||||
<div class="h5 d-flex mt-4"
|
||||
id="{{ doc.name|slugify }}_{{ p.balloter.plain_name|slugify }}">
|
||||
<div class="flex-fill">
|
||||
{{ p.balloter.plain_name }}
|
||||
</div>
|
||||
<div class="flex-fill text-end">
|
||||
{% if p.old_positions %}<span class="text-muted small">(was {{ p.old_positions|join:", " }})</span>{% endif %}
|
||||
<span class="badge rounded-pill {{ p.pos|pos_to_label_format }}">{{ p.pos }}</span>
|
||||
{% if user|has_role:"Secretariat" %}
|
||||
|
@ -98,8 +100,8 @@
|
|||
Edit
|
||||
</a>
|
||||
{% endif %}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
{% if p.pos.blocking and p.discuss %}
|
||||
<div class="card border-danger {% if p.comment %} mb-2{% endif %}">
|
||||
<div class="card-header bg-danger text-light">
|
||||
|
@ -158,9 +160,12 @@
|
|||
{% for n, positions in position_groups %}
|
||||
{% for p in positions %}
|
||||
{% if p.is_old_pos %}
|
||||
<p class="h5 mt-4" id="{{ doc.name|slugify }}_{{ p.balloter.plain_name|slugify }}">
|
||||
<span class="text-muted">({{ p.balloter.plain_name }}; former steering group member)</span>
|
||||
<span class="float-end">
|
||||
<div class="h5 d-flex mt-4"
|
||||
id="{{ doc.name|slugify }}_{{ p.balloter.plain_name|slugify }}">
|
||||
<div class="flex-fill text-muted">
|
||||
{{ p.balloter.plain_name }} <span class="badge rounded-pill bg-secondary">Former IESG member</span>
|
||||
</div>
|
||||
<div class="flex-fill text-end">
|
||||
{% if p.old_positions %}<span class="text-muted small">(was {{ p.old_positions|join:", " }})</span>{% endif %}
|
||||
<span class="badge rounded-pill {{ p.pos|pos_to_label_format }}">{{ p.pos }}</span>
|
||||
{% if user|has_role:"Secretariat" %}
|
||||
|
@ -170,8 +175,8 @@
|
|||
Edit
|
||||
</a>
|
||||
{% endif %}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card {{ p.pos|pos_to_border_format }}">
|
||||
<div class="card-header {{ p.pos|pos_to_label_format }}">
|
||||
<div>
|
||||
|
@ -211,4 +216,4 @@
|
|||
{% endfor %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
Loading…
Reference in a new issue