From 5c160f0b1f1910ac1f85385aa308aa7605590a1d Mon Sep 17 00:00:00 2001
From: black-backdoor <145743369+black-backdoor@users.noreply.github.com>
Date: Sun, 12 Jan 2025 17:15:16 +0100
Subject: [PATCH] add window resizing (#156)

---
 src/components/windows.js   | 14 +++++++++-----
 src/css/taskbar.css         |  3 ++-
 src/css/window-defaults.css |  9 +++++++--
 src/js/state/menubar.js     |  2 +-
 4 files changed, 19 insertions(+), 9 deletions(-)

diff --git a/src/components/windows.js b/src/components/windows.js
index 36fed74..9962afa 100644
--- a/src/components/windows.js
+++ b/src/components/windows.js
@@ -41,11 +41,13 @@ class AppWindow extends HTMLElement {
             }
 
             :host {
+                display: flex;
+                flex-direction: column;
                 position: absolute;
                 min-width: 200px;
                 min-height: 120px;
-                display: flex;
-                flex-direction: column;
+                resize: both;
+                overflow: hidden;
                 border: 1px var(--color-border) solid;
                 border-radius: 8px 8px 0 0;
             }
@@ -133,8 +135,10 @@ class AppWindow extends HTMLElement {
             :host(.fullscreen) {
                 top: 0px !important;
                 left: 0px !important;
-                width: 100% !important;
-                height: calc(100vh - var(--taskbar-height)) !important;
+                width: 100vw !important;
+
+                /* height: 100vh - 50px (taskbar height) */
+                height: calc(100vh - 50px) !important;
                 border-radius: 0;
                 z-index: 3900;
             }
@@ -332,7 +336,7 @@ function handleWindowDrag(windowElement) {
             if(x < 0) x = 0;  // don't let the window go outside the left edge of the screen
             if(y < 0) y = 0;  // don't let the window go outside the top edge of the screen
 
-            if(y > (desktop.offsetHeight - 50)) y = desktop.offsetHeight - 50;  // don't let the window go outside the bottom edge of the screen
+            if(y > (desktop.offsetHeight - 100)) y = desktop.offsetHeight - 100;  // don't let the window go outside the bottom edge of the screen
             if(x > (desktop.offsetWidth - 100)) x = desktop.offsetWidth - 100;  // don't let the window go outside the right edge of the screen
 
             windowElement.style.left = x + 'px';
diff --git a/src/css/taskbar.css b/src/css/taskbar.css
index 18dade6..b89072e 100644
--- a/src/css/taskbar.css
+++ b/src/css/taskbar.css
@@ -13,7 +13,8 @@
     bottom: 0;
     width: 100vw;
     height: 55px;
-    padding: 8px;    
+    padding: 8px;  
+    z-index: 5000;  
 }
 
 
diff --git a/src/css/window-defaults.css b/src/css/window-defaults.css
index a338601..f2f122b 100644
--- a/src/css/window-defaults.css
+++ b/src/css/window-defaults.css
@@ -10,9 +10,14 @@ body.window-dragging iframe {
 
 /* WEBSITE */
 app-window.website {
-    width: 600px;
-    height: 400px;
     --color-background--body: var(--color-background--head);
+}    
+
+@media screen and (min-width: 600px) {
+    app-window.website {
+        width: 600px;
+        height: 400px;
+    }    
 }
 
 app-window.website iframe {
diff --git a/src/js/state/menubar.js b/src/js/state/menubar.js
index d848156..83ea236 100644
--- a/src/js/state/menubar.js
+++ b/src/js/state/menubar.js
@@ -2,7 +2,7 @@ import state from '/modules/state.js';
 
 (() => {
     const update = () => {
-        const configShow = state.get('menubar', true);
+        const configShow = state.get('menubar', false);
         const configFloating = state.get('menubar.floating', true);
 
         const menubar = document.querySelector('.menubar');