From 77ba92f5e89a0e48f844109cb07a811275711c30 Mon Sep 17 00:00:00 2001
From: BrettS <brett.scott@openwb.de>
Date: Mon, 28 Jul 2025 16:19:05 +0200
Subject: [PATCH 1/3] Add button for whole cent adjustment (price limit)

---
 .../src/components/ChargePointEcoSettings.vue | 20 ++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

diff --git a/packages/modules/web_themes/koala/source/src/components/ChargePointEcoSettings.vue b/packages/modules/web_themes/koala/source/src/components/ChargePointEcoSettings.vue
index 9266169480..8a7fddd8b9 100644
--- a/packages/modules/web_themes/koala/source/src/components/ChargePointEcoSettings.vue
+++ b/packages/modules/web_themes/koala/source/src/components/ChargePointEcoSettings.vue
@@ -78,15 +78,33 @@
         v-if="maxPrice.value"
         icon="remove"
         color="grey"
-        size="sm"
+        size="xs"
+        dense
         class="col q-mr-sm"
         @click="maxPrice.value = maxPrice.value - 0.01"
       />
+      <q-btn
+        v-if="maxPrice.value"
+        icon="remove"
+        color="grey"
+        size="sm"
+        class="col q-mr-sm"
+        @click="maxPrice.value = maxPrice.value - 1"
+      />
       <q-btn
         v-if="maxPrice.value"
         icon="add"
         color="grey"
         size="sm"
+        class="col q-mr-sm"
+        @click="maxPrice.value = maxPrice.value + 1"
+      />
+      <q-btn
+        v-if="maxPrice.value"
+        icon="add"
+        color="grey"
+        size="xs"
+        dense
         class="col"
         @click="maxPrice.value = maxPrice.value + 0.01"
       />

From c26c54e768b48e8f03346355f6f3bdbe560aacf1 Mon Sep 17 00:00:00 2001
From: BrettS <brett.scott@openwb.de>
Date: Wed, 30 Jul 2025 19:18:06 +0200
Subject: [PATCH 2/3] Add buttons for whole cent and fine adjustment

---
 .../src/components/ChargePointEcoSettings.vue | 119 +++++++++++-------
 1 file changed, 74 insertions(+), 45 deletions(-)

diff --git a/packages/modules/web_themes/koala/source/src/components/ChargePointEcoSettings.vue b/packages/modules/web_themes/koala/source/src/components/ChargePointEcoSettings.vue
index 8a7fddd8b9..dac8239e14 100644
--- a/packages/modules/web_themes/koala/source/src/components/ChargePointEcoSettings.vue
+++ b/packages/modules/web_themes/koala/source/src/components/ChargePointEcoSettings.vue
@@ -69,55 +69,84 @@
     class="q-mt-md"
   />
   <div v-if="etConfigured">
-    <div class="text-subtitle2 q-mt-sm q-mr-sm">
+    <div class="text-subtitle2 q-my-sm">
       Preisgrenze für strompreisbasiertes Laden
     </div>
-    <div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
-      <!-- <q-btn-group class="col"> -->
-      <q-btn
-        v-if="maxPrice.value"
-        icon="remove"
-        color="grey"
-        size="xs"
-        dense
-        class="col q-mr-sm"
-        @click="maxPrice.value = maxPrice.value - 0.01"
-      />
-      <q-btn
-        v-if="maxPrice.value"
-        icon="remove"
-        color="grey"
-        size="sm"
-        class="col q-mr-sm"
-        @click="maxPrice.value = maxPrice.value - 1"
-      />
-      <q-btn
-        v-if="maxPrice.value"
-        icon="add"
-        color="grey"
-        size="sm"
-        class="col q-mr-sm"
-        @click="maxPrice.value = maxPrice.value + 1"
-      />
-      <q-btn
-        v-if="maxPrice.value"
-        icon="add"
-        color="grey"
-        size="xs"
-        dense
-        class="col"
-        @click="maxPrice.value = maxPrice.value + 0.01"
-      />
-      <!-- </q-btn-group> -->
-      <div class="col-5 text-right">
-        {{
-          maxPrice.value?.toLocaleString(undefined, {
-            minimumFractionDigits: 2,
-            maximumFractionDigits: 2,
-          }) + ' ct/kWh'
-        }}
+    <div class="row items-center q-mb-xs q-gutter-x-sm">
+      <div class="col-auto">
+        <q-btn
+          v-if="maxPrice.value"
+          icon="remove"
+          color="grey"
+          size="sm"
+          class="q-mr-md"
+          @click="maxPrice.value = maxPrice.value - 1"
+        />
+        <q-btn
+          v-if="maxPrice.value"
+          icon="add"
+          color="grey"
+          size="sm"
+          @click="maxPrice.value = maxPrice.value + 1"
+        />
+      </div>
+      <div class="col text-left">
+        <span class="text-caption">Cent</span>
+      </div>
+    </div>
+    <div class="row items-center q-mb-xs q-gutter-x-sm">
+      <div class="col-auto">
+        <q-btn
+          v-if="maxPrice.value"
+          icon="remove"
+          color="grey"
+          size="sm"
+          class="q-mr-md"
+          @click="maxPrice.value = maxPrice.value - 0.1"
+        />
+        <q-btn
+          v-if="maxPrice.value"
+          icon="add"
+          color="grey"
+          size="sm"
+          @click="maxPrice.value = maxPrice.value + 0.1"
+        />
+      </div>
+      <div class="col text-left">
+        <span class="text-caption">Zehntel Cent</span>
       </div>
     </div>
+    <div class="row items-center q-gutter-x-sm">
+      <div class="col-auto">
+        <q-btn
+          v-if="maxPrice.value"
+          icon="remove"
+          color="grey"
+          size="sm"
+          class="q-mr-md"
+          @click="maxPrice.value = maxPrice.value - 0.01"
+        />
+        <q-btn
+          v-if="maxPrice.value"
+          icon="add"
+          color="grey"
+          size="sm"
+          @click="maxPrice.value = maxPrice.value + 0.01"
+        />
+      </div>
+      <div class="col text-left">
+        <span class="text-caption">Hundertstel Cent</span>
+      </div>
+    </div>
+    <div class="q-mt-sm">
+      {{
+        maxPrice.value?.toLocaleString(undefined, {
+          minimumFractionDigits: 2,
+          maximumFractionDigits: 2,
+        }) + ' ct/kWh'
+      }}
+    </div>
+
     <q-field filled class="q-mt-sm">
       <ElectricityTariffChart
         :modelValue="maxPrice.value"

From 7f989b1c15a944cb6ab1b62a93411d52ef3d9193 Mon Sep 17 00:00:00 2001
From: BrettS <brett.scott@openwb.de>
Date: Thu, 31 Jul 2025 15:24:19 +0200
Subject: [PATCH 3/3] Redesign button placement for energy price adjustment

---
 .../src/components/ChargePointEcoSettings.vue | 135 ++++++++----------
 1 file changed, 62 insertions(+), 73 deletions(-)

diff --git a/packages/modules/web_themes/koala/source/src/components/ChargePointEcoSettings.vue b/packages/modules/web_themes/koala/source/src/components/ChargePointEcoSettings.vue
index dac8239e14..b8c6e6b597 100644
--- a/packages/modules/web_themes/koala/source/src/components/ChargePointEcoSettings.vue
+++ b/packages/modules/web_themes/koala/source/src/components/ChargePointEcoSettings.vue
@@ -72,81 +72,70 @@
     <div class="text-subtitle2 q-my-sm">
       Preisgrenze für strompreisbasiertes Laden
     </div>
-    <div class="row items-center q-mb-xs q-gutter-x-sm">
-      <div class="col-auto">
-        <q-btn
-          v-if="maxPrice.value"
-          icon="remove"
-          color="grey"
-          size="sm"
-          class="q-mr-md"
-          @click="maxPrice.value = maxPrice.value - 1"
-        />
-        <q-btn
-          v-if="maxPrice.value"
-          icon="add"
-          color="grey"
-          size="sm"
-          @click="maxPrice.value = maxPrice.value + 1"
-        />
-      </div>
-      <div class="col text-left">
-        <span class="text-caption">Cent</span>
-      </div>
-    </div>
-    <div class="row items-center q-mb-xs q-gutter-x-sm">
-      <div class="col-auto">
-        <q-btn
-          v-if="maxPrice.value"
-          icon="remove"
-          color="grey"
-          size="sm"
-          class="q-mr-md"
-          @click="maxPrice.value = maxPrice.value - 0.1"
-        />
-        <q-btn
-          v-if="maxPrice.value"
-          icon="add"
-          color="grey"
-          size="sm"
-          @click="maxPrice.value = maxPrice.value + 0.1"
-        />
-      </div>
-      <div class="col text-left">
-        <span class="text-caption">Zehntel Cent</span>
-      </div>
-    </div>
-    <div class="row items-center q-gutter-x-sm">
-      <div class="col-auto">
-        <q-btn
-          v-if="maxPrice.value"
-          icon="remove"
-          color="grey"
-          size="sm"
-          class="q-mr-md"
-          @click="maxPrice.value = maxPrice.value - 0.01"
-        />
-        <q-btn
-          v-if="maxPrice.value"
-          icon="add"
-          color="grey"
-          size="sm"
-          @click="maxPrice.value = maxPrice.value + 0.01"
-        />
-      </div>
-      <div class="col text-left">
-        <span class="text-caption">Hundertstel Cent</span>
+    <div class="row items-center justify-center q-mb-xs q-gutter-x-xs">
+      <q-btn
+        v-if="maxPrice.value"
+        class="col-auto"
+        label="-1,00"
+        color="grey"
+        size="sm"
+        dense
+        @click="maxPrice.value = maxPrice.value - 1"
+      />
+      <q-btn
+        v-if="maxPrice.value"
+        class="col-auto"
+        label="-0,10"
+        color="grey"
+        size="sm"
+        dense
+        @click="maxPrice.value = maxPrice.value - 0.1"
+      />
+      <q-btn
+        v-if="maxPrice.value"
+        class="col-auto"
+        label="-0,01"
+        color="grey"
+        size="sm"
+        dense
+        @click="maxPrice.value = maxPrice.value - 0.01"
+      />
+      <div class="col-auto q-mx-sm">
+        {{
+          maxPrice.value?.toLocaleString(undefined, {
+            minimumFractionDigits: 2,
+            maximumFractionDigits: 2,
+          }) + ' ct/kWh'
+        }}
       </div>
+      <q-btn
+        v-if="maxPrice.value"
+        class="col-auto"
+        label="+0,01"
+        color="grey"
+        size="sm"
+        dense
+        @click="maxPrice.value = maxPrice.value + 0.01"
+      />
+      <q-btn
+        v-if="maxPrice.value"
+        class="col-auto"
+        label="+0,10"
+        color="grey"
+        size="sm"
+        dense
+        @click="maxPrice.value = maxPrice.value + 0.1"
+      />
+      <q-btn
+        v-if="maxPrice.value"
+        class="col-auto"
+        label="+1,00"
+        color="grey"
+        size="sm"
+        dense
+        @click="maxPrice.value = maxPrice.value + 1"
+      />
     </div>
-    <div class="q-mt-sm">
-      {{
-        maxPrice.value?.toLocaleString(undefined, {
-          minimumFractionDigits: 2,
-          maximumFractionDigits: 2,
-        }) + ' ct/kWh'
-      }}
-    </div>
-
     <q-field filled class="q-mt-sm">
       <ElectricityTariffChart
         :modelValue="maxPrice.value"