web: Fix canvas to the top left of the screen

WerWolv · Jul 4, 2024 · c26eccf · c26eccf
1 parent 9fd5471
commit c26eccf
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 0 deletions.
diff --git a/dist/web/source/style.css b/dist/web/source/style.css
@@ -179,4 +179,10 @@ a:hover {
 #logo {
     height: 25%;
     margin-top: 50px;
+}
+
+.canvas-fixed {
+    position: absolute;
+    top: 0;
+    left: 0;
 }
diff --git a/main/gui/source/window/web_window.cpp b/main/gui/source/window/web_window.cpp
@@ -25,6 +25,10 @@ EM_JS(void, resizeCanvas, (), {
     js_resizeCanvas();
 });
 
+EM_JS(void, fixCanvasInPlace, (), {
+    document.getElementById('canvas').classList.add('canvas-fixed');
+});
+
 EM_JS(void, setupThemeListener, (), {
     window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', event => {
         Module._handleThemeChange();
@@ -88,13 +92,17 @@ namespace hex {
                     return;
                 alert("Failed to load permanent file system: "+err);
             });
+
+            // Center splash screen
+            document.getElementById('canvas').classList.remove('canvas-fixed');
         });
     }
 
     void Window::setupNativeWindow() {
         resizeCanvas();
         setupThemeListener();
         setupInputModeListener();
+        fixCanvasInPlace();
 
         bool themeFollowSystem = ImHexApi::System::usesSystemThemeDetection();
         EventOSThemeChanged::subscribe(this, [themeFollowSystem] {