Style lobby UI and add favicon to home and login pages.

This commit is contained in:
IM23a-spirgif
2025-06-23 16:53:57 +02:00
parent 3893c144bf
commit 98229d8ea1
4 changed files with 44 additions and 5 deletions
Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

+4 -1
View File
@@ -4,6 +4,7 @@
<meta charset="UTF-8">
<title>Home</title>
<link rel="stylesheet" href="styles_home.css">
<link rel="icon" href="gambling.png" type="image/x-icon">
</head>
<body>
<canvas id="matrix-canvas"></canvas>
@@ -30,8 +31,10 @@
</div>
<div id="join-error" class="error-message hidden"></div>
<div id="lobby-room" class="lobby-room hidden">
<div class="lobby-header">
<button id="leave-button" class="leave-button">Leave Lobby</button>
</div>
<h2>Lobby ID: <span id="lobby-id">N/A</span></h2>
<button id="leave-button">Leave Lobby</button>
<div id="player-list">
<p>Waiting for players...</p>
</div>
+5 -4
View File
@@ -3,14 +3,15 @@
<head>
<meta charset="UTF-8">
<title>Login</title>
<link rel="stylesheet" href="styles_login.css">
<link rel="stylesheet" href="styles_login.css">
<link rel="icon" href="gambling.png" type="image/x-icon">
</head>
<body>
<h1>Login / Register</h1>
<form method="post" action="/login">
<input type="text" name="username" placeholder="Username">
<input type="password" name="password" placeholder="Password">
<button type="submit">Login</button>
<input type="text" name="username" placeholder="Username">
<input type="password" name="password" placeholder="Password">
<button type="submit">Login</button>
</form>
<div id="loading-screen" class="hidden">
<div class="loading-text" id="loading-text">Loading...</div>
+35
View File
@@ -185,3 +185,38 @@ button.logout {
text-align: center;
text-shadow: 0 0 3px #0f0;
}
.lobby-room {
position: relative;
background: rgba(0, 0, 0, 0.7);
border: 2px solid #0f0;
border-radius: 12px;
padding: 30px;
margin-top: 40px;
width: 400px;
text-align: center;
box-shadow: 0 0 10px #0f0;
}
.lobby-header {
position: absolute;
top: 10px;
right: 10px;
}
.leave-button {
background-color: #f00;
color: #fff;
font-size: 12px;
padding: 8px 12px;
border: none;
border-radius: 8px;
box-shadow: 0 0 5px red;
cursor: pointer;
transition: background 0.2s, transform 0.2s;
}
.leave-button:hover {
background-color: #c00;
transform: scale(1.05);
}