Vuepic / vue3-date-time-picker

Datepicker component for Vue 3
https://vue3datepicker.com
MIT License
158 stars 13 forks source link

Inline date pickers appearing on top #116

Closed simwijs closed 2 years ago

simwijs commented 2 years ago

Describe the bug Date picker appearing on top of Vuetify drawer menu

To Reproduce Steps to reproduce the behavior:

  1. Install Vuetify for Vue 3 (used alpha v13)
  2. Use this code, creating the Datepicker in the comment as designated
    
    <script>
    import { ref, reactive } from "vue";

export default { setup() { const clicks = ref(0); const drawer = ref(true); const items = []

// Expose to template and other API hooks
return { clicks, items, drawer, logo };

}, };

**Expected behavior**
Not appearing on top

**Screenshots**
If applicable, add screenshots to help explain your problem.
![image](https://user-images.githubusercontent.com/49781002/157095371-6b53a722-e9cb-4c28-b175-76298b8c9ffe.png)

**Desktop (please complete the following information):**
 - OS: Win 11
 - Browser chrome
 - Version 99

**Additional context**
Lmk if this is better suited for a Vuetify issue

Vuetify setup used vue cli.

// main.js import { createApp } from 'vue' import App from './App.vue' import vuetify from './plugins/vuetify' import { loadFonts } from './plugins/webfontloader'

import Datepicker from 'vue3-date-time-picker'; import 'vue3-date-time-picker/dist/main.css' loadFonts()

const app = createApp(App) .use(vuetify) .component('Datepicker', Datepicker) .mount('#app');


Datepicker options used

<Datepicker v-model="openDate" inline inlineWithInput autoApply weekNumbers weekNumName="v." :format-locale="sv" format="E M MMM HH:mm yyyy"

</Datepicker```


Additional images of menu on/off
![image](https://user-images.githubusercontent.com/49781002/157096598-ad721467-11c3-4b03-837b-8d26dc166669.png)
![image](https://user-images.githubusercontent.com/49781002/157096620-19204522-67ce-4731-ad6c-2d5a16208467.png)