f3d6e100eb
- Implement lightweight link-shortener core using Flask and SQLite3 - Configure secure session cookie management via environment variables - Set up isolated database helper modules with strict contextual teardown - Add comprehensive .gitignore to prevent committing runtime environment and local databases - Define production-ready structure including template directories and dependencies
145 lines
No EOL
4.7 KiB
HTML
145 lines
No EOL
4.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>m0x.it // Admin</title>
|
|
<link rel="icon" type="image/svg+xml" href="{{ url_for('static', filename='image/favicon.svg') }}">
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<style>
|
|
* { box-sizing: border-box; }
|
|
body {
|
|
margin: 0;
|
|
background: #0d1117;
|
|
color: #e6edf3;
|
|
font-family: ui-monospace, "SF Mono", Consolas, monospace;
|
|
padding: 2rem;
|
|
}
|
|
.wrap { max-width: 780px; margin: 0 auto; }
|
|
h1 {
|
|
font-size: 1.2rem;
|
|
color: #58a6ff;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
a.logout { font-size: 0.8rem; color: #8b949e; text-decoration: none; }
|
|
a.logout:hover { color: #f85149; }
|
|
|
|
form.create {
|
|
background: #161b22;
|
|
border: 1px solid #30363d;
|
|
border-radius: 10px;
|
|
padding: 1.25rem;
|
|
margin: 1.5rem 0;
|
|
display: flex;
|
|
gap: 0.6rem;
|
|
flex-wrap: wrap;
|
|
}
|
|
form.create input {
|
|
background: #0d1117;
|
|
border: 1px solid #30363d;
|
|
border-radius: 6px;
|
|
color: #e6edf3;
|
|
padding: 0.5rem 0.6rem;
|
|
font-family: inherit;
|
|
font-size: 0.9rem;
|
|
}
|
|
form.create input[name="target"] { flex: 2; min-width: 220px; }
|
|
form.create input[name="code"] { flex: 1; min-width: 140px; }
|
|
form.create button {
|
|
background: #238636;
|
|
border: none;
|
|
border-radius: 6px;
|
|
color: white;
|
|
padding: 0.5rem 1rem;
|
|
font-family: inherit;
|
|
cursor: pointer;
|
|
}
|
|
form.create button:hover { background: #2ea043; }
|
|
.hint { font-size: 0.75rem; color: #8b949e; width: 100%; }
|
|
|
|
table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
|
|
th, td { text-align: left; padding: 0.5rem 0.6rem; border-bottom: 1px solid #21262d; }
|
|
th { color: #8b949e; font-weight: normal; font-size: 0.8rem; }
|
|
td.code a { color: #58a6ff; text-decoration: none; }
|
|
td.code a:hover { text-decoration: underline; }
|
|
td.target { color: #8b949e; max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
.badge {
|
|
font-size: 0.7rem;
|
|
padding: 0.1rem 0.4rem;
|
|
border-radius: 4px;
|
|
background: #1f2937;
|
|
color: #8b949e;
|
|
}
|
|
.badge.alias { background: #1a2e1a; color: #3fb950; }
|
|
button.del {
|
|
background: transparent;
|
|
border: 1px solid #30363d;
|
|
color: #f85149;
|
|
border-radius: 6px;
|
|
padding: 0.2rem 0.5rem;
|
|
cursor: pointer;
|
|
font-family: inherit;
|
|
font-size: 0.75rem;
|
|
}
|
|
button.del:hover { background: #3d1a1a; }
|
|
|
|
.flash {
|
|
margin-bottom: 1rem;
|
|
padding: 0.5rem 0.7rem;
|
|
border-radius: 6px;
|
|
font-size: 0.85rem;
|
|
}
|
|
.flash.error { background: #3d1a1a; color: #f85149; border: 1px solid #5c2626; }
|
|
.flash.success { background: #1a2e1a; color: #3fb950; border: 1px solid #2ea04340; }
|
|
.empty { color: #8b949e; font-size: 0.9rem; padding: 1rem 0; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="wrap">
|
|
<h1>m0x.it // Links <a class="logout" href="{{ url_for('admin_logout') }}">Logout</a></h1>
|
|
|
|
{% with messages = get_flashed_messages(with_categories=true) %}
|
|
{% for category, message in messages %}
|
|
<div class="flash {{ category }}">{{ message }}</div>
|
|
{% endfor %}
|
|
{% endwith %}
|
|
|
|
<form class="create" method="POST" action="{{ url_for('admin_create') }}">
|
|
<input type="text" name="target" placeholder="https://ziel-url.de/pfad" required>
|
|
<input type="text" name="code" placeholder="Alias (optional, sonst zufällig)">
|
|
<button type="submit">Erstellen</button>
|
|
<div class="hint">Alias leer lassen → zufälliger 6-stelliger base62-Code</div>
|
|
</form>
|
|
|
|
{% if links %}
|
|
<table>
|
|
<thead>
|
|
<tr><th>Code</th><th>Ziel</th><th>Klicks</th><th>Erstellt</th><th></th></tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for link in links %}
|
|
<tr>
|
|
<td class="code">
|
|
<a href="/{{ link.code }}" target="_blank">/{{ link.code }}</a>
|
|
{% if link.is_alias %}<span class="badge alias">alias</span>{% else %}<span class="badge">auto</span>{% endif %}
|
|
</td>
|
|
<td class="target" title="{{ link.target }}">{{ link.target }}</td>
|
|
<td>{{ link.clicks }}</td>
|
|
<td>{{ link.created_at[:10] }}</td>
|
|
<td>
|
|
<form method="POST" action="{{ url_for('admin_delete', code=link.code) }}" onsubmit="return confirm('Link /{{ link.code }} löschen?');">
|
|
<button class="del" type="submit">löschen</button>
|
|
</form>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
{% else %}
|
|
<div class="empty">Noch keine Links vorhanden.</div>
|
|
{% endif %}
|
|
</div>
|
|
</body>
|
|
</html> |