refactor(ui): better select popovers

components/smart/ChangeLanguage.vue

@@ -15,6 +15,7 @@
             :title="$t('settings.choose_language')"
             class="pr-8"
             outline
+            icon="language"
             :label="`${
               $i18n.locales.find(({ code }) => code == $i18n.locale).name
             }`"

components/smart/FontSizePicker.vue

@@ -14,6 +14,7 @@
             v-tippy="{ theme: 'tooltip' }"
             :title="$t('settings.change_font_size')"
             class="pr-8"
+            icon="format_size"
             outline
             :label="`${fontSizes.find(({ code }) => code == active.code).name}`"
           />
@@ -22,6 +23,7 @@
           v-for="(size, index) in fontSizes"
           :key="`size-${index}`"
           :label="size.name"
+          :info-icon="size.code === active.code ? 'done' : ''"
           @click.native="
             setActiveFont(size)
             $refs.fontSize.tippy().hide()

components/smart/Item.vue

@@ -39,7 +39,10 @@
       />
     </span>
     <SmartSpinner v-else class="mr-4" />
-    <div class="inline-flex items-start" :class="{ 'flex-col': description }">
+    <div
+      class="flex-1 inline-flex items-start"
+      :class="{ 'flex-col': description }"
+    >
       <div class="font-semibold">
         {{ label }}
       </div>
@@ -47,7 +50,7 @@
         {{ description }}
       </p>
     </div>
-    <i v-if="infoIcon" class="text-accent ml-4 material-icons">
+    <i v-if="infoIcon" class="text-accent ml-6 self-end material-icons">
       {{ infoIcon }}
     </i>
   </SmartLink>