page blocs design

This commit is contained in:
Mathieu Jaumotte 2021-05-25 15:36:07 +02:00
parent 7efbf2fce8
commit fc2a2da75f
2 changed files with 75 additions and 39 deletions

View File

@ -82,6 +82,7 @@ div.flex-bloc {
border: 1px solid #000; border: 1px solid #000;
margin: 0 1em 1em 0; margin: 0 1em 1em 0;
padding: 1em; padding: 1em;
padding-bottom: 0;
flex-grow: 0; flex-grow: 0;
flex-shrink: 0; flex-shrink: 0;
flex-basis: 30%; flex-basis: 30%;
@ -94,15 +95,23 @@ div.flex-bloc {
} }
.content-bloc { .content-bloc {
margin: 0; margin: 0;
font-size: 90%; font-size: 80%;
} }
dl { dd {
margin: 0.67em auto;
} }
ul.record_actions { ul.record_actions {
margin-top: auto; margin-top: auto;
margin-bottom: 0; margin-bottom: 0;
} }
} }
@media only screen and (max-width: 1024px) {
div.item-bloc {
flex-grow: 0;
flex-shrink: 0;
flex-basis: 45%;
}
}
@media only screen and (max-width: 768px) { @media only screen and (max-width: 768px) {
flex-direction: column; flex-direction: column;
} }

View File

@ -28,16 +28,18 @@
<dl class="content-bloc"> <dl class="content-bloc">
<dd> <dd>
{{ p.person.gender == 'woman' ? 'F' : 'M' }} {% set born = (p.person.gender == 'woman') ? 'née': 'né' %}
</dd> {% set gender = (p.person.gender == 'woman') ? 'fa-venus' :
<dd> (p.person.gender == 'man') ? 'fa-mars' : 'fa-neuter' %}
{{ 'né le ' ~ p.person.birthdate|format_date('short') }} {% set genderTitle = (p.person.gender == 'woman') ? 'femme' :
(p.person.gender == 'homme') ? 'fa-mars' : 'neutre' %}
<i class="fa fa-fw {{ gender }}" title="{{ genderTitle }}"></i>{{ born ~ ' le ' ~ p.person.birthdate|format_date('short') }}
</dd> </dd>
<dd> <dd>
{% if p.person.mobilenumber %} {% if p.person.mobilenumber %}
<dt class="fa fa-fw fa-mobile"></dt>{{ p.person.mobilenumber }} <i class="fa fa-fw fa-mobile"></i>{{ p.person.mobilenumber }}
{% else %} {% else %}
<dt class="fa fa-fw fa-phone"></dt> <i class="fa fa-fw fa-phone"></i>
{% if p.person.phonenumber %} {% if p.person.phonenumber %}
{{ p.person.phonenumber }} {{ p.person.phonenumber }}
{% else %} {% else %}
@ -68,62 +70,87 @@
<h2>{{ 'Resources'|trans }}</h2> <h2>{{ 'Resources'|trans }}</h2>
<div class="flex-bloc right">
{% for r in accompanyingCourse.resources %} {% for r in accompanyingCourse.resources %}
<div class="item-bloc">
{% if r.person %} {% if r.person %}
<h5> <h5>
{{ r.person.firstname ~ ' ' ~ r.person.lastname }} {{ r.person.firstname ~ ' ' ~ r.person.lastname }}
<span class="badge badge-pill badge-secondary">{{ 'Usager' }}</span> <span class="badge badge-pill badge-secondary">{{ 'Usager' }}</span>
</h5> </h5>
{{ r.person.gender == 'woman' ? 'F' : 'M' }}<br> <dl class="content-bloc">
{{ 'né le ' ~ r.person.birthdate|format_date('short') }}<br>
<dd>
{% if r.person.mobilenumber %} {% set born = (r.person.gender == 'woman') ? 'née': 'né' %}
<i class="fa fa-fw fa-mobile"></i>{{ r.person.mobilenumber }} {% set gender = (r.person.gender == 'woman') ? 'fa-venus' :
{% else %} (r.person.gender == 'man') ? 'fa-mars' : 'fa-neuter' %}
<i class="fa fa-fw fa-phone"></i> {% set genderTitle = (r.person.gender == 'woman') ? 'femme' :
{% if r.person.phonenumber %} (r.person.gender == 'mhomme') ? 'fa-mars' : 'neutre' %}
{{ r.person.phonenumber }} <i class="fa fa-fw {{ gender }}" title="{{ genderTitle }}"></i>{{ born ~ ' le ' ~ r.person.birthdate|format_date('short') }}
{% else %} </dd>
<span class="chill-no-data-statement">{{ 'No data given'|trans }}</span> <dd>
{% endif %} {% if r.person.mobilenumber %}
{% endif %}<br> <i class="fa fa-fw fa-mobile"></i>{{ r.person.mobilenumber }}
{% else %}
{%- if r.person.lastAddress is not empty -%} <i class="fa fa-fw fa-phone"></i>
{{ address._render(r.person.lastAddress, {'has_no_address': true, 'with_valid_from': false, 'with_icon': true}) }} {% if r.person.phonenumber %}
{%- else -%} {{ r.person.phonenumber }}
<i class="fa fa-fw fa-map-marker"></i> {% else %}
<span class="chill-no-data-statement">{{ 'No address given'|trans }}</span> <span class="chill-no-data-statement">{{ 'No data given'|trans }}</span>
{%- endif -%} {% endif %}
{% endif %}
</dd>
<dd>
{%- if r.person.lastAddress is not empty -%}
{{ address._render(r.person.lastAddress, {'has_no_address': true, 'with_valid_from': false, 'with_icon': true}) }}
{%- else -%}
<i class="fa fa-fw fa-map-marker"></i>
<span class="chill-no-data-statement">{{ 'No address given'|trans }}</span>
{%- endif -%}
</dd>
</dl>
<ul class="record_actions"> <ul class="record_actions">
<li> <li>
<a href="{{ path('chill_person_view', { person_id: r.person.id }) }}" class="sc-button bt-show" target="_blank" title="Voir"></a> <a href="{{ path('chill_person_view', { person_id: r.person.id }) }}" class="sc-button bt-show" target="_blank" title="Voir"></a>
</li> </li>
</ul> </ul>
{% endif %} {% endif %}
{% if r.thirdParty %} {% if r.thirdParty %}
<h5> <h5>
{{ r.thirdParty.name }} {{ r.thirdParty.name }}
<span class="badge badge-pill badge-secondary">{{ 'Tiers' }}</span> <span class="badge badge-pill badge-secondary">{{ 'Tiers' }}</span>
</h5> </h5>
<i class="fa fa-fw fa-phone"></i>{{ r.thirdParty.telephone|chill_print_or_message("thirdparty.No_phonenumber") }}<br> <dl class="content-bloc">
<i class="fa fa-fw fa-envelope-o"></i>{{ r.thirdParty.email|chill_print_or_message("thirdparty.No_email") }}<br>
<dd>
{% if r.thirdParty.address == null %} <i class="fa fa-fw fa-phone"></i>{{ r.thirdParty.telephone|chill_print_or_message("thirdparty.No_phonenumber") }}
<i class="fa fa-fw fa-map-marker"></i><span class="chill-no-data-statement">{{ 'No address given'|trans }}</span> </dd>
{% else %} <dd>
{{ address._render(r.thirdParty.address, {'with_valid_from': false, 'with_icon': true }) }} <i class="fa fa-fw fa-envelope-o"></i>{{ r.thirdParty.email|chill_print_or_message("thirdparty.No_email") }}
{% endif %} </dd>
<dd>
{% if r.thirdParty.address == null %}
<i class="fa fa-fw fa-map-marker"></i><span class="chill-no-data-statement">{{ 'No address given'|trans }}</span>
{% else %}
{{ address._render(r.thirdParty.address, {'with_valid_from': false, 'with_icon': true }) }}
{% endif %}
</dd>
</dl>
<ul class="record_actions"> <ul class="record_actions">
<li> <li>
<a href="{{ path('chill_3party_3party_show', { thirdparty_id: r.thirdParty.id }) }}" class="sc-button bt-show" target="_blank" title="Voir"></a> <a href="{{ path('chill_3party_3party_show', { thirdparty_id: r.thirdParty.id }) }}" class="sc-button bt-show" target="_blank" title="Voir"></a>
</li> </li>
</ul> </ul>
{% endif %} {% endif %}
</div>
{% endfor %} {% endfor %}
</div>
<h2>{{ 'Social actions'|trans }}</h2> <h2>{{ 'Social actions'|trans }}</h2>