Make preview and load draggable (#3146)

apps/zui/src/views/preview-load-modal/shaper.module.css

@@ -3,6 +3,7 @@
   align-items: center;
   justify-content: space-between;
   padding: 0 18px;
+  -webkit-app-region: drag;
 }
 
 :global(.is-mac) .toolbar {

apps/zui/src/views/preview-load-modal/sidebar.module.css

@@ -1,39 +1,43 @@
 .aside {
-    grid-column: 2 / 3;
-    position: relative;
-    min-width: 0;
-    grid-row: span 2;
-    padding: 0;
-    display: grid;
-    grid-template-rows: min-content 1fr min-content;
+  grid-column: 2 / 3;
+  position: relative;
+  min-width: 0;
+  grid-row: span 2;
+  padding: 0;
+  display: grid;
+  grid-template-rows: min-content 1fr min-content;
+}
+
+.aside header {
+  -webkit-app-region: drag;
 }
 
 .formTitle {
-    user-select: none;
-    margin: 2rem auto 1em auto;
-    padding: 0 calc(18px + var(--form-border-radius));
-    font-size: 20px;
-    font-weight: 900;
-    text-align: center;
-    width: max-content;
+  user-select: none;
+  margin: 2rem auto 1em auto;
+  padding: 0 calc(18px + var(--form-border-radius));
+  font-size: 20px;
+  font-weight: 900;
+  text-align: center;
+  width: max-content;
 }
 
 .formTitle hr {
-    border: none;
-    border-top: 2px solid var(--primary-color);
+  border: none;
+  border-top: 2px solid var(--primary-color);
 }
 
 .sidebarDragAnchor {
-    background-color: transparent;
-    transition: all 0ms;
+  background-color: transparent;
+  transition: all 0ms;
 }
 
 .sidebarDragAnchor:hover {
-    transition: all 500ms 200ms;
-    background-color: var(--primary-color);
+  transition: all 500ms 200ms;
+  background-color: var(--primary-color);
 }
 
 .sidebarDragAnchor:active {
-    transition: all 0s;
-    background-color: var(--primary-color-dark);
+  transition: all 0s;
+  background-color: var(--primary-color-dark);
 }