banner person: new responsive design, with custom area

This commit is contained in:
Mathieu Jaumotte 2021-07-30 14:58:26 +02:00
parent 31c5c8b52a
commit 7e4afc826b
3 changed files with 68 additions and 70 deletions

View File

@ -17,6 +17,11 @@ div#header-person-details {
color: #FFF; color: #FFF;
padding-top: 1em; padding-top: 1em;
padding-bottom: 1em; padding-bottom: 1em;
div.contact {
& > * {
margin-right: 1em;
}
}
} }
div#person_details_container { div#person_details_container {

View File

@ -3,52 +3,13 @@
<div class="container-xxl"> <div class="container-xxl">
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6 ps-md-5 ps-xxl-0">
{{ person|chill_entity_render_box({ {{ person|chill_entity_render_box({
'render': 'label', 'addInfo': true, 'addAge': true, 'addId': true, 'hLevel': 1 'render': 'label', 'addInfo': true, 'addAge': true, 'addId': true, 'hLevel': 1
}) }} }) }}
</div> </div>
<div class="col-md-6">
<div class="col-md-auto ps-4 ps-md-2"> {{ include('@ChillPerson/Person/banner_custom.html.twig') }}
<ul class="list-content fa-ul my-2">
{% if person.email %}
<li>
<i class="fa fa-li fa-envelope-o"></i>
<a href="{{ 'mailto:' ~ person.email }}" class="email" title="{{ 'Email'|trans }}">
{{ person.email }}
</a>
</li>
{% endif %}
{% if person.mobilenumber %}
<li>
<i class="fa fa-li fa-mobile"></i>
<a href="{{ 'tel:' ~ person.mobilenumber }}" class="phone mr-3" title="{{ 'Mobilenumber'|trans }}">
{{ person.mobilenumber|chill_format_phonenumber }}</a>
</li>
{% elseif person.phonenumber %}
<li>
<i class="fa fa-li fa-phone"></i>
<a href="{{ 'tel:' ~ person.phonenumber }}" class="phone mr-3" title="{{ 'Phonenumber'|trans }}">
{{ person.phonenumber|chill_format_phonenumber }}</a>
</li>
{% endif %}
</ul>
</div>
<div class="col-md ps-4 ps-md-2">
<ul class="list-content fa-ul">
{%- if person.currentHouseholdAddress is not empty -%}
<li>
<i class="fa fa-li fa-map-marker"></i>
{{ person.currentHouseholdAddress|chill_entity_render_box({'multiline': false, 'with_valid_from': false}) }}
</li>
{%- elseif person.lastAddress is not empty -%}
<li>
<i class="fa fa-li fa-map-marker"></i>
{{ person.lastAddress|chill_entity_render_box({'multiline': false, 'with_valid_from': false}) }}
</li>
{%- endif -%}
</ul>
</div> </div>
</div> </div>
@ -58,38 +19,43 @@
<div class="container-xxl"> <div class="container-xxl">
<div class="row justify-content-between"> <div class="row justify-content-between">
<div class="col-md-6 ps-4"> <div class="contact col-md-12 ps-md-5 ps-xxl-0">
<span class="open_sansbold"> {% if person.phonenumber %}
{{ 'Birthdate'|trans|upper }} &nbsp; : <span class="phonenumber d-block d-sm-inline-block">
</span> <i class="fa fa-fw fa-phone"></i>
{% if person.birthdate == null %} <a href="{{ 'tel:' ~ person.phonenumber }}" class="phone mr-3" title="{{ 'Phonenumber'|trans }}">
{{ 'Unknown date of birth'|trans }} {{ person.phonenumber|chill_format_phonenumber }}</a>
{% else %} </span>
{{ person.birthdate|format_date('short') }}
{% endif %} {% endif %}
</div> {% if person.mobilenumber %}
<span class="mobilenumber d-block d-sm-inline-block">
{%- if chill_person.fields.nationality == 'visible' -%} <i class="fa fa-fw fa-mobile"></i>
<div class="col-md-auto ps-4 ps-md-2"> <a href="{{ 'tel:' ~ person.mobilenumber }}" class="phone mr-3" title="{{ 'Mobilenumber'|trans }}">
<span class="open_sansbold"> {{ person.mobilenumber|chill_format_phonenumber }}</a>
{{ 'Nationality'|trans|upper}} &nbsp; : </span>
</span> {% endif %}
{% if person.nationality is not null %} {% if person.email %}
{{ person.nationality.name|localize_translatable_string }} <span class="email d-block d-sm-inline-block">
{% else %} <i class="fa fa-fw fa-envelope-o"></i>
{% trans %}Without nationality{% endtrans %} <a href="{{ 'mailto:' ~ person.email }}" class="email" title="{{ 'Email'|trans }}">
{{ person.email }}
</a>
</span>
{% endif %} {% endif %}
</div>
{%- endif -%}
{%- if chill_person.fields.spoken_languages == 'visible' -%} {%- if person.currentHouseholdAddress is not empty -%}
<div class="col-md ps-4 ps-md-2 text-md-end text-start pe-4"> {% set address = person.currentHouseholdAddress %}
<span class="open_sansbold"> {%- elseif person.lastAddress is not empty -%}
{{ 'Center'|trans|upper}} &nbsp; : {% set address = person.lastAddress %}
</span> {%- endif -%}
{{ person.center.name|upper }} {%- if address -%}
<span class=" d-block d-sm-inline-block">
{{ address|chill_entity_render_box({
'render': 'inline', 'multiline': false, 'with_picto': true, 'with_delimiter': true
}) }}
</span>
{%- endif -%}
</div> </div>
{%- endif -%}
</div> </div>
</div> </div>

View File

@ -0,0 +1,27 @@
{#
Overwrite this file to display client specific datas in custom area
#}
<div id="banner-person-custom" class="my-3 pe-md-5 pe-xxl-0">
<div class="text-md-end mb-1">
{%- if chill_person.fields.nationality == 'visible' -%}
<span class="open_sansbold">
{{ 'Nationality'|trans|upper}} :
</span>
{% if person.nationality is not null %}
{{ person.nationality.name|localize_translatable_string }}
{% else %}
<span class="chill-no-data-statement">
{% trans %}Without nationality{% endtrans %}
</span>
{% endif %}
{%- endif -%}
</div>
<div class="text-md-end">
{%- if chill_person.fields.spoken_languages == 'visible' -%}
<span class="open_sansbold">
{{ 'Center'|trans|upper}} :
</span>
{{ person.center.name|upper }}
{%- endif -%}
</div>
</div>