fix: Date picker pop up appears underneath the modal window #15

Jasenkoo · Jasenkoo · commit 76c5ab6d2730 · 2021-10-03T11:31:35.000+02:00
diff --git a/src/Vue3DatePicker/style/components/_DatepickerInput.scss b/src/Vue3DatePicker/style/components/_DatepickerInput.scss
@@ -1,6 +1,7 @@
 .dp__input_wrap {
     position: relative;
     width: 100%;
+    box-sizing: unset;
 }
 
 .dp__input {
diff --git a/src/Vue3DatePicker/style/components/_DatepickerMenu.scss b/src/Vue3DatePicker/style/components/_DatepickerMenu.scss
@@ -7,7 +7,8 @@
     font-size: $dp__font_size;
     user-select: none;
     border: 1px solid var(--dp-border-color);
-    z-index: 1;
+    z-index: 99999;
+    box-sizing: unset;
 }
 
 .dp__arrow_top {
diff --git a/src/Vue3DatePicker/style/components/_SelectionGrid.scss b/src/Vue3DatePicker/style/components/_SelectionGrid.scss
@@ -7,9 +7,10 @@
     top: 0;
     left: 0;
     transition: opacity 1s ease-out;
-    z-index: 2;
+    z-index: 99999;
     font-family: $dp__font_family;
     color: var(--dp-text-color);
+    box-sizing: unset;
 }
 
 .dp__overlay::-webkit-scrollbar-track {
diff --git a/src/Vue3DatePicker/style/components/_TimeInput.scss b/src/Vue3DatePicker/style/components/_TimeInput.scss
@@ -6,6 +6,7 @@
     user-select: none;
     font-family: $dp__font_family;
     color: var(--dp-text-color);
+    box-sizing: unset;
 }
 
 .dp__time_col {

Original file line number	Diff line number	Diff line change
`@@ -7,7 +7,8 @@`
`7`	`7`	`font-size: $dp__font_size;`
`8`	`8`	`user-select: none;`
`9`	`9`	`border: 1px solid var(--dp-border-color);`
`10`		`- z-index: 1;`
	`10`	`+ z-index: 99999;`
	`11`	`+ box-sizing: unset;`
`11`	`12`	`}`
`12`	`13`
`13`	`14`	`.dp__arrow_top {`