Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-07 18:44:08 +00:00
Code Issues Actions Projects Releases Wiki Activity

UX: improve FilterOrder box design

Browse Source
This commit is contained in:
Mathieu Jaumotte 2023-07-04 16:42:56 +02:00
parent 1485d1ce7a
commit 3e63b4abf3
4 changed files with 50 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/Bundle/ChillActivityBundle/translations/messages.fr.yml
View File

@ -96,6 +96,8 @@ activity_filter:
My activities: Mes échanges (où j'interviens) My activities: Mes échanges (où j'interviens)
Types: Par type d'échange Types: Par type d'échange
Jobs: Par métier impliqué Jobs: Par métier impliqué
By: Filtrer par
Search: Chercher dans la liste
#timeline #timeline
'%user% has done an %activity_type%': '%user% a effectué un échange de type "%activity_type%"' '%user% has done an %activity_type%': '%user% a effectué un échange de type "%activity_type%"'

3
src/Bundle/ChillMainBundle/Form/Type/Listing/FilterOrderType.php
View File

@ -38,6 +38,9 @@ final class FilterOrderType extends \Symfony\Component\Form\AbstractType
$builder->add('q', SearchType::class, [ $builder->add('q', SearchType::class, [
'label' => false, 'label' => false,
'required' => false, 'required' => false,
'attr' => [
'placeholder' => 'activity_filter.Search',
]
]); ]);
} }

12
src/Bundle/ChillMainBundle/Resources/public/chill/scss/forms.scss
View File

@ -42,3 +42,15 @@ form {
font-weight: 700; font-weight: 700;
margin-bottom: .375em; margin-bottom: .375em;
} }
.chill_filter_order {
background: $gray-100; /*
border: 3px dashed $white;
background: repeating-linear-gradient(
-45deg,
$gray-100,
$gray-100 2px,
$white 2px,
$white 6px
); */
}

81
src/Bundle/ChillMainBundle/Resources/views/FilterOrder/base.html.twig
View File

@ -1,102 +1,87 @@
{{ form_start(form) }} {{ form_start(form) }}
<div class="chill_filter_order container my-4"> {% set btnSubmit = 0 %}
<div class="row"> <div class="chill_filter_order container-xxl p-5 py-2 my-3">
<div class="row my-2">
{% if form.vars.has_search_box %} {% if form.vars.has_search_box %}
<div class="col-md-12"> <div class="col-sm-12">
<div class="input-group mb-3"> <div class="input-group">
{{ form_widget(form.q)}} {{ form_widget(form.q) }}
<button type="submit" class="btn btn-chill-l-gray"><i class="fa fa-search"></i></button> <button type="submit" class="btn btn-misc"><i class="fa fa-search"></i></button>
</div> </div>
</div> </div>
{% endif %} {% endif %}
</div> </div>
{% if form.dateRanges is defined %} {% if form.dateRanges is defined %}
{% set btnSubmit = 1 %}
{% if form.dateRanges|length > 0 %} {% if form.dateRanges|length > 0 %}
{% for dateRangeName, _o in form.dateRanges %} {% for dateRangeName, _o in form.dateRanges %}
<div class="row gx-2 justify-content-center items-center"> <div class="row my-2">
{% if form.dateRanges[dateRangeName].vars.label is not same as(false) %} {% if form.dateRanges[dateRangeName].vars.label is not same as(false) %}
<div class="col-md-4">
{{ form_label(form.dateRanges[dateRangeName])}} {{ form_label(form.dateRanges[dateRangeName])}}
</div>
{% endif %} {% endif %}
<div class="col-md-7"> <div class="col-sm-8 pt-2">
<div class="input-group mb-3"> <div class="input-group">
<span class="input-group-text">{{ 'chill_calendar.From'|trans }}</span> <span class="input-group-text">{{ 'chill_calendar.From'|trans }}</span>
{{ form_widget(form.dateRanges[dateRangeName]['from']) }} {{ form_widget(form.dateRanges[dateRangeName]['from']) }}
<span class="input-group-text">{{ 'chill_calendar.To'|trans }}</span> <span class="input-group-text">{{ 'chill_calendar.To'|trans }}</span>
{{ form_widget(form.dateRanges[dateRangeName]['to']) }} {{ form_widget(form.dateRanges[dateRangeName]['to']) }}
</div> </div>
</div> </div>
<div class="col-md-1" style="text-align: right;">
<button type="submit" class="btn btn-misc"><i class="fa fa-filter"></i></button>
</div>
</div> </div>
{% endfor %} {% endfor %}
{% endif %} {% endif %}
{% endif %} {% endif %}
{% if form.checkboxes is defined %} {% if form.checkboxes is defined %}
{% set btnSubmit = 1 %}
{% if form.checkboxes|length > 0 %} {% if form.checkboxes|length > 0 %}
{% for checkbox_name, options in form.checkboxes %} {% for checkbox_name, options in form.checkboxes %}
<div class="row gx-0 align-items-center"> <div class="row my-2">
<div class="col-md-12"> <div class="col-sm-4 col-form-label">{{ 'activity_filter.By'|trans }}</div>
<div class="col-sm-8 pt-2">
{% for c in form['checkboxes'][checkbox_name].children %} {% for c in form['checkboxes'][checkbox_name].children %}
<div class="form-check form-check-inline"> {{ form_widget(c) }}
{{ form_widget(c) }} {{ form_label(c) }}
{{ form_label(c) }}
</div>
{% endfor %} {% endfor %}
</div> </div>
</div> </div>
{% if loop.last %}
<div class="row gx-0">
<div class="col-md-12">
<ul class="record_actions">
<li>
<button type="submit" class="btn btn-misc"><i class="fa fa-filter"></i></button>
</li>
</ul>
</div>
</div>
{% endif %}
{% endfor %} {% endfor %}
{% endif %} {% endif %}
{% endif %} {% endif %}
{% if form.entity_choices is defined %} {% if form.entity_choices is defined %}
{% set btnSubmit = 1 %}
{% if form.entity_choices |length > 0 %} {% if form.entity_choices |length > 0 %}
{% for checkbox_name, options in form.entity_choices %} {% for checkbox_name, options in form.entity_choices %}
<div class="row gx-0 align-items-center"> <div class="row my-2">
{% if form.entity_choices[checkbox_name].vars.label is not same as(false) %} {% if form.entity_choices[checkbox_name].vars.label is not same as(false) %}
<div class="col-md-4"> {{ form_label(form.entity_choices[checkbox_name])}}
{{ form_label(form.entity_choices[checkbox_name])}}
</div>
{% endif %} {% endif %}
<div class="col-md-7"> <div class="col-sm-8 pt-2">
{% for c in form['entity_choices'][checkbox_name].children %} {% for c in form['entity_choices'][checkbox_name].children %}
<div class="form-check form-check-inline"> {{ form_widget(c) }}
{{ form_widget(c) }} {{ form_label(c) }}
{{ form_label(c) }}
</div>
{% endfor %} {% endfor %}
</div> </div>
<div class="col-md-1 text-right" style="text-align: right;">
<button type="submit" class="btn btn-misc"><i class="fa fa-filter"></i></button>
</div>
</div> </div>
{% endfor %} {% endfor %}
{% endif %} {% endif %}
{% endif %} {% endif %}
{% if form.single_checkboxes is defined %} {% if form.single_checkboxes is defined %}
{% set btnSubmit = 1 %}
{% for name, _o in form.single_checkboxes %} {% for name, _o in form.single_checkboxes %}
<div class="row gx-2 align-items-center"> <div class="row my-2">
<div class="col-md-7 offset-md-4"> <div class="col-sm-4 col-form-label">{{ 'activity_filter.By'|trans }}</div>
<div class="col-sm-8 pt-2">
{{ form_widget(form.single_checkboxes[name]) }} {{ form_widget(form.single_checkboxes[name]) }}
</div> </div>
<div class="col-md-1 text-right" style="text-align: right;">
<button type="submit" class="btn btn-misc"><i class="fa fa-filter"></i></button>
</div>
</div> </div>
{% endfor %} {% endfor %}
{% endif %} {% endif %}
{% if btnSubmit == 1 %}
<div class="row my-2">
<button type="submit" class="btn btn-sm btn-misc"><i class="fa fa-fw fa-filter"></i>{{ 'Filter'|trans }}</button>
</div>
{% endif %}
</div> </div>
{% for k,v in otherParameters %} {% for k,v in otherParameters %}