admin dashboard: mobile support!

This commit is contained in:
ari melody 2025-10-21 23:22:57 +01:00
parent ad50b9e4fa
commit 70b329c902
Signed by: ari
GPG key ID: CF99829C92678188
19 changed files with 201 additions and 56 deletions

View file

@ -22,6 +22,5 @@
{{end}}
</main>
<script type="module" src="/admin/static/admin.js"></script>
<script type="module" src="/admin/static/artists.js"></script>
{{end}}

View file

@ -57,7 +57,7 @@
<p>You have no MFA devices.</p>
{{end}}
<div>
<div class="mfa-actions">
<button type="submit" class="save" id="enable-email" disabled>Enable Email TOTP</button>
<a class="button new" id="add-totp-device" href="/admin/account/totp-setup">Add TOTP Device</a>
</div>

View file

@ -56,7 +56,6 @@
</main>
<script type="module" src="/admin/static/admin.js"></script>
<script type="module" src="/admin/static/artists.js"></script>
<script type="module" src="/admin/static/index.js"></script>
{{end}}

View file

@ -10,12 +10,13 @@
{{block "head" .}}{{end}}
<link rel="stylesheet" href="/admin/static/admin.css">
<script type="module" src="/admin/static/admin.js"></script>
<script type="module" src="/script/vendor/htmx.min.js"></script>
</head>
<body>
<header>
<nav>
<nav id="navbar">
<a href="/" class="nav icon" aria-label="ari melody" title="Return to Home">
<img src="/img/favicon.png" alt="" width="64" height="64">
</a>
@ -57,6 +58,9 @@
</div>
{{end}}
</nav>
<button type="button" id="toggle-nav" aria-label="Navigation toggle">
<img src="/img/hamburger.svg" alt="">
</button>
</header>
{{block "content" .}}{{end}}

View file

@ -17,8 +17,15 @@ form button {
margin-top: 1rem;
}
input {
width: calc(100% - 1rem - 2px);
form input {
width: calc(100% - 1rem - 2px) !important;
}
@media screen and (max-width: 720px) {
h1 {
margin-top: 3em;
text-align: center;
}
}
</style>
{{end}}

View file

@ -2,6 +2,13 @@
<title>Login - ari melody 💫</title>
<link rel="shortcut icon" href="/img/favicon.png" type="image/x-icon">
<style>
@media screen and (max-width: 720px) {
h1 {
margin-top: 3em;
text-align: center;
}
}
form#login {
width: 100%;
display: flex;
@ -17,8 +24,8 @@ form button {
margin-top: 1rem;
}
input {
width: calc(100% - 1rem - 2px);
form input {
width: calc(100% - 1rem - 2px) !important;
}
</style>
{{end}}

View file

@ -43,25 +43,27 @@
<hr>
<table id="logs">
<thead>
<tr>
<th class="log-time">Time</th>
<th class="log-level">Level</th>
<th class="log-type">Type</th>
<th class="log-content">Message</th>
</tr>
</thead>
<tbody>
{{range .Logs}}
<tr class="log {{toLower (parseLevel .Level)}}">
<td class="log-time">{{prettyTime .CreatedAt}}</td>
<td class="log-level">{{parseLevel .Level}}</td>
<td class="log-type">{{titleCase .Type}}</td>
<td class="log-content">{{.Content}}</td>
</tr>
{{end}}
</tbody>
</table>
<div id="logs">
<table>
<thead>
<tr>
<th class="log-time">Time</th>
<th class="log-level">Level</th>
<th class="log-type">Type</th>
<th class="log-content">Message</th>
</tr>
</thead>
<tbody>
{{range .Logs}}
<tr class="log {{toLower (parseLevel .Level)}}">
<td class="log-time">{{prettyTime .CreatedAt}}</td>
<td class="log-level">{{parseLevel .Level}}</td>
<td class="log-type">{{titleCase .Type}}</td>
<td class="log-content">{{.Content}}</td>
</tr>
{{end}}
</tbody>
</table>
</div>
</main>
{{end}}

View file

@ -21,6 +21,4 @@
<p>There are no releases.</p>
{{end}}
</main>
<script type="module" src="/admin/static/admin.js"></script>
{{end}}

View file

@ -31,6 +31,4 @@
{{end}}
</div>
</main>
<script type="module" src="/admin/static/admin.js"></script>
{{end}}