Language selector match styles with other links in the footer

package-lock.json

@@ -3260,7 +3260,8 @@
       "version": "4.6.0",
       "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
       "integrity": "sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ=",
-      "dev": true
+      "dev": true,
+      "optional": true
     },
     "coa": {
       "version": "2.0.2",
@@ -9030,7 +9031,8 @@
       "version": "2.2.2",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.2.2.tgz",
       "integrity": "sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg==",
-      "dev": true
+      "dev": true,
+      "optional": true
     },
     "pify": {
       "version": "4.0.1",
@@ -10565,7 +10567,8 @@
       "version": "4.0.8",
       "resolved": "https://registry.npmjs.org/rx-lite/-/rx-lite-4.0.8.tgz",
       "integrity": "sha1-Cx4Rr4vESDbwSmQH6S2kJGe3lEQ=",
-      "dev": true
+      "dev": true,
+      "optional": true
     },
     "rx-lite-aggregates": {
       "version": "4.0.8",

src/components/LanguageSwitcher.vue

@@ -1,8 +1,10 @@
 <template>
-    <b-dropdown v-if="selectedLang" variant="link" size="sm" no-caret right>
+    <b-dropdown v-if="selectedLang" variant="link" size="sm" right no-caret custom-class="text-secondary">
         <template slot="button-content">
-            {{ selectedLang.code }}
-            <i class="material-icons">keyboard_arrow_down</i>
+            <span class="text-secondary">
+                <span class="text-uppercase">{{ selectedLang.code }}</span>
+                <i class="material-icons md-18">expand_more</i>
+            </span>
         </template>
         <template v-for="lang in languages" >
             <b-dropdown-item-button @click="langChanged(lang)" :key="lang.code">{{ lang.name }}</b-dropdown-item-button>

src/components/TheFooter.vue

@@ -1,12 +1,14 @@
 <template>
     <footer class="col-12 d-flex justify-content-between align-items-center text-secondary px-0 mt-3 d-print-none">
-        <button class="btn btn-sm text-secondary" @click="toggleTheme">
-            {{ theme === 'dark' ? $t('lights-on') : $t('lights-off') }}
-            <i class="material-icons material-icons-round md-14 align-text-bottom ml-1">
-                {{ theme === 'dark' ? 'wb_sunny' : 'brightness_2' }}
-            </i>
-        </button>
-        <LanguageSwitcher/>
+        <div>
+            <LanguageSwitcher/>
+            <button class="btn btn-sm text-secondary" @click="toggleTheme">
+                {{ theme === 'dark' ? $t('lights-on') : $t('lights-off') }}
+                <i class="material-icons material-icons-round md-14 align-text-bottom ml-1">
+                    {{ theme === 'dark' ? 'wb_sunny' : 'brightness_2' }}
+                </i>
+            </button>
+        </div>
         <div>
             <small v-b-tooltip.hover
                    :title="$t('title')"