migrate admin settings

src/components/settings/form/FormRange.vue

@@ -0,0 +1,56 @@
+<template>
+  <div>
+    <em v-if="prepend">{{ t('side_menu', prepend) }}</em>
+
+    <input
+      type="range"
+      :min="min"
+      :max="max"
+      v-model="model"
+    />
+
+    <em v-if="append">{{ t('side_menu', append) }}</em>
+  </div>
+</template>
+
+<style scoped>
+input {
+  min-height: auto;
+}
+
+div * {
+  vertical-align: middle;
+}
+
+em + input,
+input + em {
+  margin-left: 10px;
+}
+</style>
+
+<script setup>
+const model = defineModel()
+
+const { prefix, suffix } = defineProps({
+  prepend: {
+    type: [String, null],
+    required: false,
+    default: null,
+  },
+  append: {
+    type: [String, null],
+    required: false,
+    default: null,
+  },
+  min: {
+    type: Number,
+    required: false,
+    default: 0,
+  },
+  max: {
+    type: Number,
+    required: false,
+    default: 100,
+  },
+})
+</script>