From 5c4602b06923fb3e2871331558d4c108f6e7179a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Cl=C3=A9ment=20Delafontaine?=
 <clment.delafontaine@gmail.com>
Date: Tue, 1 Oct 2024 10:29:13 +0200
Subject: [PATCH] =?UTF-8?q?THE-1346=20placement=20des=20s=C3=A9lecteurs=20?=
 =?UTF-8?q?dans=20le=20header?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/common/HeaderCustom.vue | 35 ++++++++++++++++--------------
 components/common/HeaderMobile.vue | 20 ++++++++---------
 components/common/Keywords.vue     |  2 +-
 locales/fr.json                    |  3 ++-
 4 files changed, 31 insertions(+), 29 deletions(-)

diff --git a/components/common/HeaderCustom.vue b/components/common/HeaderCustom.vue
index 07af97f..4274bdf 100644
--- a/components/common/HeaderCustom.vue
+++ b/components/common/HeaderCustom.vue
@@ -2,25 +2,22 @@
   <v-app-bar flat id="appBar" v-if="!mobile && isReady">
     <div class="toolbar-wrapper" role="list">
       <div class="text-center text-md-left language-accessibility-toolbar" role="listitem">
-
         <v-btn plain size="x-large" @click="dialog = true" :title="$t('access.btn')" role="button">
           <img :alt="$t('header.accessibility')" id="logo-handicap-visuel"
             :src="'/icone-handicap-visuel-' + colorMode + '.svg'" />
         </v-btn>
-  <!--     Quand actif ajouter role="listitem" -->
-<!--        <div class="languages-btn">-->
-<!--          &lt;!&ndash; selecteur de langues désactivé &ndash;&gt;-->
-<!--          <v-btn flat @click="setLanguage('fr')" title="Langue française"-->
-<!--            :class="locale === 'fr' ? 'selected' : ''">FR</v-btn>-->
-<!--          |-->
-<!--          <v-btn flat @click="setLanguage('en')" title="English Language"-->
-<!--            :class="locale === 'en' ? 'selected' : ''">EN</v-btn>-->
-<!--          |-->
-<!--          <v-btn flat @click="setLanguage('es')" title="Idioma espanol"-->
-<!--            :class="locale === 'es' ? 'selected' : ''">ES</v-btn>-->
-<!--        </div>-->
+        <div class="languages-btn" role="list" :aria-label="$t('header.localeSelection')">
+          <v-btn flat @click="setLanguage('fr')" aria-label="Changer la langue du site en français"
+          :class="locale === 'fr' ? 'selected' : ''">FR</v-btn>
+          <v-divider vertical role="presentation"></v-divider>
+          <v-btn flat @click="setLanguage('en')" aria-label="Switch language to English"
+            :class="locale === 'en' ? 'selected' : ''">EN</v-btn>
+          <v-divider vertical role="presentation"></v-divider>
+          <v-btn flat @click="setLanguage('es')" aria-label="Cambiar el idioma a español"
+            :class="locale === 'es' ? 'selected' : ''">ES</v-btn>
+        </div>
       </div>
-      <div class="text-center text-md-right" role="presentation">
+      <div class="text-center text-md-right" role="list">
         <!--<v-btn tabindex="-1" title="Réseau" size="x-large" icon>
           <div class="icons"><icons-icon-reseau></icons-icon-reseau></div>
         </v-btn>
@@ -175,7 +172,7 @@ header {
 }
 
 .language-accessibility-toolbar {
-  display: grid; // dé-commenter si on active le bouton accessibilité
+  display: grid;
   grid-template-columns: 1fr 20px 3fr;
   margin: 0 30px 0;
 
@@ -185,9 +182,10 @@ header {
 }
 
 .languages-btn {
-  grid-column-start: 3; // 3 si on active le bouton accessibilité
+  grid-column-start: 3;
   max-height: 36px;
   align-self: center;
+  display: inline-flex;
 
   @media #{ map-get(settings.$display-breakpoints, 'md-and-down')} {
     grid-column-start: 2;
@@ -197,6 +195,11 @@ header {
       padding: 0 5px;
     }
   }
+
+  .v-divider {
+    height: 1.5em;
+    align-self: center;
+  }
 }
 
 .logos-droite {
diff --git a/components/common/HeaderMobile.vue b/components/common/HeaderMobile.vue
index 0330081..770ce77 100644
--- a/components/common/HeaderMobile.vue
+++ b/components/common/HeaderMobile.vue
@@ -47,17 +47,15 @@
     <!-- Menu burger mobile -->
     <v-fade-transition>
       <div v-show="showMenu" ref="expandedMenu" tabindex="0" class="expanded-search-bar-container white-containers" role="list">
-        <div class="languages-btn-container">
-<!--          <div class="languages-btn">-->
-<!--            <button flat @click="setLanguage('fr')" title="Langue française"-->
-<!--              :class="locale === 'fr' ? 'selected' : ''">FR</button>-->
-<!--            <p>|</p>-->
-<!--            <button flat @click="setLanguage('en')" title="English Language"-->
-<!--              :class="locale === 'en' ? 'selected' : ''">EN</button>-->
-<!--            <p>|</p>-->
-<!--            <button flat @click="setLanguage('es')" title="Idioma Espanol"-->
-<!--              :class="locale === 'es' ? 'selected' : ''">ES</button>-->
-<!--          </div>-->
+        <div class="languages-btn-container" role="list" :aria-label="$t('header.localeSelection')">
+          <v-btn flat @click="setLanguage('fr')" aria-label="Changer la langue du site en français"
+                 :class="locale === 'fr' ? 'selected' : ''">FR</v-btn>
+          <v-divider vertical role="presentation"></v-divider>
+          <v-btn flat @click="setLanguage('en')" aria-label="Switch language to English"
+                 :class="locale === 'en' ? 'selected' : ''">EN</v-btn>
+          <v-divider vertical role="presentation"></v-divider>
+          <v-btn flat @click="setLanguage('es')" aria-label="Cambiar el idioma a español"
+                 :class="locale === 'es' ? 'selected' : ''">ES</v-btn>
         </div>
         <div class="expanded-burger-menu">
           <div class="nav-bar-list-burger">
diff --git a/components/common/Keywords.vue b/components/common/Keywords.vue
index 16c6354..b8f15e8 100644
--- a/components/common/Keywords.vue
+++ b/components/common/Keywords.vue
@@ -60,7 +60,7 @@
         <div role="list" aria-labelledby="keywords-title" v-if="mixedKeywords.length > 0" class="chip-lines v-chip-group" :class="isRtl ? 'rtl-text' : ''">
           <template v-for="keyWord in mixedKeywords" :key="keyWord.keyword + forceRenderKey" :title="keyWord.keyword">
             <nuxt-link role="listitem"
-              :to="{ name: 'resultats', query: { q: keyWord.query ? keyWord.query : keyWord.keyword, domaine: 'theses' } }">
+              :to="{ name: 'resultats', query: { q: keyWord.query ? keyWord.query  : keyWord.keyword, domaine: 'theses', avancee: true } }">
               <v-chip label class="chips" :class="keyWord.type === 'sujetsRameau' ? 'rameau-chip' : 'free-chip'"
                 tabindex="-1">
                 <span class="key-word-label">{{ keyWord.keyword }}</span>
diff --git a/locales/fr.json b/locales/fr.json
index 8659980..dd0411a 100644
--- a/locales/fr.json
+++ b/locales/fr.json
@@ -229,7 +229,8 @@
   "header": {
     "doc": "Accéder à la documentation de theses.fr ",
     "assistance": "Accéder au guichet d’assistance de l'Abes",
-    "accessibility": "Outils d'accessibilité"
+    "accessibility": "Outils d'accessibilité",
+    "localeSelection": "Sélection de la langue du site"
   },
   "meta": {
     "desc": "Moteur de recherche des thèses françaises, theses.fr propose l’accès aux thèses de doctorat soutenues ou en préparation.",