From 25e621a06e0ae66cc18755b367d44e207819ddd6 Mon Sep 17 00:00:00 2001
From: axolotle <nchesnais@mailoo.org>
Date: Wed, 28 Jul 2021 20:35:54 +0200
Subject: [PATCH] misc small fixes

---
 src/assets/scss/classes/_misc.scss             | 12 ++++++++++++
 .../formItems/MultipleTagsSelect.vue           |  3 ++-
 src/components/layouts/PageView.vue            |  1 -
 src/messages/fr.json                           |  4 ++--
 src/pages/Introduction.vue                     |  4 ++--
 src/pages/_partials/MainHeader.vue             | 17 ++++-------------
 src/pages/_partials/NodesHistory.vue           | 18 +++++++++++++++---
 src/pages/library/LibraryOptions.vue           |  7 ++++---
 src/store/nodes.js                             |  6 ++++++
 9 files changed, 47 insertions(+), 25 deletions(-)

diff --git a/src/assets/scss/classes/_misc.scss b/src/assets/scss/classes/_misc.scss
index 1bdf5a7..09f5bae 100644
--- a/src/assets/scss/classes/_misc.scss
+++ b/src/assets/scss/classes/_misc.scss
@@ -11,3 +11,15 @@
     pointer-events: auto;
   }
 }
+
+.collapse-icon {
+  display: inline-block;
+  transform: translate(0, 2px) rotate(270deg);
+  line-height: 0;
+  font-size: 1.2rem;
+  font-weight: 200;
+
+  &.collapsed {
+    transform: translate(3px, 2px) rotate(90deg) ;
+  }
+}
diff --git a/src/components/formItems/MultipleTagsSelect.vue b/src/components/formItems/MultipleTagsSelect.vue
index e6b7f64..8985187 100644
--- a/src/components/formItems/MultipleTagsSelect.vue
+++ b/src/components/formItems/MultipleTagsSelect.vue
@@ -7,7 +7,7 @@
     <template v-slot="{ tags, disabled, addTag, removeTag }">
       <b-dropdown
         :text="buttonText"
-        variant="outline-dark" class="tags-dropdown d-tb-block"
+        variant="outline-dark" class="tags-dropdown"
         dropright
       >
         <b-dropdown-item-button
@@ -89,6 +89,7 @@ export default {
 
     .b-form-tag {
       font-weight: $font-weight-bold;
+      text-transform: capitalize;
       padding-top: 0;
       padding-bottom: 0;
       border: $line;
diff --git a/src/components/layouts/PageView.vue b/src/components/layouts/PageView.vue
index 7cf8281..ac49ff4 100644
--- a/src/components/layouts/PageView.vue
+++ b/src/components/layouts/PageView.vue
@@ -103,7 +103,6 @@ export default {
 
   blockquote {
     margin: 0 0 50px 50px;
-    font-style: italic;
 
     @include media-breakpoint-up($size-bp) {
       margin: 50px 0 110px 180px;
diff --git a/src/messages/fr.json b/src/messages/fr.json
index af73408..08dfe38 100644
--- a/src/messages/fr.json
+++ b/src/messages/fr.json
@@ -47,8 +47,8 @@
     "read": "Voir le texte",
     "read-origin": "Voir le texte de départ",
     "read-artwork": "Voir l'œuvre",
-    "open-origin": "Texte de référence",
-    "open-artwork": "Texte de l'œuvre"
+    "open-origin": "Texte de départ",
+    "open-artwork": "Notice"
   },
   "history": "Historique de consultation",
   "from": "à partir de :",
diff --git a/src/pages/Introduction.vue b/src/pages/Introduction.vue
index 77b3ae5..0368155 100644
--- a/src/pages/Introduction.vue
+++ b/src/pages/Introduction.vue
@@ -80,10 +80,10 @@ export default {
 
   .page-intro {
     font-family: $font-family-text;
-    font-size: 3rem;
+    font-size: 2rem;
 
     @include media-breakpoint-up($size-bp) {
-      font-size: 5rem;
+      font-size: 3rem;
     }
   }
 }
diff --git a/src/pages/_partials/MainHeader.vue b/src/pages/_partials/MainHeader.vue
index e8d6cfd..390b49c 100644
--- a/src/pages/_partials/MainHeader.vue
+++ b/src/pages/_partials/MainHeader.vue
@@ -46,7 +46,7 @@
         @click="optionsVisible = !optionsVisible"
         variant="outline-dark"
       >
-        Options <span class="collapse-icon" :class="optionsVisible ? null : 'collapsed'">></span>
+        Options <span class="collapse-icon" :class="{ collapsed: !optionsVisible }">></span>
       </b-button>
     </b-navbar>
 
@@ -178,6 +178,9 @@ export default {
   }
 
   .nav-list {
+    margin-left: auto;
+    margin-right: 1rem;
+
     ul {
       display: flex;
       padding: 0;
@@ -232,18 +235,6 @@ export default {
   }
 }
 
-.collapse-icon {
-  display: inline-block;
-  transform: translate(0, 2px) rotate(270deg);
-  line-height: 0;
-  font-size: 1.2rem;
-  font-weight: 200;
-
-  &.collapsed {
-    transform: translate(3px, 2px) rotate(90deg) ;
-  }
-}
-
 // #collapse-options {
 //   @include media-breakpoint-down(sm) {
 //     position: absolute;
diff --git a/src/pages/_partials/NodesHistory.vue b/src/pages/_partials/NodesHistory.vue
index 654d581..3ccd51c 100644
--- a/src/pages/_partials/NodesHistory.vue
+++ b/src/pages/_partials/NodesHistory.vue
@@ -1,13 +1,18 @@
 <template>
   <footer class="nodes-history no-events-container" v-if="history.length">
     <b-dropdown
-      :text="$t('history')"
       variant="outline-dark"
-      dropup no-flip
+      dropup no-flip no-caret
       boundary="main"
       class="no-events-container"
       @shown="scrollToEnd"
+      @hide="shown = false"
     >
+      <template #button-content>
+        <span class="collapse-icon" :class="{ collapsed: shown }">></span>
+        {{ $t('history') }}
+      </template>
+
       <b-dropdown-text class="dropdown-item-arrow left">
         <b-button variant="link" @click="onArrowClick('left')" :disabled="leftDisabled">&lt;</b-button>
       </b-dropdown-text>
@@ -55,7 +60,8 @@ export default {
   data () {
     return {
       leftDisabled: false,
-      rightDisabled: false
+      rightDisabled: false,
+      shown: false
     }
   },
 
@@ -78,6 +84,7 @@ export default {
       const container = this.$el.querySelector('.dropdown-menu')
       container.scrollTo({ left: container.scrollWidth })
       this.updateBtnDir()
+      this.shown = true
     },
 
     onArrowClick (dir) {
@@ -224,5 +231,10 @@ export default {
     width: 100%;
     height: 100%;
   }
+
+  .collapse-icon {
+    margin-right: .25rem;
+    font-weight: 700;
+  }
 }
 </style>
diff --git a/src/pages/library/LibraryOptions.vue b/src/pages/library/LibraryOptions.vue
index 3c87f5d..f46f778 100644
--- a/src/pages/library/LibraryOptions.vue
+++ b/src/pages/library/LibraryOptions.vue
@@ -61,7 +61,7 @@
         />
       </div>
 
-      <div class="filters-mini-group">
+      <div class="filters-mini-group align-items-center">
         <b-form-checkbox
           v-model="strangenessIsActive" name="tags-button"
           button class="toggle-btn"
@@ -277,8 +277,9 @@ export default {
     .filters-group {
       flex-grow: 2;
 
-      @include media-breakpoint-up($layout-bp) {
-        max-width: 450px;
+      @include media-breakpoint-up($size-bp) {
+        padding: 0 2rem;
+        max-width: 40%;
       }
 
       .filters-mini-group {
diff --git a/src/store/nodes.js b/src/store/nodes.js
index 26ff77c..0de2915 100644
--- a/src/store/nodes.js
+++ b/src/store/nodes.js
@@ -69,6 +69,12 @@ export default {
           node.type = node.type === 'Textref' ? 'ref' : 'prod'
         }
 
+        if (node.tags) {
+          node.tags = node.tags.map(tag => {
+            return { ...tag, name: tag.name[0].toUpperCase() + tag.name.slice(1) }
+          })
+        }
+
         for (const relation of RELATIONS) {
           if (relation in node && node[relation]) {
             node[relation] = node[relation].map(subNode => {