Plan UI: improve mobile form layout (#12795)

evcc-io · Mar 9, 2024 · 734a52f · 734a52f
1 parent 82aa5d9
commit 734a52f
Showing 1 changed file with 7 additions and 7 deletions.
diff --git a/assets/js/components/ChargingPlanSettingsEntry.vue b/assets/js/components/ChargingPlanSettingsEntry.vue
@@ -21,12 +21,12 @@
 			</div>
 		</div>
 		<div class="row">
-			<div class="col-6 d-lg-none col-form-label">
+			<div class="col-5 d-lg-none col-form-label">
 				<label :for="formId('day')">
 					{{ $t("main.chargingPlan.day") }}
 				</label>
 			</div>
-			<div class="col-6 col-lg-4 mb-2 mb-lg-0">
+			<div class="col-7 col-lg-4 mb-2 mb-lg-0">
 				<select
 					:id="formId('day')"
 					v-model="selectedDay"
@@ -39,12 +39,12 @@
 					</option>
 				</select>
 			</div>
-			<div class="col-6 d-lg-none col-form-label">
+			<div class="col-5 d-lg-none col-form-label">
 				<label :for="formId('day')">
 					{{ $t("main.chargingPlan.time") }}
 				</label>
 			</div>
-			<div class="col-6 col-lg-2 mb-2 mb-lg-0">
+			<div class="col-7 col-lg-2 mb-2 mb-lg-0">
 				<input
 					:id="formId('time')"
 					v-model="selectedTime"
@@ -56,12 +56,12 @@
 					@change="preview"
 				/>
 			</div>
-			<div class="col-6 d-lg-none col-form-label">
+			<div class="col-5 d-lg-none col-form-label">
 				<label :for="formId('goal')">
 					{{ $t("main.chargingPlan.goal") }}
 				</label>
 			</div>
-			<div class="col-6 col-lg-3 mb-2 mb-lg-0">
+			<div class="col-7 col-lg-3 mb-2 mb-lg-0">
 				<select
 					v-if="socBasedPlanning"
 					:id="formId('goal')"
@@ -87,7 +87,7 @@
 					</option>
 				</select>
 			</div>
-			<div class="col-6 d-lg-none col-form-label">
+			<div class="col-5 d-lg-none col-form-label">
 				<label :for="formId('active')">
 					{{ $t("main.chargingPlan.active") }}
 				</label>