Centered modal

frontend/src/app.svelte

@@ -3,7 +3,6 @@
   import ContextMenu from '$components/contextmenu.svelte';
   import dialogs from '$lib/dialogs.js';
   import contextMenu from '$lib/stores/contextmenu.js';
-  import environment from '$lib/stores/environment.js';
   import hostTree from '$lib/stores/hosttree.js';
   import applicationInited from '$lib/stores/inited.js';
   import windowTitle from '$lib/stores/windowtitle.js';
@@ -43,7 +42,7 @@
 
 <svelte:window on:contextmenu|preventDefault />
 
-<div id="root" class="platform-{$environment?.platform}">
+<div id="root">
   <div class="titlebar">{$windowTitle}</div>
 
   {#if $applicationInited && (showWelcomeScreen !== undefined)}
@@ -74,7 +73,7 @@
     align-items: center;
     overflow: hidden;
   }
-  #root.platform-darwin .titlebar {
+  :global([data-platform="darwin"]) .titlebar {
     height: var(--darwin-titlebar-height);
   }
 
@@ -86,7 +85,7 @@
   main.empty {
     grid-template: 1fr / 1fr;
   }
-  #root.platform-darwin main {
+  :global([data-platform="darwin"]) main {
     height: calc(100vh - var(--darwin-titlebar-height));
   }
 
@@ -98,12 +97,4 @@
   main > :global(.addressbar) {
     grid-column: 1 / 3;
   }
-
-  .databaselist {
-    overflow: scroll;
-  }
-
-  .button.create {
-    margin-top: 0.5rem;
-  }
 </style>

frontend/src/components/modal.svelte

@@ -73,19 +73,14 @@
     height: 100vh;
     background-color: rgba(0, 0, 0, 0.5);
     margin: 0;
-    padding-top: 50px;
+    padding: 2rem;
     --wails-draggable: drag;
   }
-  :global(#root.platform-darwin) .outer {
-    margin-top: var(--darwin-titlebar-height);
-  }
 
   .inner {
     max-height: 80vh;
     background-color: #fff;
-    margin-left: auto;
-    margin-right: auto;
-    margin-bottom: auto;
+    margin: auto;
     width: 100%;
     border-radius: var(--radius);
     display: flex;

frontend/src/lib/stores/environment.js

@@ -11,5 +11,10 @@ async function reload() {
 
 reload();
 
+subscribe(env => {
+  // @ts-ignore
+  document.body.dataset.platform = env?.platform;
+});
+
 const environment = { reload, subscribe };
 export default environment;