feat: console/chat/playerlist use full viewport height

Replaced fixed 600px output heights with calc(100vh - 130px)
so console and chat logs fill the available space. Added min-height
to player list table so it doesn't look empty with few players.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
2026-06-13 18:45:52 +02:00
co-authored by Copilot
parent 270b303be0
commit d45ca5c67a
3 changed files with 5 additions and 2 deletions
+1 -1
View File
@@ -6,7 +6,7 @@ function ChatPage(params, container) {
var html = var html =
'<div id="ChatController">' + '<div id="ChatController">' +
'<div id="chat-output" style="height:600px" class="Output scrollable text-white-50">Loading…</div>' + '<div id="chat-output" style="height:calc(100vh - 130px)" class="Output scrollable text-white-50">Loading…</div>' +
'<form id="chat-form">' + '<form id="chat-form">' +
'<input id="chat-input" class="form-control" style="width:100%" placeholder="Type a message...">' + '<input id="chat-input" class="form-control" style="width:100%" placeholder="Type a message...">' +
'</form>' + '</form>' +
+1 -1
View File
@@ -4,7 +4,7 @@
function ConsolePage(params, container) { function ConsolePage(params, container) {
var html = var html =
'<div id="ConsoleController">' + '<div id="ConsoleController">' +
'<div id="console-output" style="height:600px" class="Output scrollable text-white-50">Loading…</div>' + '<div id="console-output" style="height:calc(100vh - 130px)" class="Output scrollable text-white-50">Loading…</div>' +
'<form id="console-form">' + '<form id="console-form">' +
'<input type="text" id="console-input" class="form-control" autocomplete="off">' + '<input type="text" id="console-input" class="form-control" autocomplete="off">' +
'</form>' + '</form>' +
+3
View File
@@ -48,6 +48,9 @@ a:hover { color: #fff; text-decoration: none; }
.fade { opacity: 0.5; } .fade { opacity: 0.5; }
/* Table styles */ /* Table styles */
#PlayerListController .table-responsive {
min-height: calc(100vh - 200px);
}
.table > tbody > tr:hover { .table > tbody > tr:hover {
background-color: rgba(255, 255, 255, 0.15); background-color: rgba(255, 255, 255, 0.15);
} }