commit 760bedb0357041014321c747537c8d45264c13e7
parent 424ff38442d36652e7ab62693a2256bc5c025ac1
Author: breadcat <breadcat@users.noreply.github.com>
Date: Fri, 28 Nov 2025 14:19:43 +0000
Some more CSS shuffling
Diffstat:
5 files changed, 32 insertions(+), 27 deletions(-)
diff --git a/static/bulk-tag.js b/static/bulk-tag.js
@@ -14,7 +14,7 @@ document.addEventListener('DOMContentLoaded', function () {
if (checkedOp.value === 'add') {
valueField.required = true;
- valueLabel.innerHTML = 'Value: <span style="color: red;">*</span>';
+ valueLabel.innerHTML = 'Value <span class="required">(required)</span>:';
} else {
valueField.required = false;
valueLabel.innerHTML = 'Value:';
diff --git a/static/style.css b/static/style.css
@@ -1,6 +1,10 @@
/* main body styling */
-body,div#search-container form input{background:#1a1a1a;color:#cfcfcf;font-family:sans-serif;margin:0}
+body,button{background:#1a1a1a;color:#cfcfcf;font-family:sans-serif;margin:0}
a{color:#add8e6;text-decoration:none}
+input[type="url"], input[type="text"] {background:#1a1a1a;color:#cfcfcf;border:1px solid gray;margin: 8px;padding:8px;outline: none; box-sizing: border-box}
+input[type="url"]:focus, input[type="text"]:focus{border:1px solid white;background-color:#3a3a3a}
+div#search-container form {border-left:1px solid gray}
+span.required {color: red}
/* nav menu */
nav ul{flex:1 1 auto;list-style:none}
@@ -25,17 +29,12 @@ nav ul.sub-menu li a{color:#add8e6;background:#1a1a1a; min-width: 110px}
nav ul.sub-menu li ul li a{min-width: 170px}
nav ul.sub-menu li a:hover{background:#2a2a2a}
-/* search bar */
-div#search-container form {border-left:1px solid gray}
-div#search-container form input{border:1px solid gray;margin: 8px;padding:8px;outline: none; box-sizing: border-box}
-div#search-container form input:focus{border:1px solid white;background-color:#3a3a3a}
-
/* responsive nav bar */
@media (max-width: 600px) {
nav ul li a span, nav ul li strong {display: none;}
nav ul li a svg {display: inline-block; margin: 0 auto; width: 1.8rem; }
nav ul li a {padding: 0.8rem}
- div#search-container form input {width: 80px; padding: 6px; margin: 6px; }
+ div#search-container form input {width: 80px}
}
/* fix whitespace in nav */
@@ -63,6 +62,8 @@ div.file-container {display: flex}
div.file-sidebar {flex: 0 0 auto; min-width: 15em}
div.file-sidebar details {padding: 0.7rem}
span.file-tag-category,div.file-sidebar details ul li a {text-transform:capitalize}
+div.file-sidebar details ul li form {display:inline}
+button#copy-btn {margin-top: 5px}
details > summary {list-style: none; cursor: pointer; }
details > summary::before {content: "[+]"; display: inline-block; width: 2ch; margin-right: 0.5ch;}
@@ -70,9 +71,14 @@ details[open] > summary::before {content: "[-]";}
/* text viewer */
pre#text-viewer{font-family:serif;font-size:25px;line-height:1.8}
+#text-viewer-container{max-width:800px; margin:1em 0}
+#text-viewer-container div{display:flex; justify-content:space-between; margin-bottom:5px;}
#text-viewer-container:fullscreen{margin:0;max-width:75%;margin:auto;height:100vh;padding:1em;background:#000;display:flex;flex-direction:column}
#text-viewer-container:fullscreen #text-viewer{flex:1;max-height:none!important;margin:0;height:100%}
#text-viewer-container:fullscreen>div{flex-shrink:0}
+pre#text-viewer {white-space:pre-wrap; overflow:auto; background:#111; color:#eee; padding:10px; border-radius:8px; max-height:500px;}
+
+img.file-content-image {max-width:400px}
/* pagination */
.pagination .disabled,.pagination a{border-radius:4px;padding:.5rem 1rem}
diff --git a/templates/add.html b/templates/add.html
@@ -2,20 +2,19 @@
<h2>Upload File(s)</h2>
<form method="post" enctype="multipart/form-data">
<input type="file" name="file" multiple>
- <button type="submit">Upload</button>
+ <br><button type="submit" class="text-button">Upload</button>
</form>
<h2>Upload from URL</h2>
<form method="post" action="/upload-url">
- File URL: <input type="url" name="fileurl" required style="width:400px"><br>
- Custom filename: <input type="text" name="filename" placeholder="Optional: my-image.jpg" style="width:300px"><br>
- <button type="submit">Add File</button>
+ <input type="url" name="fileurl" required placeholder="File URL"><input type="text" name="filename" placeholder="Optional custom filename">
+ <br><button type="submit" class="text-button">Download File</button>
</form>
-<h2>Upload from yt-dlp</h2>
+<h2>Upload using yt-dlp</h2>
<form action="/add-yt" method="POST">
- <label for="url">Video URL:</label>
- <input type="text" name="url" id="url" required>
- <button type="submit">Add Video</button>
+ <input type="text" name="url" id="url" required placeholder="Video URL">
+ <br><button type="submit" class="text-button">Download Video</button>
</form>
+
{{template "_footer"}}
\ No newline at end of file
diff --git a/templates/bulk-tag.html b/templates/bulk-tag.html
@@ -57,7 +57,7 @@
<label>
<input type="radio" name="operation" value="add" {{if eq .Data.FormData.Operation "add"}}checked{{end}}>
Add tag to selected files
- </label>
+ </label><br>
<label>
<input type="radio" name="operation" value="remove" {{if eq .Data.FormData.Operation "remove"}}checked{{end}}>
Remove tag(s) from selected files
@@ -69,7 +69,7 @@
</div>
</div>
- <button type="submit" class="btn">Apply Tags</button>
+ <button type="submit" class="text-button">Apply Tags</button>
</form>
<br>
diff --git a/templates/file.html b/templates/file.html
@@ -13,7 +13,7 @@
<span class="file-tag-category">{{$k}}:</span><br>
{{range $i, $v := $vs}}
{{if $i}}<br> {{end}}
- <form method="post" action="/file/{{$.Data.File.ID}}/tag/{{$k}}/{{$v}}/delete" style="display:inline;"><button class="text-button" type="submit">x</button></form>
+ <form method="post" action="/file/{{$.Data.File.ID}}/tag/{{$k}}/{{$v}}/delete"><button class="text-button" type="submit">x</button></form>
<a href="/tag/{{$k}}/{{$v}}">{{$v}}</a>
{{end}}
</li>
@@ -40,8 +40,8 @@
<details>
<summary>Raw URL</summary>
<input id="raw-url" value="http://{{.IP}}:{{.Port}}/uploads/{{.Data.EscapedFilename}}"><br>
- <button class="text-button" id="copy-btn" style="margin-top: 5px;">Copy</button>
- <span id="copy-status" style="margin-left: 10px;"></span>
+ <button class="text-button" id="copy-btn">Copy</button><br>
+ <span id="copy-status"></span>
<script src="/static/copy-link.js" defer></script>
</details>
@@ -49,12 +49,12 @@
<summary>File Actions</summary>
<script src="/static/rename-file.js" defer></script>
- <form id="renameForm-{{.Data.File.ID}}" method="post" action="/file/{{.Data.File.ID}}/rename" style="display:inline;">
+ <form id="renameForm-{{.Data.File.ID}}" method="post" action="/file/{{.Data.File.ID}}/rename">
<input type="hidden" name="newfilename" value="{{.Data.File.Filename}}">
<button type="button" class="text-button rename-button" data-file-id="{{.Data.File.ID}}" data-current-name="{{.Data.File.Filename}}">Rename File</button>
</form>
<br />
- <form method="post" action="/file/{{.Data.File.ID}}/delete" style="display:inline;">
+ <form method="post" action="/file/{{.Data.File.ID}}/delete">
<button type="submit" onclick="return confirm('Are you sure you want to delete this file? This cannot be undone!')" class="text-button">Delete File</button>
</form>
</details>
@@ -63,19 +63,19 @@
<div class="file-content">
{{if hasAnySuffix .Data.File.Filename ".jpg" ".jpeg" ".png" ".gif" ".webp"}}
- <a href="/uploads/{{.Data.EscapedFilename}}" target="_blank"><img src="/uploads/{{.Data.EscapedFilename}}" style="max-width:400px"></a><br>
+ <a href="/uploads/{{.Data.EscapedFilename}}" target="_blank"><img src="/uploads/{{.Data.EscapedFilename}}" class="file-content-image"></a><br>
{{else if hasAnySuffix .Data.File.Filename ".mp4" ".webm" ".mov" ".m4v"}}
<video id="videoPlayer" controls loop muted width="600">
<source src="/uploads/{{.Data.EscapedFilename}}">
</video><br>
<script src="/static/timestamps.js" defer></script>
{{else if hasAnySuffix .Data.File.Filename ".txt" ".md"}}
- <div id="text-viewer-container" style="max-width:800px; margin:1em 0;">
- <div style="display:flex; justify-content:space-between; margin-bottom:5px;">
+ <div id="text-viewer-container">
+ <div>
<button onclick="toggleLineNumbers()" class="text-button">Line Numbers</button>
<button onclick="toggleFullscreen()" class="text-button">Fullscreen</button>
</div>
- <pre id="text-viewer" data-filename="{{.Data.EscapedFilename}}" style="white-space:pre-wrap; overflow:auto; background:#111; color:#eee; padding:10px; border-radius:8px; max-height:500px;">Loading...</pre>
+ <pre id="text-viewer" data-filename="{{.Data.EscapedFilename}}">Loading...</pre>
</div>
<script src="/static/text-viewer.js"></script>
{{else}}
