add strangeness range input in LibraryOptions

src/components/formItems/MultipleTagsSelect.vue

@@ -6,7 +6,7 @@
   >
     <template v-slot="{ tags, disabled, addTag, removeTag }">
       <b-dropdown
-        :text="$t('tags')" size="sm"
+        :text="buttonText" size="sm"
         variant="outline-secondary" class="d-block rounded-0"
       >
         <b-dropdown-item-button
@@ -37,7 +37,8 @@ export default {
 
   props: {
     value: { type: Array, required: true },
-    options: { type: Array, required: true }
+    options: { type: Array, required: true },
+    buttonText: { type: String, required: true }
   },
 
   computed: {

src/messages/fr.json

@@ -29,6 +29,5 @@
       "title": "Rechercher"
     }
   },
-  "siblings": "Textes rebonds",
-  "tags": "Tags"
+  "siblings": "Textes rebonds"
 }

src/pages/library/LibraryOptions.vue

@@ -15,9 +15,27 @@
     <b-form-group
       v-if="currentMode !== 'tree-map'"
       :label="$t('options.filters.title')"
-      label-for="tags-select"
     >
-      <multiple-tags-select id="tags-select" v-model="selectedTags" :options="tags" />
+      <b-form-group
+        :label="$t('options.filters.choices.tags')"
+        label-for="tags-select"
+      >
+        <multiple-tags-select
+          id="tags-select" :button-text="$t('options.filters.choices.tags')"
+          v-model="selectedTags" :options="tags"
+        />
+      </b-form-group>
+
+      <b-form-group
+        :label="$t('options.filters.choices.strangeness')"
+        label-for="strangeness-input"
+      >
+        <b-form-input
+          id="strangeness-input"
+          type="range" min="0" max="5"
+          v-model="strangeness"
+        />
+      </b-form-group>
     </b-form-group>
 
     <b-form-group
@@ -56,6 +74,7 @@ export default {
       ],
       currentMode: this.mode,
       selectedTags: [],
+      strangeness: 0,
       search: ''
     }
   },
@@ -69,4 +88,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+::v-deep fieldset > div {
+  display: flex;
+}
 </style>