From 6ff0a7f0215de1acd0490020b53485c45550df79 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 24 Apr 2024 15:58:26 +0300
Subject: refactor sizesetting into unitsetting allowing more unit types with
 i18n support

---
 .../settings_modal/helpers/unit_setting.vue        | 61 ++++++++++++++++++++++
 1 file changed, 61 insertions(+)
 create mode 100644 src/components/settings_modal/helpers/unit_setting.vue

(limited to 'src/components/settings_modal/helpers/unit_setting.vue')

diff --git a/src/components/settings_modal/helpers/unit_setting.vue b/src/components/settings_modal/helpers/unit_setting.vue
new file mode 100644
index 00000000..d6aafe26
--- /dev/null
+++ b/src/components/settings_modal/helpers/unit_setting.vue
@@ -0,0 +1,61 @@
+<template>
+  <span
+    v-if="matchesExpertLevel"
+    class="UnitSetting"
+  >
+    <label
+      :for="path"
+      class="size-label"
+    >
+      <slot />
+    </label>
+    <input
+      :id="path"
+      class="number-input"
+      type="number"
+      step="1"
+      :disabled="disabled"
+      :min="min || 0"
+      :value="stateValue"
+      @change="updateValue"
+    >
+    <Select
+      :id="path"
+      :model-value="stateUnit"
+      :disabled="disabled"
+      class="unit-input unstyled"
+      @change="updateUnit"
+    >
+      <option
+        v-for="option in units"
+        :key="option"
+        :value="option"
+      >
+        {{ getUnitString(option) }}
+      </option>
+    </Select>
+    {{ ' ' }}
+    <ModifiedIndicator
+      :changed="isChanged"
+      :onclick="reset"
+    />
+  </span>
+</template>
+
+<script src="./unit_setting.js"></script>
+
+<style lang="scss">
+.UnitSetting {
+  .number-input {
+    max-width: 6.5em;
+    text-align: right;
+  }
+
+  .unit-input,
+  .unit-input select {
+    min-width: 4em;
+    width: auto;
+  }
+}
+
+</style>
-- 
cgit v1.2.3-70-g09d2

