Fix person banner contact details responsive placement

This commit is contained in:
Mathieu Jaumotte 2023-04-21 21:10:51 +02:00
parent 7cb7897e12
commit dc22c94b95
2 changed files with 19 additions and 16 deletions

View File

@ -19,6 +19,9 @@
*/ */
@mixin context_buttons ($context) { @mixin context_buttons ($context) {
.chill-entity.entity-address .address {
padding-right: 1em;
}
.address-details-button, .address-details-button,
.household-link { .household-link {
border: 1px solid white; border: 1px solid white;

View File

@ -19,25 +19,25 @@
<div id="header-person-details" class="header-details"> <div id="header-person-details" class="header-details">
<div class="container-xxl"> <div class="container-xxl">
<div class="row justify-content-between"> <div class="row justify-content-between">
<div class="col-md-12 ps-md-5 ps-xxl-0 container">
<div class="row contact">
<div class="col-md-12 ps-md-5 ps-xxl-0">
<div class="contact">
{% if person.phonenumber %} {% if person.phonenumber %}
<span class="phonenumber d-block d-sm-inline-block"> <span class="col-auto phonenumber">
<i class="fa fa-fw fa-phone"></i> <i class="fa fa-fw fa-phone"></i>
<a href="{{ 'tel:' ~ person.phonenumber|phone_number_format('E164') }}" class="phone mr-3" title="{{ 'Phonenumber'|trans }}"> <a href="{{ 'tel:' ~ person.phonenumber|phone_number_format('E164') }}" class="phone mr-3" title="{{ 'Phonenumber'|trans }}">
{{ person.phonenumber|chill_format_phonenumber }}</a> {{ person.phonenumber|chill_format_phonenumber }}</a>
</span> </span>
{% endif %} {% endif %}
{% if person.mobilenumber %} {% if person.mobilenumber %}
<span class="mobilenumber d-block d-sm-inline-block"> <span class="col-auto mobilenumber">
<i class="fa fa-fw fa-mobile"></i> <i class="fa fa-fw fa-mobile"></i>
<a href="{{ 'tel:' ~ person.mobilenumber|phone_number_format('E164') }}" class="phone mr-3" title="{{ 'Mobilenumber'|trans }}"> <a href="{{ 'tel:' ~ person.mobilenumber|phone_number_format('E164') }}" class="phone mr-3" title="{{ 'Mobilenumber'|trans }}">
{{ person.mobilenumber|chill_format_phonenumber }}</a> {{ person.mobilenumber|chill_format_phonenumber }}</a>
</span> </span>
{% endif %} {% endif %}
{% if person.email %} {% if person.email %}
<span class="email d-block d-sm-inline-block"> <span class="col-auto email">
<i class="fa fa-fw fa-envelope-o"></i> <i class="fa fa-fw fa-envelope-o"></i>
<a href="{{ 'mailto:' ~ person.email }}" class="email" title="{{ 'Email'|trans }}"> <a href="{{ 'mailto:' ~ person.email }}" class="email" title="{{ 'Email'|trans }}">
{{ person.email }} {{ person.email }}
@ -51,26 +51,26 @@
{%- elseif person.lastAddress is not empty -%} {%- elseif person.lastAddress is not empty -%}
{% set address = person.lastAddress %} {% set address = person.lastAddress %}
{%- endif -%} {%- endif -%}
<span class="col-md-auto address">
{%- if address is not null -%} {%- if address is not null -%}
<span class=" d-block d-sm-inline-block">
{{ address|chill_entity_render_box({ {{ address|chill_entity_render_box({
'render': 'inline', 'multiline': false, 'with_picto': true, 'with_delimiter': true 'render': 'inline', 'multiline': false, 'with_picto': true, 'with_delimiter': true
}) }} }) }}
</span>
{%- endif -%} {%- endif -%}
{% if person.getCurrentHousehold is not null %} {% if person.getCurrentHousehold is not null %}
<span> <a class="btn household-link text-end"
<a href="{{ chill_path_add_return_path('chill_person_household_summary', { 'household_id' : person.getCurrentHousehold.id } ) }}" href="{{ chill_path_add_return_path('chill_person_household_summary', { 'household_id' : person.getCurrentHousehold.id } ) }}"
class="btn household-link" title="{{ 'Show household'|trans }}"> title="{{ 'Show household'|trans }}">
<i class="fa fa-lg fa-home"></i> <i class="fa fa-lg fa-home"></i>
</a> </a>
</span>
{% endif %} {% endif %}
</div> </span>
</div>
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
<a id="banner-person"></a> <a id="banner-person"></a>
</div> </div>