73 lines
2.3 KiB
HTML
73 lines
2.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Overlord - Connect</title>
|
|
<link rel="stylesheet" href="style.css" />
|
|
<link rel="stylesheet" href="vendor/inter/400.css" />
|
|
<link rel="stylesheet" href="vendor/inter/600.css" />
|
|
<link rel="stylesheet" href="vendor/inter/700.css" />
|
|
<link rel="stylesheet" href="vendor/fontawesome/css/all.min.css" />
|
|
<script src="renderer.js" defer></script>
|
|
</head>
|
|
<body>
|
|
<div class="particles">
|
|
<div class="particle"></div>
|
|
<div class="particle"></div>
|
|
<div class="particle"></div>
|
|
<div class="particle"></div>
|
|
<div class="particle"></div>
|
|
</div>
|
|
|
|
<div class="connect-card">
|
|
<div class="crown-wrapper">
|
|
<i class="fa-solid fa-crown crown-icon"></i>
|
|
</div>
|
|
<div class="brand">Overlord</div>
|
|
<h2 class="title">Connect to Server</h2>
|
|
<p class="subtitle">Enter the address of your Overlord server</p>
|
|
|
|
<form id="connect-form">
|
|
<div class="form-group">
|
|
<label class="label" for="host">Host / IP Address</label>
|
|
<div class="input-row">
|
|
<i class="fa-solid fa-server"></i>
|
|
<input id="host" name="host" type="text" required
|
|
placeholder="e.g. 192.168.1.100 or my.server.com"
|
|
spellcheck="false" autocomplete="off" />
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="label" for="port">Port</label>
|
|
<div class="input-row">
|
|
<i class="fa-solid fa-hashtag"></i>
|
|
<input id="port" name="port" type="number" required
|
|
min="1" max="65535" value="5173"
|
|
placeholder="5173" />
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group toggle-row">
|
|
<label class="toggle-label" for="use-tls">
|
|
<i class="fa-solid fa-lock"></i>
|
|
Use TLS (HTTPS)
|
|
</label>
|
|
<label class="switch">
|
|
<input id="use-tls" type="checkbox" checked />
|
|
<span class="slider"></span>
|
|
</label>
|
|
</div>
|
|
|
|
<button type="submit" class="button primary" id="connect-btn">
|
|
<span class="btn-text">Connect</span>
|
|
<i class="fa-solid fa-arrow-right btn-icon"></i>
|
|
</button>
|
|
|
|
<div id="status" class="status" aria-live="polite"></div>
|
|
</form>
|
|
</div>
|
|
</body>
|
|
</html>
|