feat: make depressed prop for GDialog

Author: MichaelGitArt

Diff for: src/gitart-vue-dialog/components/GDialog.vue

@@ -19,6 +19,7 @@
             :width="width"
             :max-width="maxWidth"
             :scrollable="scrollable"
+            :depressed="depressed"
           >
             <slot />
           </GDialogContent>
@@ -88,6 +89,14 @@ export default defineComponent({
       type: Boolean,
       default: false,
     },
+
+    /**
+     * removes box-shadow for content
+     */
+    depressed: {
+      type: Boolean,
+      default: false,
+    },
   },
 
   emits: ['update:modelValue'],

Diff for: src/gitart-vue-dialog/components/GDialogContent.vue

@@ -25,6 +25,14 @@ export default defineComponent({
       type: Boolean,
       default: false,
     },
+
+    /**
+     * removes box-shadow for content
+     */
+    depressed: {
+      type: Boolean,
+      default: false,
+    },
   },
 
   setup(props) {
@@ -33,6 +41,7 @@ export default defineComponent({
       'q-dialog-content',
       {
         'q-dialog-content--scrollable': props.scrollable,
+        'q-dialog-content--depressed': props.depressed,
       },
     ])
 
@@ -55,10 +64,13 @@ export default defineComponent({
   transition: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
   width: 100%;
   z-index: inherit;
-  box-shadow:
-    0 11px 15px -7px rgb(0 0 0 / 20%),
-    0 24px 38px 3px rgb(0 0 0 / 14%),
-    0 9px 46px 8px rgb(0 0 0 / 12%);
+
+  &:not(#{$dialog}--depressed) {
+    box-shadow:
+      0 11px 15px -7px rgb(0 0 0 / 20%),
+      0 24px 38px 3px rgb(0 0 0 / 14%),
+      0 9px 46px 8px rgb(0 0 0 / 12%);
+  }
 
   &:not(#{$dialog}--fullscreen) {
     max-height: 90%;