From 7cb7897e1223095cbff702ad9662c5cf1d21a566 Mon Sep 17 00:00:00 2001
From: Mathieu Jaumotte <mathieu.jaumotte@champs-libres.coop>
Date: Fri, 21 Apr 2023 18:05:29 +0200
Subject: [PATCH 1/3] Align address detail button style with banner context
 buttons

---
 .../AddressDetails/AddressDetailsButton.vue   |  4 +--
 .../Resources/public/chill/chillperson.scss   | 36 +++++++++++++------
 .../Resources/views/Person/banner.html.twig   |  5 +--
 3 files changed, 30 insertions(+), 15 deletions(-)

diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/AddressDetails/AddressDetailsButton.vue b/src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/AddressDetails/AddressDetailsButton.vue
index 7e060de4c..2bca56379 100644
--- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/AddressDetails/AddressDetailsButton.vue
+++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/AddressDetails/AddressDetailsButton.vue
@@ -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>
diff --git a/src/Bundle/ChillPersonBundle/Resources/public/chill/chillperson.scss b/src/Bundle/ChillPersonBundle/Resources/public/chill/chillperson.scss
index fba0516a7..7423919c4 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/chill/chillperson.scss
+++ b/src/Bundle/ChillPersonBundle/Resources/public/chill/chillperson.scss
@@ -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);
     }
 }
 
diff --git a/src/Bundle/ChillPersonBundle/Resources/views/Person/banner.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/Person/banner.html.twig
index 8f7d5cc20..b35c7f40a 100644
--- a/src/Bundle/ChillPersonBundle/Resources/views/Person/banner.html.twig
+++ b/src/Bundle/ChillPersonBundle/Resources/views/Person/banner.html.twig
@@ -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 %}

From dc22c94b95c64d96a8baadb36f33e707677f021d Mon Sep 17 00:00:00 2001
From: Mathieu Jaumotte <mathieu.jaumotte@champs-libres.coop>
Date: Fri, 21 Apr 2023 21:10:51 +0200
Subject: [PATCH 2/3] Fix person banner contact details responsive placement

---
 .../Resources/public/chill/chillperson.scss   |  3 ++
 .../Resources/views/Person/banner.html.twig   | 32 +++++++++----------
 2 files changed, 19 insertions(+), 16 deletions(-)

diff --git a/src/Bundle/ChillPersonBundle/Resources/public/chill/chillperson.scss b/src/Bundle/ChillPersonBundle/Resources/public/chill/chillperson.scss
index 7423919c4..59a9b05db 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/chill/chillperson.scss
+++ b/src/Bundle/ChillPersonBundle/Resources/public/chill/chillperson.scss
@@ -19,6 +19,9 @@
  */
 
 @mixin context_buttons ($context) {
+    .chill-entity.entity-address .address {
+        padding-right: 1em;
+    }
     .address-details-button,
     .household-link {
         border: 1px solid white;
diff --git a/src/Bundle/ChillPersonBundle/Resources/views/Person/banner.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/Person/banner.html.twig
index b35c7f40a..2df130506 100644
--- a/src/Bundle/ChillPersonBundle/Resources/views/Person/banner.html.twig
+++ b/src/Bundle/ChillPersonBundle/Resources/views/Person/banner.html.twig
@@ -19,25 +19,25 @@
     <div id="header-person-details" class="header-details">
         <div class="container-xxl">
             <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 %}
-                            <span class="phonenumber d-block d-sm-inline-block">
+                            <span class="col-auto phonenumber">
                                 <i class="fa fa-fw fa-phone"></i>
                                 <a href="{{ 'tel:' ~ person.phonenumber|phone_number_format('E164') }}" class="phone mr-3" title="{{ 'Phonenumber'|trans }}">
                                     {{ person.phonenumber|chill_format_phonenumber }}</a>
                             </span>
                         {% endif %}
                         {% 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>
                                 <a href="{{ 'tel:' ~ person.mobilenumber|phone_number_format('E164') }}" class="phone mr-3" title="{{ 'Mobilenumber'|trans }}">
                                     {{ person.mobilenumber|chill_format_phonenumber }}</a>
                             </span>
                         {% endif %}
                         {% 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>
                                 <a href="{{ 'mailto:' ~ person.email }}" class="email" title="{{ 'Email'|trans }}">
                                     {{ person.email }}
@@ -51,24 +51,24 @@
                         {%- elseif person.lastAddress is not empty -%}
                             {% set address = person.lastAddress %}
                         {%- endif -%}
-                        {%- if address is not null -%}
-                            <span class=" d-block d-sm-inline-block">
+
+                        <span class="col-md-auto address">
+                            {%- if address is not null -%}
                                 {{ address|chill_entity_render_box({
                                     'render': 'inline', 'multiline': false, 'with_picto': true, 'with_delimiter': true
                                 }) }}
-                            </span>
-                        {%- endif -%}
-                        {% if person.getCurrentHousehold is not null %}
-                            <span>
-                                <a href="{{ chill_path_add_return_path('chill_person_household_summary', { 'household_id' : person.getCurrentHousehold.id } ) }}"
-                                    class="btn household-link" title="{{ 'Show household'|trans }}">
+                            {%- endif -%}
+                            {% if person.getCurrentHousehold is not null %}
+                                <a class="btn household-link text-end"
+                                    href="{{ chill_path_add_return_path('chill_person_household_summary', { 'household_id' : person.getCurrentHousehold.id } ) }}"
+                                    title="{{ 'Show household'|trans }}">
                                     <i class="fa fa-lg fa-home"></i>
                                 </a>
-                            </span>
-                        {% endif %}
+                            {% endif %}
+                        </span>
+
                     </div>
                 </div>
-
             </div>
         </div>
     </div>

From 13feb3b212087b04318de2a394f3eea8d5ddbced Mon Sep 17 00:00:00 2001
From: Mathieu Jaumotte <mathieu.jaumotte@champs-libres.coop>
Date: Fri, 21 Apr 2023 19:25:24 +0200
Subject: [PATCH 3/3] [twig][templates] introduce an option in
 adress_entity_render to display or not the address details button

---
 .../Resources/public/chill/scss/render_box.scss   |  1 +
 .../Resources/views/Entity/address.html.twig      | 15 +++++++++++++--
 .../Resources/views/Household/banner.html.twig    |  3 ++-
 .../Resources/views/Household/summary.html.twig   |  6 +++++-
 .../Resources/views/Person/banner.html.twig       |  3 ++-
 5 files changed, 23 insertions(+), 5 deletions(-)

diff --git a/src/Bundle/ChillMainBundle/Resources/public/chill/scss/render_box.scss b/src/Bundle/ChillMainBundle/Resources/public/chill/scss/render_box.scss
index 19da5aed3..57fa17648 100644
--- a/src/Bundle/ChillMainBundle/Resources/public/chill/scss/render_box.scss
+++ b/src/Bundle/ChillMainBundle/Resources/public/chill/scss/render_box.scss
@@ -64,6 +64,7 @@ section.chill-entity {
                 margin: 0.7em 0;
                 p {
                     display: block;
+                    margin-bottom: 0;
                 }
             }
             &.delimiter {
diff --git a/src/Bundle/ChillMainBundle/Resources/views/Entity/address.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Entity/address.html.twig
index 7592e9a9a..f0967ef64 100644
--- a/src/Bundle/ChillMainBundle/Resources/views/Entity/address.html.twig
+++ b/src/Bundle/ChillMainBundle/Resources/views/Entity/address.html.twig
@@ -10,6 +10,7 @@
     * has_no_address    bool
     * multiline         bool    multiline display
     * extended_infos    bool    add extra informations (step, floor, etc.) DEPRECATED
+    * details_button    bool    add an address details button
 
 #}
 
@@ -79,7 +80,12 @@
             <i class="fa fa-fw fa-map-marker"></i>
         {% endif %}
         {{ _self.inline(address, options, streetLine, lines) }}
-        <span data-address-details="1" data-address-id="{{ address.id|escape('html_attr') }}" data-address-ref-status="{{ address.refStatus|escape('html_attr') }}"></span>
+        {% if options['details_button'] is defined and options['details_button'] == true  %}
+            <span data-address-details="1"
+                data-address-id="{{ address.id|escape('html_attr') }}"
+                data-address-ref-status="{{ address.refStatus|escape('html_attr') }}">
+            </span>
+        {% endif %}
     </span>
 {%- endif -%}
 
@@ -112,7 +118,12 @@
                     <i class="fa fa-fw fa-map-marker"></i>
                 {% endif %}
                 {{ _self.raw(lines) }}
-                <p><span data-address-details="1" data-address-id="{{ address.id|escape('html_attr') }}" data-address-ref-status="{{ address.refStatus|escape('html_attr') }}"></span></p>
+                {% if options['details_button'] is defined and options['details_button'] == true  %}<p class="mt-3">
+                    <span data-address-details="1"
+                        data-address-id="{{ address.id|escape('html_attr') }}"
+                        data-address-ref-status="{{ address.refStatus|escape('html_attr') }}">
+                    </span></p>
+                {% endif %}
             </div>
         {% endif %}
         {{ _self.validity(address, options) }}
diff --git a/src/Bundle/ChillPersonBundle/Resources/views/Household/banner.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/Household/banner.html.twig
index 50822794c..ce9105795 100644
--- a/src/Bundle/ChillPersonBundle/Resources/views/Household/banner.html.twig
+++ b/src/Bundle/ChillPersonBundle/Resources/views/Household/banner.html.twig
@@ -58,7 +58,8 @@
                     {% else %}
                         <span class=" d-block d-sm-inline-block">
                             {{ 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,
+                                'details_button': false
                             }) }}
                         </span>
                     {% endif %}
diff --git a/src/Bundle/ChillPersonBundle/Resources/views/Household/summary.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/Household/summary.html.twig
index bdf06c0bd..4f4a0841d 100644
--- a/src/Bundle/ChillPersonBundle/Resources/views/Household/summary.html.twig
+++ b/src/Bundle/ChillPersonBundle/Resources/views/Household/summary.html.twig
@@ -23,7 +23,11 @@
             {% if address is empty %}
                 <p class="chill-no-data-statement">{{ 'household.Household does not have any address currently'|trans }}</p>
             {% else %}
-                {{ address|chill_entity_render_box({'multiline': true, 'extended_infos': true }) }}
+                {{ address|chill_entity_render_box({
+                    'multiline': true,
+                    'extended_infos': true,
+                    'details_button': true
+                }) }}
             {% endif %}
 
             <ul class="list-inline text-right mt-2">
diff --git a/src/Bundle/ChillPersonBundle/Resources/views/Person/banner.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/Person/banner.html.twig
index 2df130506..18f49a623 100644
--- a/src/Bundle/ChillPersonBundle/Resources/views/Person/banner.html.twig
+++ b/src/Bundle/ChillPersonBundle/Resources/views/Person/banner.html.twig
@@ -55,7 +55,8 @@
                         <span class="col-md-auto address">
                             {%- if address is not null -%}
                                 {{ 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,
+                                    'details_button': false
                                 }) }}
                             {%- endif -%}
                             {% if person.getCurrentHousehold is not null %}