pikvm/pikvm#599: fixed webui windows oversizing

6 files changed, 11 insertions, 8 deletions

diff --git a/web/share/css/kvm/stream.css b/web/share/css/kvm/stream.css
index 0ead41cb..2a103b52 100644
--- a/web/share/css/kvm/stream.css
+++ b/web/share/css/kvm/stream.css
@@ -55,7 +55,7 @@ div#stream-box {
 	object-fit: contain;
 	position: relative;
 	display: inline-block;
-	border: var(--border-window-thin);
+	border: var(--border-window-default-thin);
 }
 div.stream-box-offline {
 	-webkit-filter: grayscale(100%) brightness(75%) sepia(75%);
diff --git a/web/share/css/login/login.css b/web/share/css/login/login.css
index b6d3e204..5a69aa30 100644
--- a/web/share/css/login/login.css
+++ b/web/share/css/login/login.css
@@ -34,7 +34,7 @@ div#login {
 	outline: none;
 	word-wrap: break-word;
 	max-width: 400px;
-	border: var(--border-window-thin);
+	border: var(--border-window-default-thin);
 	border-radius: 8px;
 	box-sizing: border-box;
 	box-shadow: var(--shadow-big);
diff --git a/web/share/css/modal.css b/web/share/css/modal.css
index 1519b263..6a260958 100644
--- a/web/share/css/modal.css
+++ b/web/share/css/modal.css
@@ -37,7 +37,7 @@ div.modal div.modal-window {
 	outline: none;
 	margin: 15% auto;
 	overflow: hidden;
-	border: var(--border-window-thin);
+	border: var(--border-window-default-2px);
 	border-radius: 8px;
 	box-sizing: border-box;
 	box-shadow: var(--shadow-big);
@@ -45,7 +45,7 @@ div.modal div.modal-window {
 	padding: 0;
 }
 div.modal div.modal-window-active {
-	border: var(--border-intensive-2px) !important;
+	border: var(--border-window-active-2px) !important;
 }
 
 div.modal div.modal-window div.modal-header {
diff --git a/web/share/css/start.css b/web/share/css/start.css
index 34c597f5..b6fc96c0 100644
--- a/web/share/css/start.css
+++ b/web/share/css/start.css
@@ -34,7 +34,7 @@ div.start-box div.start {
 	outline: none;
 	word-wrap: break-word;
 	max-width: 800px;
-	border: var(--border-window-thin);
+	border: var(--border-window-default-thin);
 	border-radius: 8px;
 	box-sizing: border-box;
 	box-shadow: var(--shadow-big);
diff --git a/web/share/css/vars.css b/web/share/css/vars.css
index 32d73a1f..93931696 100644
--- a/web/share/css/vars.css
+++ b/web/share/css/vars.css
@@ -79,11 +79,14 @@
 	--border-hovered-2px: 2px solid #2a2d31;
 	--border-navbar-item-thin: thin solid black;
 	--border-control-thin: thin solid #17191d;
-	--border-window-thin: thin solid #17191d;
 	--border-key-thin: thin solid #202225;
 	--border-intensive-2px: 2px solid #5b90bb;
 	--border-intensive-thin: thin solid #5b90bb;
 
+	--border-window-default-2px: 2px solid #282a2e;
+	--border-window-active-2px: 2px solid #5b90bb;
+	--border-window-default-thin: thin solid #17191d;
+
 	--border-navbar-menu-default-2px: 2px solid black;
 	--border-navbar-menu-active-2px: 2px solid #5b90bb;
 	--border-menu-item-content-top-thin: thin solid #17191d;
diff --git a/web/share/css/window.css b/web/share/css/window.css
index b14c2acc..89ff800d 100644
--- a/web/share/css/window.css
+++ b/web/share/css/window.css
@@ -25,7 +25,7 @@ div.window {
 	outline: none;
 	overflow: hidden;
 	position: fixed;
-	border: var(--border-window-thin);
+	border: var(--border-window-default-2px);
 	border-radius: 8px;
 	box-sizing: border-box;
 	box-shadow: var(--shadow-big);
@@ -38,7 +38,7 @@ div.window-resizable {
 	resize: both;
 }
 div.window-active {
-	border: var(--border-intensive-2px) !important;
+	border: var(--border-window-active-2px) !important;
 }
 div.window-resizable.window-active::-webkit-resizer {
 	width: 0;