Scrollable dialog is not working as it's supposed to be

[renaldasrep]

Scrollable dialog is not working as it should

Only the v-card-text part is supposed to be scrollable when using scrollable: true, instead the whole card gets a scrollbar and v-card-title + v-card-actions are not visible at all times like they're supposed to be

I think it is because the whole card is wrapped in <div class="v-dialog-wrapper">...<div> similar issue described here, and the answer is that v-dialog scrollable needs a specific structure
vuetifyjs/vuetify#3713 (comment)

I'm using $dialog.showAndWait(Component, { ... })
My component:

<template>
  <v-card outlined>
    <v-card-title>
      Are you sure?
    </v-card-title>
    <v-divider />
    <v-card-text>
      ... content that needs a scrollbar ...
    </v-card-text>
    <v-divider />
    <v-card-actions>
      <v-btn
        text
        @click="$emit('submit', false)"
      >
        Close
      </v-btn>
      <v-spacer />
      <v-btn
        color="primary"
        text
        @click="$emit('submit', true)"
      >
        Confirm
      </v-btn>
    </v-card-actions>
  </v-card>
</template>

<script>
export default {
  layout: [
    'default',
    {
      width: 800,
      scrollable: true,
      showClose: false
    }
  ]
}
</script>

[BrahimMasmoudi]

Hello, did you find a solution for this problem please ?
in my case, even the close button is scrolled with the v-card.
thanks in advance