Align address detail button style with banner context buttons

This commit is contained in:
Mathieu Jaumotte 2023-04-21 18:05:29 +02:00
parent 01f2697b8d
commit 7cb7897e12
3 changed files with 30 additions and 15 deletions

View File

@ -1,7 +1,7 @@
<template>
<span v-if="data.working_ref_status === 'to_review'" class="badge bg-danger address-details-button-warning">L'adresse de référence a été modifiée</span>
<a v-if="data.loading === false" @click.prevent="clickOrOpen" class="btn btn-sm btn-misc">
<span class="fa fa-map address-details-button"></span>
<a v-if="data.loading === false" @click.prevent="clickOrOpen" class="btn btn-misc address-details-button">
<span class="fa fa-map"></span> <!-- button -->
</a>
<span v-if="data.loading" class="fa fa-spin fa-spinner "></span>
<AddressModal :address="data.working_address" @update-address="onUpdateAddress" ref="address_modal"></AddressModal>

View File

@ -14,6 +14,28 @@
@import './scss/person_by_phonenumber.scss';
@import './scss/address_history.scss';
/*
* Mixins
*/
@mixin context_buttons ($context) {
.address-details-button,
.household-link {
border: 1px solid white;
background-color: transparent;
width: 1.85rem;
height: 1.85rem;
font-size: 75%;
padding: .38rem;
border-radius: 5px;
color: white;
cursor: pointer;
&:hover {
background-color: white;
color: $context
}
}
}
/*
* PERSON CONTEXT
@ -39,17 +61,7 @@ div.banner {
margin-right: 1em;
}
}
.household-link {
border: 1px solid white;
padding: .05rem .3rem;
border-radius: 5px;
color: white;
cursor: pointer;
&:hover {
background-color: white;
color: $chill-person-context
}
}
@include context_buttons($chill-person-context);
}
}
@ -219,6 +231,8 @@ div.banner {
font-weight: 700;
font-weight: bold;
}
@include context_buttons($chill-household-context);
}
}

View File

@ -60,8 +60,9 @@
{%- endif -%}
{% if person.getCurrentHousehold is not null %}
<span>
<a class="household-link" href="{{ chill_path_add_return_path('chill_person_household_summary', { 'household_id' : person.getCurrentHousehold.id } ) }}">
<i class="fa fa-home"></i>
<a href="{{ chill_path_add_return_path('chill_person_household_summary', { 'household_id' : person.getCurrentHousehold.id } ) }}"
class="btn household-link" title="{{ 'Show household'|trans }}">
<i class="fa fa-lg fa-home"></i>
</a>
</span>
{% endif %}