Properly fullscreen

website/src/App.tsx

@@ -21,6 +21,11 @@ const ActionButton = styled.button`
   margin-top: 20px;
 `;
 
+const AppContainer = styled.main`
+  height: calc(100vh - 20px);
+  padding: 10px;
+`;
+
 function App() {
   const [{ volume, bindings }, setState] = useLocalStorage(
     { volume: 1.0, bindings: DefaultBindingsSet() },
@@ -43,7 +48,7 @@ function App() {
   });
 
   return (
-    <div>
+    <AppContainer>
       {showBindings && (
         <BindingsWindow
           bindings={bindings}
@@ -62,7 +67,7 @@ function App() {
         controls={bindings.Actual}
         paused={paused}
       />
-    </div>
+    </AppContainer>
   );
 }
 

website/src/globalStyles.ts

@@ -0,0 +1,8 @@
+import { createGlobalStyle } from "styled-components";
+
+export const GlobalStyle = createGlobalStyle`
+  body {
+    margin: 0;
+    padding: 0;
+  }
+`;

website/src/index.tsx

@@ -1,6 +1,7 @@
 import React from "react";
 import ReactDOM from "react-dom/client";
 import App from "./App";
+import { GlobalStyle } from "./globalStyles";
 
 const root = ReactDOM.createRoot(
   document.getElementById("root") as HTMLElement
@@ -8,6 +9,7 @@ const root = ReactDOM.createRoot(
 
 root.render(
   <React.StrictMode>
+    <GlobalStyle />
     <App />
   </React.StrictMode>
 );