From c7ffb7062a20ea5b237045307de7fca4b08a73c6 Mon Sep 17 00:00:00 2001
From: Mathieu Jaumotte <mathieu.jaumotte@champs-libres.coop>
Date: Thu, 18 Nov 2021 11:26:26 +0100
Subject: [PATCH] improve resume course styles

---
 .../Activity/activity-badge-title.html.twig   | 10 ++++----
 .../Resources/public/chill/chillmain.scss     |  8 +++++++
 .../Resources/public/chill/scss/badge.scss    | 10 ++++++++
 .../Resources/public/chill/scss/mixins.scss   |  2 +-
 .../AccompanyingCourse/components/Banner.vue  |  2 +-
 ...st_recent_by_accompanying_period.html.twig | 23 ++++++++++++++-----
 6 files changed, 43 insertions(+), 12 deletions(-)

diff --git a/src/Bundle/ChillActivityBundle/Resources/views/Activity/activity-badge-title.html.twig b/src/Bundle/ChillActivityBundle/Resources/views/Activity/activity-badge-title.html.twig
index 1e1d65d91..f4a3d4d29 100644
--- a/src/Bundle/ChillActivityBundle/Resources/views/Activity/activity-badge-title.html.twig
+++ b/src/Bundle/ChillActivityBundle/Resources/views/Activity/activity-badge-title.html.twig
@@ -27,14 +27,16 @@
         {{ activity.type.name | localize_translatable_string }}
 
         <ul class="small_in_title">
+            {% if activity.location and t.locationVisible %}
             <li>
-                <abbr title="{{ 'location'|trans }}">{{ 'location'|trans ~ ': ' }}</abbr>
-                {# TODO {% if activity.location %}{{ activity.location }}{% endif %} #}
-                Domicile de l'usager
+                <span class="item-key">{{ 'location'|trans ~ ': ' }}</span>
+                <span>{{ activity.location.locationType.title|localize_translatable_string }}</span>
+                {{ activity.location.name }}
             </li>
+            {% endif %}
             {% if activity.user and t.userVisible %}
                 <li>
-                    <abbr title="{{ 'Referrer'|trans }}">{{ 'Referrer'|trans ~ ': ' }}</abbr>
+                    <span class="item-key">{{ 'Referrer'|trans ~ ': ' }}</span>
                     {{ activity.user.usernameCanonical }}
                 </li>
             {% endif %}
diff --git a/src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss b/src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss
index 593cd49b4..53a9d200b 100644
--- a/src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss
+++ b/src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss
@@ -402,3 +402,11 @@ input.belgian_national_number {
    &.daily_counter {}
    &.control_digit {}
 }
+
+// replace abbr
+span.item-key {
+    font-variant: all-small-caps;
+    font-size: 90%;
+    background-color: #0000000a;
+    //text-decoration: dotted underline;
+}
diff --git a/src/Bundle/ChillPersonBundle/Resources/public/chill/scss/badge.scss b/src/Bundle/ChillPersonBundle/Resources/public/chill/scss/badge.scss
index 7e9f13149..7dcddf65d 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/chill/scss/badge.scss
+++ b/src/Bundle/ChillPersonBundle/Resources/public/chill/scss/badge.scss
@@ -60,6 +60,16 @@ h2.badge-title {
         h3 {
             margin-bottom: 0.5rem;
         }
+
+        //position: relative;
+        span {
+            display: none;
+            //position: absolute;
+            //top: 0;
+            //left: 0;
+            //transform: rotate(270deg);
+            //transform-origin: 0 0;
+        }
     }
     span.title_action {
         flex-grow: 1;
diff --git a/src/Bundle/ChillPersonBundle/Resources/public/chill/scss/mixins.scss b/src/Bundle/ChillPersonBundle/Resources/public/chill/scss/mixins.scss
index e995f97eb..878ff82e1 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/chill/scss/mixins.scss
+++ b/src/Bundle/ChillPersonBundle/Resources/public/chill/scss/mixins.scss
@@ -4,7 +4,7 @@
 ///
 
 @mixin chill_badge($color) {
-    text-transform: capitalize !important;
+    //text-transform: capitalize !important;
     font-weight: 500 !important;
     border-left: 20px groove $color;
     &:before {
diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Banner.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Banner.vue
index 84e7fb2c6..801e83068 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Banner.vue
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Banner.vue
@@ -22,7 +22,7 @@
                <i>{{ $t('course.open_at') }}{{ $d(accompanyingCourse.openingDate.datetime, 'text') }}</i>
             </span>
             <span v-if="accompanyingCourse.user" class="d-md-block ms-3 ms-md-0">
-               <abbr :title="$t('course.referrer')">{{ $t('course.referrer') }}:</abbr> <b>{{ accompanyingCourse.user.username }}</b>
+               <span class="item-key">{{ $t('course.referrer') }}:</span> <b>{{ accompanyingCourse.user.username }}</b>
             </span>
          </span>
       </span>
diff --git a/src/Bundle/ChillPersonBundle/Resources/views/AccompanyingCourseWork/list_recent_by_accompanying_period.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/AccompanyingCourseWork/list_recent_by_accompanying_period.html.twig
index 979488ff3..ec782615a 100644
--- a/src/Bundle/ChillPersonBundle/Resources/views/AccompanyingCourseWork/list_recent_by_accompanying_period.html.twig
+++ b/src/Bundle/ChillPersonBundle/Resources/views/AccompanyingCourseWork/list_recent_by_accompanying_period.html.twig
@@ -3,20 +3,31 @@
         <a href="{{ chill_path_add_return_path('chill_person_accompanying_period_work_edit', { 'id': w.id }) }}"></a>
 
         <h2 class="badge-title">
-            <span class="title_label">{{ 'accompanying_course_work.action'|trans }}</span>
-            <span class="title_action">{{ w.socialAction|chill_entity_render_string }}
+            <span class="title_label">
+                <span>{{ 'accompanying_course_work.action'|trans }}</span>
+            </span>
+            <span class="title_action">
+                {{ w.socialAction|chill_entity_render_string }}
 
                 <ul class="small_in_title">
                     <li>
-                        <abbr title="{{ 'accompanying_course_work.start_date'|trans }}">{{ 'accompanying_course_work.start_date'|trans ~ ' : ' }}</abbr>
-                        {{ w.startDate|format_date('short') }}
+                        <span class="item-key">{{ 'accompanying_course_work.start_date'|trans ~ ' : ' }}</span>
+                        <b>{{ w.startDate|format_date('short') }}</b>
                     </li>
+                    {% if w.endDate %}
                     <li>
-                        <abbr title="{{ 'Last updated by'|trans }}">{{ 'Last updated by'|trans ~ ' : ' }}</abbr>
-                        {{ w.updatedBy|chill_entity_render_box }}, {{ w.updatedAt|format_datetime('short', 'short') }}
+                        <span class="item-key">{{ 'accompanying_course_work.end_date'|trans ~ ' : ' }}</span>
+                        <b>{{ w.endDate|format_date('short') }}</b>
                     </li>
+                    {% endif %}
                 </ul>
 
+                <div class="metadata text-end" style="font-size: 60%">
+                    {{ 'Last updated by'|trans }}
+                    <span class="user">{{ w.updatedBy|chill_entity_render_box }}</span>:
+                    <span class="date">{{ w.updatedAt|format_datetime('short', 'short') }}</span>
+                </div>
+
             </span>
         </h2>
     {% endfor %}