changing dialog

Signed-off-by: dartcafe <[email protected]>

Author: dartcafe

src/components/Base/modules/InputDiv.vue

@@ -202,14 +202,13 @@ const inputClass = computed(() => [
 
 <template>
 	<div :class="componentClass">
-		<label v-if="label">
+		<label v-if="label" :class="{ indented: useNumModifiers }">
 			{{ label }}
 		</label>
 
 		<div class="input-wrapper">
 			<NcButton
 				v-if="useNumModifiers && !useNumericVariant"
-				class="date-add-button"
 				:title="t('polls', 'minus')"
 				:variant="'tertiary-no-background'"
 				@click="subtract">
@@ -272,6 +271,9 @@ const inputClass = computed(() => [
 	label {
 		display: block;
 		margin-bottom: 2px;
+		&.indented {
+			margin-inline-start: var(--default-clickable-area);
+		}
 	}
 
 	input {

src/components/Base/modules/LuxonPicker.vue

@@ -42,7 +42,7 @@ function nextDay() {
 
 <template>
 	<div class="luxon-picker">
-		<div v-if="label">{{ label }}</div>
+		<label v-if="label" :class="{ indented: useDayButtons }">{{ label }}</label>
 		<div class="date-time-picker">
 			<NcButton
 				v-if="useDayButtons"
@@ -68,10 +68,19 @@ function nextDay() {
 </template>
 
 <style lang="scss" scoped>
+label {
+	display: block;
+	margin-bottom: 2px;
+	&.indented {
+		margin-inline-start: var(--default-clickable-area);
+	}
+}
+
 .luxon-picker {
 	display: flex;
 	flex-direction: column;
 }
+
 .date-time-picker {
 	display: flex;
 	align-items: end;

src/components/Base/modules/StickyDiv.vue

@@ -88,7 +88,6 @@ const stickyClass = computed(() => ({
 }
 
 .sticky-div.sticky-bottom-shadow::after {
-	content: '';
 	background: linear-gradient(
 		to bottom,
 		rgba(var(--color-box-shadow-rgb), 0.3),
@@ -99,12 +98,11 @@ const stickyClass = computed(() => ({
 	width: 100%;
 	height: 6px;
 	bottom: -6px;
-	left: 0px;
+	inset-inline-start: 0px;
 	z-index: -1;
 }
 
 .sticky-div.sticky-right-shadow::after {
-	content: '';
 	background: linear-gradient(
 		to right,
 		rgba(var(--color-box-shadow-rgb), 0.3),
@@ -114,7 +112,7 @@ const stickyClass = computed(() => ({
 	position: absolute;
 	height: 100%;
 	width: 6px;
-	right: -6px;
+	inset-inline-end: -6px;
 	top: 0px;
 	z-index: -1;
 }

src/components/Modals/OptionsAddModal.vue

@@ -81,6 +81,7 @@ onUnmounted(() => {
 				var(--border-radius-container-large) 0 0;
 		}
 		> div:last-child {
+			padding-bottom: 1rem;
 			border-radius: 0 0 var(--border-radius-container-large)
 				var(--border-radius-container-large);
 		}