| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8" /> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> |
| <title>Lab Portal — Login</title> |
| <link rel="icon" href="{{ url_for('static', filename='favicon.svg') }}" type="image/svg+xml" /> |
| <style> |
| :root { |
| --bg: #0e0e10; |
| --surface: #1a1a2e; |
| --border: #2a2a4a; |
| --text: #e2e2e8; |
| --text-dim: #9090a8; |
| --accent: #6c63ff; |
| --accent-h: #8b83ff; |
| --danger: #ff6b6b; |
| } |
| *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } |
| html, body { height: 100%; } |
| body { |
| font-family: "Segoe UI", system-ui, -apple-system, sans-serif; |
| background: var(--bg); |
| color: var(--text); |
| display: flex; |
| align-items: center; |
| justify-content: center; |
| } |
| .login-card { |
| background: var(--surface); |
| border: 1px solid var(--border); |
| border-radius: 16px; |
| padding: 2.5rem 2rem; |
| width: 100%; |
| max-width: 380px; |
| text-align: center; |
| } |
| .login-card h1 { |
| font-size: 1.4rem; |
| margin-bottom: .35rem; |
| } |
| .login-card p { |
| color: var(--text-dim); |
| font-size: .85rem; |
| margin-bottom: 1.75rem; |
| } |
| .field { margin-bottom: 1.25rem; text-align: left; } |
| .field label { |
| display: block; |
| font-size: .82rem; |
| color: var(--text-dim); |
| margin-bottom: .35rem; |
| } |
| .field input { |
| width: 100%; |
| padding: .6rem .85rem; |
| border-radius: 8px; |
| border: 1px solid var(--border); |
| background: var(--bg); |
| color: var(--text); |
| font-size: .95rem; |
| outline: none; |
| transition: border-color .15s; |
| } |
| .field input:focus { border-color: var(--accent); } |
| .btn { |
| width: 100%; |
| padding: .65rem; |
| border-radius: 8px; |
| border: none; |
| background: var(--accent); |
| color: #fff; |
| font-size: .95rem; |
| font-weight: 600; |
| cursor: pointer; |
| transition: background .15s; |
| } |
| .btn:hover { background: var(--accent-h); } |
| .flash { |
| background: rgba(255,107,107,.12); |
| border: 1px solid var(--danger); |
| color: var(--danger); |
| padding: .5rem .75rem; |
| border-radius: 8px; |
| font-size: .85rem; |
| margin-bottom: 1rem; |
| } |
| </style> |
| </head> |
| <body> |
| <div class="login-card"> |
| <h1>Lab Portal</h1> |
| <p>Enter the supervisor password to continue.</p> |
|
|
| {% with messages = get_flashed_messages() %} |
| {% if messages %} |
| {% for msg in messages %} |
| <div class="flash">{{ msg }}</div> |
| {% endfor %} |
| {% endif %} |
| {% endwith %} |
|
|
| <form method="POST" action="{{ url_for('login') }}"> |
| <div class="field"> |
| <label for="password">Password</label> |
| <input type="password" id="password" name="password" autofocus required /> |
| </div> |
| <button class="btn" type="submit">Sign in</button> |
| </form> |
| </div> |
| </body> |
| </html> |
|
|
