client/src/components/Language.vue

   1 <template lang="pug">
   2 div
   3   -
   4     var langName = {
   5       "en": "English",
   6       "es": "Español",
   7       "fr": "Français",
   8     };
   9   input#modalLang.modal(type="checkbox")
  10   div(role="dialog")
  11     #language.card
  12       label.modal-close(for="modalLang")
  13       form
  14         fieldset
  15           label(for="langSelect") {{ $tr["Language"] }}
  16           select#langSelect
  17             each language,langCode in langName
  18               option(value=langCode selected=(lang==langCode))
  19                 =language
  20 </template>
  21
  22 <script>
  23 export default {
  24   name: "Language",
  25     methods: {
  26     // Used both on index and variant page, to switch language
  27     setLanguage: function(e) {
  28       localStorage["lang"] = e.target.value;
  29       this.$lang = e.target.value;
  30     },
  31     },
  32 };
  33 </script>