Consistent styling for filter forms

This commit is contained in:
Raphael Michel
2021-07-19 13:40:44 +02:00
parent a4a2500725
commit 1ed1cd33e8
15 changed files with 348 additions and 290 deletions

View File

@@ -12,47 +12,50 @@
reserve some quota for your very special guests.
{% endblocktrans %}
</p>
<div class="row filter-form">
<form class="col-lg-2 col-sm-6 col-xs-6"
action="{% url "control:event.vouchers.go" event=request.event.slug organizer=request.event.organizer.slug %}">
<div class="input-group">
<input type="text" name="code" class="form-control" placeholder="{% trans "Voucher code" %}" autofocus>
<span class="input-group-btn">
<form class="form-inline"
action="{% url "control:event.vouchers.go" event=request.event.slug organizer=request.event.organizer.slug %}">
<p class="input-group">
<input type="text" name="code" class="form-control" placeholder="{% trans "Voucher code" %}" autofocus>
<span class="input-group-btn">
<button class="btn btn-primary" type="submit">{% trans "Go!" %}</button>
</span>
</div>
</form>
<form class="" action="" method="get">
<div class="col-lg-2 col-sm-3 col-xs-6">
{% bootstrap_field filter_form.search layout='inline' %}
</div>
<div class="col-lg-1 col-sm-3 col-xs-6">
{% bootstrap_field filter_form.tag layout='inline' %}
</div>
{% if request.event.has_subevents %}
<div class="col-lg-1 col-sm-3 col-xs-6">
{% bootstrap_field filter_form.status layout='inline' %}
</p>
</form>
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">{% trans "Filter" %}</h3>
</div>
<form class="panel-body filter-form" action="" method="get">
<div class="row">
<div class="col-lg-2 col-sm-6 col-xs-6">
{% bootstrap_field filter_form.search %}
</div>
<div class="col-lg-2 col-sm-3 col-xs-6">
{% bootstrap_field filter_form.subevent layout='inline' %}
{% if request.event.has_subevents %}
<div class="col-lg-2 col-sm-6 col-xs-6">
{% bootstrap_field filter_form.tag %}
</div>
<div class="col-lg-2 col-sm-6 col-xs-6">
{% bootstrap_field filter_form.subevent %}
</div>
{% else %}
<div class="col-lg-4 col-sm-6 col-xs-6">
{% bootstrap_field filter_form.tag %}
</div>
{% endif %}
<div class="col-lg-2 col-sm-6 col-xs-6">
{% bootstrap_field filter_form.status %}
</div>
{% else %}
<div class="col-lg-3 col-sm-6 col-xs-6">
{% bootstrap_field filter_form.status layout='inline' %}
<div class="col-lg-2 col-sm-6 col-xs-6">
{% bootstrap_field filter_form.itemvar %}
</div>
<div class="col-lg-2 col-sm-6 col-xs-6">
{% bootstrap_field filter_form.qm %}
</div>
{% endif %}
<div class="col-lg-2 col-sm-6 col-xs-6">
{% bootstrap_field filter_form.itemvar layout='inline' %}
</div>
<div class="col-lg-1 col-sm-6 col-xs-6">
{% bootstrap_field filter_form.qm layout='inline' %}
</div>
<div class="col-lg-1 col-sm-6 col-xs-6">
<button class="btn btn-primary btn-block" type="submit">
<div class="text-right">
<button class="btn btn-primary btn-lg" type="submit">
<span class="fa fa-filter"></span>
<span class="hidden-md">
{% trans "Filter" %}
</span>
{% trans "Filter" %}
</button>
</div>
</form>