logLevel as server setting, logger config page, re-scan audiobook option, fix embedded cover extraction, flac and mobi support, fix series bookshelf not wrapping

client/components/ui/Dropdown.vue

@@ -0,0 +1,72 @@
+<template>
+  <div class="relative w-44" v-click-outside="clickOutside">
+    <p class="text-sm text-opacity-75 mb-1">{{ label }}</p>
+    <button type="button" class="relative w-full bg-fg border border-gray-500 rounded shadow-sm pl-3 pr-10 py-2 text-left focus:outline-none sm:text-sm cursor-pointer" aria-haspopup="listbox" aria-expanded="true" @click.stop.prevent="showMenu = !showMenu">
+      <span class="flex items-center">
+        <span class="block truncate">{{ selectedText }}</span>
+      </span>
+      <span class="ml-3 absolute inset-y-0 right-0 flex items-center pr-2 pointer-events-none">
+        <span class="material-icons text-gray-100">chevron_down</span>
+      </span>
+    </button>
+
+    <transition name="menu">
+      <ul v-show="showMenu" class="absolute z-10 -mt-px w-full bg-primary border border-black-200 shadow-lg max-h-56 rounded-b-md py-1 text-base ring-1 ring-black ring-opacity-5 overflow-auto focus:outline-none sm:text-sm" tabindex="-1" role="listbox" aria-activedescendant="listbox-option-3">
+        <template v-for="item in items">
+          <li :key="item.value" class="text-gray-100 select-none relative py-2 cursor-pointer hover:bg-black-400" id="listbox-option-0" role="option" @click="clickedOption(item.value)">
+            <div class="flex items-center">
+              <span class="font-normal ml-3 block truncate font-sans">{{ item.text }}</span>
+            </div>
+          </li>
+        </template>
+      </ul>
+    </transition>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    value: [String, Number],
+    label: {
+      type: String,
+      default: ''
+    },
+    items: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      showMenu: false
+    }
+  },
+  computed: {
+    selected: {
+      get() {
+        return this.value
+      },
+      set(val) {
+        this.$emit('input', val)
+      }
+    },
+    selectedItem() {
+      return this.items.find((i) => i.value === this.selected)
+    },
+    selectedText() {
+      return this.selectedItem ? this.selectedItem.text : ''
+    }
+  },
+  methods: {
+    clickOutside() {
+      this.showMenu = false
+    },
+    clickedOption(itemValue) {
+      this.selected = itemValue
+      this.showMenu = false
+    }
+  },
+  mounted() {}
+}
+</script>