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;
margin: 0 1em 1em 0;
padding: 1em;
padding-bottom: 0;
flex-grow: 0;
flex-shrink: 0;
flex-basis: 30%;
@ -94,15 +95,23 @@ div.flex-bloc {
}
.content-bloc {
margin: 0;
font-size: 90%;
font-size: 80%;
}
dl {
dd {
margin: 0.67em auto;
}
ul.record_actions {
margin-top: auto;
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) {
flex-direction: column;
}

View File

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