From 4c3b19b78230873ab067d5235124b1587543aa3e Mon Sep 17 00:00:00 2001
From: Elizabeth Hunt <me@liz.coffee>
Date: Mon, 15 Dec 2025 00:12:19 -0800
Subject: Add file input

---
 src/css/style.css | 40 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 40 insertions(+)

(limited to 'src/css/style.css')

diff --git a/src/css/style.css b/src/css/style.css
index 3f8e8f5..e5aee32 100644
--- a/src/css/style.css
+++ b/src/css/style.css
@@ -919,6 +919,46 @@ input[type="range"]::-moz-range-progress {
     box-shadow: inset 2px 2px 0 rgba(255, 255, 255, 0.6), inset -2px -2px 0 rgba(0, 0, 0, 0.3);
 }
 
+/* file inputs */
+
+input[type="file"] {
+    display: none;
+}
+
+label.file-input-button {
+    display: inline-block;
+    font-family: var(--font-mono);
+    font-weight: 700;
+    padding: var(--space-xs) var(--space-sm);
+    border: 2px outset var(--border-light);
+    background: var(--surface);
+    color: var(--fg);
+    font-size: 0.875rem;
+    box-shadow: inset 1px 1px 0 var(--highlight), inset -1px -1px 0 var(--lowlight), 2px 2px 0
+        rgba(0, 0, 0, 0.18);
+    transition: transform 0.05s, box-shadow 0.05s, background 0.1s;
+    user-select: none;
+    width: 100%;
+    text-align: center;
+    box-sizing: border-box;
+    margin-top: var(--space-xs);
+}
+
+label.file-input-button:hover {
+    background: var(--surface-alt);
+}
+
+label.file-input-button:active {
+    transform: translate(1px, 1px);
+    border-style: inset;
+    box-shadow: inset 1px 1px 0 var(--lowlight), inset -1px -1px 0 var(--highlight);
+}
+
+input[type="file"]:focus-visible + label.file-input-button {
+    outline: 1px dotted var(--fg);
+    outline-offset: 2px;
+}
+
 fieldset {
     border: 2px solid var(--border-light);
     padding: var(--space-md);
-- 
cgit v1.2.3-70-g09d2