From fc8592206feb89106ba5993ee33fc1310f09e949 Mon Sep 17 00:00:00 2001
From: Michael Mayer <michael@lastzero.net>
Date: Mon, 21 Dec 2020 16:03:33 +0100
Subject: [PATCH] Settings: Improve layout of image render options

---
 frontend/src/locales/translations.pot    | 16 +++---
 frontend/src/pages/settings/advanced.vue | 65 ++++++++++++------------
 2 files changed, 41 insertions(+), 40 deletions(-)

diff --git a/frontend/src/locales/translations.pot b/frontend/src/locales/translations.pot
index 96e630c4f..748983f73 100644
--- a/frontend/src/locales/translations.pot
+++ b/frontend/src/locales/translations.pot
@@ -652,7 +652,7 @@ msgstr ""
 msgid "Disables reverse geocoding and maps."
 msgstr ""
 
-#: src/pages/settings/advanced.vue:464
+#: src/pages/settings/advanced.vue:463
 msgid "Disables simultaneous conversion of RAW files to apply Darktable presets."
 msgstr ""
 
@@ -739,15 +739,15 @@ msgstr ""
 msgid "Dutch"
 msgstr ""
 
-#: src/pages/settings/advanced.vue:331
+#: src/pages/settings/advanced.vue:304
 msgid "Dynamic Previews"
 msgstr ""
 
-#: src/pages/settings/advanced.vue:332
+#: src/pages/settings/advanced.vue:305
 msgid "Dynamic rendering requires a powerful server. It is not recommended for NAS devices."
 msgstr ""
 
-#: src/pages/settings/advanced.vue:300
+#: src/pages/settings/advanced.vue:347
 msgid "Dynamic Size Limit: %{n}px"
 msgstr ""
 
@@ -1067,11 +1067,11 @@ msgstr ""
 msgid "Item"
 msgstr ""
 
-#: src/pages/settings/advanced.vue:376
+#: src/pages/settings/advanced.vue:322
 msgid "JPEG Quality: %{n}"
 msgstr ""
 
-#: src/pages/settings/advanced.vue:429
+#: src/pages/settings/advanced.vue:428
 msgid "JPEG Size Limit: %{n}px"
 msgstr ""
 
@@ -1985,7 +1985,7 @@ msgstr ""
 msgid "States"
 msgstr ""
 
-#: src/pages/settings/advanced.vue:349
+#: src/pages/settings/advanced.vue:373
 msgid "Static Size Limit: %{n}px"
 msgstr ""
 
@@ -2226,7 +2226,7 @@ msgstr ""
 msgid "URL"
 msgstr ""
 
-#: src/pages/settings/advanced.vue:463
+#: src/pages/settings/advanced.vue:462
 msgid "Use Presets"
 msgstr ""
 
diff --git a/frontend/src/pages/settings/advanced.vue b/frontend/src/pages/settings/advanced.vue
index 2271ea08a..919641721 100644
--- a/frontend/src/pages/settings/advanced.vue
+++ b/frontend/src/pages/settings/advanced.vue
@@ -155,22 +155,6 @@
               ></v-select>
             </v-flex>
 
-            <v-flex xs12 sm6 lg8 class="px-2 pb-2">
-              <v-subheader class="pa-0">
-                {{ $gettextInterpolate($gettext('Dynamic Size Limit: %{n}px'), {n: settings.ThumbSizeUncached}) }}
-              </v-subheader>
-              <v-slider
-                  v-model="settings.ThumbSizeUncached"
-                  :min="720"
-                  :max="7680"
-                  :step="4"
-                  hide-details
-                  :disabled="busy"
-                  class="mt-0"
-                  @change="onChange"
-              ></v-slider>
-            </v-flex>
-
             <v-flex xs12 sm6 lg4 class="px-2 pb-2 pt-2">
               <v-checkbox
                   v-model="settings.ThumbUncached"
@@ -187,22 +171,6 @@
             </v-flex>
 
             <v-flex xs12 sm6 lg8 class="px-2 pb-2">
-              <v-subheader class="pa-0">
-                {{ $gettextInterpolate($gettext('Static Size Limit: %{n}px'), {n: settings.ThumbSize}) }}
-              </v-subheader>
-              <v-slider
-                  v-model="settings.ThumbSize"
-                  :min="720"
-                  :max="7680"
-                  :step="4"
-                  hide-details
-                  :disabled="busy"
-                  class="mt-0"
-                  @change="onChange"
-              ></v-slider>
-            </v-flex>
-
-            <v-flex xs12 sm6 lg4 class="px-2 pb-2">
               <v-subheader class="pa-0">
                 {{ $gettextInterpolate($gettext('JPEG Quality: %{n}'), {n: settings.JpegQuality}) }}
               </v-subheader>
@@ -211,6 +179,39 @@
                   :min="25"
                   :max="100"
                   :disabled="busy"
+                  hide-details
+                  class="mt-0"
+                  @change="onChange"
+              ></v-slider>
+            </v-flex>
+
+            <v-flex xs12 sm6 class="px-2 pb-2">
+              <v-subheader class="pa-0">
+                {{ $gettextInterpolate($gettext('Dynamic Size Limit: %{n}px'), {n: settings.ThumbSizeUncached}) }}
+              </v-subheader>
+              <v-slider
+                  v-model="settings.ThumbSizeUncached"
+                  :min="720"
+                  :max="7680"
+                  :step="4"
+                  :disabled="busy"
+                  hide-details
+                  class="mt-0"
+                  @change="onChange"
+              ></v-slider>
+            </v-flex>
+
+            <v-flex xs12 sm6 class="px-2 pb-2">
+              <v-subheader class="pa-0">
+                {{ $gettextInterpolate($gettext('Static Size Limit: %{n}px'), {n: settings.ThumbSize}) }}
+              </v-subheader>
+              <v-slider
+                  v-model="settings.ThumbSize"
+                  :min="720"
+                  :max="7680"
+                  :step="4"
+                  :disabled="busy"
+                  hide-details
                   class="mt-0"
                   @change="onChange"
               ></v-slider>