Jeffrey Smith
45fe965c32
Co-authored-by: Jeffrey Smith <jasafpro@gmail.com> Co-committed-by: Jeffrey Smith <jasafpro@gmail.com>
73 lines
3.6 KiB
HTML
73 lines
3.6 KiB
HTML
{{define "login.html"}}
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Login — Chat Switchboard</title>
|
|
<link rel="icon" type="image/svg+xml" href="{{.BasePath}}/favicon.svg?v={{.Version}}">
|
|
<link rel="stylesheet" href="{{.BasePath}}/css/styles.css?v={{.Version}}">
|
|
<style>
|
|
:root {
|
|
--banner-h: 28px;
|
|
--banner-top-h: {{if .Banner.Visible}}var(--banner-h){{else}}0px{{end}};
|
|
--banner-bot-h: {{if .Banner.Visible}}var(--banner-h){{else}}0px{{end}};
|
|
}
|
|
body { margin: 0; background: var(--bg-primary, #0e0e10); color: var(--text-primary, #e0e0e0); }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
{{if .Banner.Visible}}
|
|
<div class="banner banner-top" style="background:{{.Banner.Background}};color:{{.Banner.Color}};height:var(--banner-h);line-height:var(--banner-h);text-align:center;font-size:12px;font-weight:600;">
|
|
{{.Banner.Text}}
|
|
</div>
|
|
{{end}}
|
|
|
|
<div style="display:flex;align-items:center;justify-content:center;height:calc(100vh - var(--banner-top-h) - var(--banner-bot-h));">
|
|
<div style="width:360px;padding:32px;">
|
|
<div style="text-align:center;margin-bottom:24px;">
|
|
<img src="{{.BasePath}}/favicon-32.png" alt="" style="width:48px;height:48px;margin-bottom:12px;">
|
|
<h1 style="font-size:20px;margin:0;">Chat Switchboard</h1>
|
|
</div>
|
|
|
|
<div id="loginError" class="form-error" style="display:none;margin-bottom:12px;color:#ef4444;font-size:13px;"></div>
|
|
|
|
<div style="margin-bottom:12px;">
|
|
<label for="loginUsername" style="display:block;font-size:12px;color:var(--text-secondary,#888);margin-bottom:4px;">Username</label>
|
|
<input type="text" id="loginUsername" autocomplete="username" autofocus
|
|
style="width:100%;padding:8px;border-radius:6px;border:1px solid var(--border,#2a2a2a);background:var(--bg-secondary,#1a1a1e);color:var(--text-primary,#e0e0e0);font-size:14px;box-sizing:border-box;">
|
|
</div>
|
|
<div style="margin-bottom:16px;">
|
|
<label for="loginPassword" style="display:block;font-size:12px;color:var(--text-secondary,#888);margin-bottom:4px;">Password</label>
|
|
<input type="password" id="loginPassword" autocomplete="current-password"
|
|
style="width:100%;padding:8px;border-radius:6px;border:1px solid var(--border,#2a2a2a);background:var(--bg-secondary,#1a1a1e);color:var(--text-primary,#e0e0e0);font-size:14px;box-sizing:border-box;">
|
|
</div>
|
|
<button id="loginBtn" onclick="Pages.doLogin()"
|
|
style="width:100%;padding:10px;border:none;border-radius:6px;background:var(--accent,#5865f2);color:white;font-size:14px;cursor:pointer;">
|
|
Log In
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
{{if .Banner.Visible}}
|
|
<div class="banner banner-bottom" style="background:{{.Banner.Background}};color:{{.Banner.Color}};height:var(--banner-h);line-height:var(--banner-h);text-align:center;font-size:12px;font-weight:600;">
|
|
{{.Banner.Text}}
|
|
</div>
|
|
{{end}}
|
|
|
|
<script>
|
|
window.__BASE__ = '{{.BasePath}}';
|
|
</script>
|
|
<script src="{{.BasePath}}/js/pages.js?v={{.Version}}"></script>
|
|
<script>
|
|
document.getElementById('loginPassword').addEventListener('keydown', (e) => {
|
|
if (e.key === 'Enter') Pages.doLogin();
|
|
});
|
|
document.getElementById('loginUsername').addEventListener('keydown', (e) => {
|
|
if (e.key === 'Enter') document.getElementById('loginPassword').focus();
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|
|
{{end}}
|