- generato lista libri, con possibilità di cambiare l'ordinamento dei libri o di cancellare libri.

src/components/CMyDialog/CMyDialog.scss

@@ -0,0 +1,10 @@
+.maximized-dialog-card {
+    max-width: 90%;
+    /* Larghezza massima del dialog */
+    max-height: 90%;
+    /* Altezza massima del dialog */
+    margin: auto;
+    /* Centra il dialog nello schermo */
+    border-radius: 16px;
+    /* Angoli arrotondati opzionali */
+}

src/components/CMyDialog/CMyDialog.ts

@@ -20,6 +20,11 @@ export default defineComponent({
       required: false,
       default: '',
     },
+    class: {
+      type: String,
+      required: false,
+      default: '',
+    },
   },
   setup(props, { emit }) {
     const userStore = useUserStore()

src/components/CMyDialog/CMyDialog.vue

@@ -1,25 +1,34 @@
 <template>
-  <q-dialog v-model="internalModel" maximized
-    transition-show="slide-up"
-    transition-hide="slide-down"
->
-    <q-card class="dialog_card">
-      <q-toolbar class="bg-primary text-white">
-        <q-toolbar-title>
-          {{ title }}
-        </q-toolbar-title>
-        <q-btn flat round color="white" icon="close" v-close-popup></q-btn>
-      </q-toolbar>
+  <div :class="class">
+    <q-dialog
+      v-model="internalModel"
+      maximized
+      transition-show="slide-up"
+      transition-hide="slide-down"
+    >
+      <q-card class="dialog_card maximized-dialog-card">
+        <q-toolbar class="bg-primary text-white">
+          <q-toolbar-title>
+            {{ title }}
+          </q-toolbar-title>
+          <q-btn
+            flat
+            round
+            color="white"
+            icon="close"
+            v-close-popup
+          ></q-btn>
+        </q-toolbar>
 
-      <q-card-section class="inset-shadow">
-        <slot></slot>
-      </q-card-section>
-    </q-card>
-  </q-dialog>
+        <q-card-section class="inset-shadow">
+          <slot></slot>
+        </q-card-section>
+      </q-card>
+    </q-dialog>
+  </div>
 </template>
 
-<script lang="ts" src="./CMyDialog.ts">
-</script>
+<script lang="ts" src="./CMyDialog.ts"></script>
 
 <style lang="scss" scoped>
 @import './CMyDialog';