Daniel Legt
c1489d1fbb
Add a file-to-icon resolver for common MIME types/extensions so uploads display appropriate Win98-style icons. Update upload and window CSS to use image-based, pixelated icons, and prevent long window titles from overflowing by adding a flex label with ellipsis handling.feat(ui): add file-type icons and clamp window titles Add a file-to-icon resolver for common MIME types/extensions so uploads display appropriate Win98-style icons. Update upload and window CSS to use image-based, pixelated icons, and prevent long window titles from overflowing by adding a flex label with ellipsis handling.
65 lines
3.0 KiB
HTML
65 lines
3.0 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>WarpBox Login - {{ .BoxID }}</title>
|
||
<link rel="icon" type="image/png" href="/static/WarpBoxLogo.png">
|
||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
|
||
<link rel="stylesheet" href="/static/css/app.css">
|
||
<link rel="stylesheet" href="/static/css/window.css">
|
||
<link rel="stylesheet" href="/static/css/login.css">
|
||
</head>
|
||
|
||
<body>
|
||
<main>
|
||
<section class="win98-window login-window" aria-labelledby="login-window-title">
|
||
<header class="win98-titlebar login-titlebar">
|
||
<div class="win98-titlebar-label">
|
||
<img class="win98-titlebar-icon" src="/static/WarpBoxLogo.png" alt="" aria-hidden="true">
|
||
<h1 id="login-window-title">Enter Network Password</h1>
|
||
</div>
|
||
<div class="win98-window-controls" aria-hidden="true">
|
||
<span class="win98-control">_</span>
|
||
<span class="win98-control">□</span>
|
||
<span class="win98-control">×</span>
|
||
</div>
|
||
</header>
|
||
|
||
<form class="login-form" action="/box/{{ .BoxID }}/login" method="post">
|
||
<div class="win98-panel login-panel">
|
||
<div class="login-alert" role="alert">
|
||
<img src="/static/img/icons/Windows Icons - PNG/ole2.dll_14_DEFICON.png" alt="" aria-hidden="true">
|
||
<p>This WarpBox folder is password protected. Enter the password to view and download its files.</p>
|
||
</div>
|
||
|
||
<label class="login-row" for="box-user">
|
||
<span>User name</span>
|
||
<input id="box-user" class="login-input" type="text" value="{{ .BoxUser }}" readonly>
|
||
</label>
|
||
|
||
<label class="login-row" for="box-password">
|
||
<span>Password</span>
|
||
<input id="box-password" class="login-input" type="password" name="password" autocomplete="current-password" autofocus>
|
||
</label>
|
||
|
||
{{ if .ErrorMessage }}
|
||
<p class="login-error">{{ .ErrorMessage }}</p>
|
||
{{ end }}
|
||
</div>
|
||
|
||
<footer class="login-actions">
|
||
<button class="win98-button" type="submit">OK</button>
|
||
<a class="win98-button" href="/">Cancel</a>
|
||
</footer>
|
||
|
||
<div class="win98-statusbar login-statusbar">
|
||
<span>Protected folder</span>
|
||
<span>WarpBox</span>
|
||
</div>
|
||
</form>
|
||
</section>
|
||
</main>
|
||
</body>
|
||
</html>
|