This fixes an issue where if you have a modal open, it's hard to drag the...

This fixes an issue where if you have a modal open, it's hard to drag the entire app. But it also creates issues where the drag area is HUGE. Let's see...

src/renderer/components/Experiment/Train/TrainingModalLoRA.tsx

@@ -224,12 +224,12 @@ export default function TrainingModalLoRA({
     <Modal open={open}>
       <ModalDialog
         sx={{
-          width: '70vw',
+          width: '90dvw',
           transform: 'translateX(-50%)', // This undoes the default translateY that centers vertically
-          top: '10vh',
+          top: '5dvh',
           overflow: 'auto',
-          maxHeight: '80vh',
-          minHeight: '70vh',
+          maxHeight: '90dvh',
+          minHeight: '70dvh',
           height: '100%',
         }}
       >

src/renderer/styles.css

@@ -61,6 +61,16 @@ button.hoverEditButton {
   app-region: no-drag;
 }
 
+.MuiModal-backdrop {
+  --webkit-app-region: drag;
+  app-region: drag;
+}
+
+.MuiModalDialog-root {
+  --webkit-app-region: no-drag;
+  app-region: no-drag;
+}
+
 /* This is an unused style for a cool
 spinning gradient border effect */
 /*