From 564fa647286d4f26d71db264d97e04844f1138d2 Mon Sep 17 00:00:00 2001
From: hbrain <hbrain@piagent.local>
Date: Wed, 27 May 2026 22:38:03 +0200
Subject: [PATCH] Improve edit page media previews

---
 style.css | 20 +++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

diff --git a/style.css b/style.css
index 036dfe7..d9a0be2 100644
--- a/style.css
+++ b/style.css
@@ -2,7 +2,7 @@
 
 
 
-.site-footer.admin-footer{position:fixed;left:0;right:0;bottom:0;z-index:1000;max-width:100vw;background:rgba(27,30,34,.92);backdrop-filter:blur(6px);color:#F3F4F6;padding:.55rem max(1rem,calc((100vw - 1100px)/2 + 1rem));box-sizing:border-box;box-shadow:0 -2px 16px #0008;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem}.site-footer.admin-footer .admin-left{grid-column:1;justify-self:start;display:flex;align-items:center;gap:.7rem}.site-footer.admin-footer .job-status{grid-column:2;justify-self:center;margin-right:0;padding-bottom:0}.site-footer.admin-footer .admin-right{grid-column:3;justify-self:end;width:auto;display:flex;align-items:center;justify-content:flex-end;gap:.6rem}.site-footer.admin-footer .logout-link{margin-left:0}.site-footer.admin-footer .tabs{margin:0}.site-footer.admin-footer .tabs a{margin:0}@media (max-width: 600px){
+.site-footer.admin-footer{position:fixed;left:0;right:0;bottom:0;z-index:1000;max-width:100vw;background:rgba(27,30,34,.92);backdrop-filter:blur(6px);color:#F3F4F6;padding:.55rem max(1rem,calc((100vw - 1100px)/2 + 1rem));box-sizing:border-box;box-shadow:0 -2px 16px #0008;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:1rem}.site-footer.admin-footer .admin-left{grid-column:1;justify-self:start;display:flex;align-items:center;gap:.7rem}.site-footer.admin-footer .job-status{grid-column:2;justify-self:center;margin:0;padding:0;text-align:center;max-width:none;white-space:nowrap;overflow:hidden}.site-footer.admin-footer .admin-right{grid-column:3;justify-self:end;width:auto;display:flex;align-items:center;justify-content:flex-end;gap:.6rem}.site-footer.admin-footer .logout-link{margin-left:0}.site-footer.admin-footer .tabs{margin:0}.site-footer.admin-footer .tabs a{margin:0}@media (max-width: 600px){
   .site-footer.admin-footer{grid-template-columns:1fr;justify-items:center;height:auto}
   .site-footer.admin-footer .admin-left,
   .site-footer.admin-footer .job-status,
@@ -12,3 +12,21 @@
   .site-footer.admin-footer .logout-link{width:100%;text-align:center}
 }
 @media (max-width: 600px){.site-footer.admin-footer{grid-template-columns:1fr;justify-items:center;height:auto}.site-footer.admin-footer .admin-left,.site-footer.admin-footer .job-status,.site-footer.admin-footer .admin-right{grid-column:1;justify-self:center;width:100%}.site-footer.admin-footer .admin-left{justify-content:center}.site-footer.admin-footer .admin-right{justify-content:center}.site-footer.admin-footer .logout-link{width:100%;text-align:center}}
+
+
+/* Edit page file thumbnails */
+.file-list{display:flex;flex-direction:column;gap:1rem}
+.caption-row{display:grid;grid-template-columns:180px minmax(0,1fr) auto;gap:1rem;align-items:start;background:rgba(27,30,34,.92);padding:1rem;border-radius:.8rem;box-shadow:0 2px 16px #0006}
+.caption-row .preview{width:180px;height:120px;overflow:hidden;border-radius:.55rem;background:#111315;display:grid;place-items:center;flex:none}
+.caption-row .preview img,
+.caption-row .preview video{width:100%;height:100%;object-fit:cover;display:block}
+.caption-row .preview span{font-size:.85rem;color:#A0A4AB;padding:.5rem;text-align:center}
+.caption-fields{min-width:0;display:flex;flex-direction:column;gap:.6rem}
+.caption-fields strong{word-break:break-word}
+.caption-fields textarea{min-height:5.5rem}
+.caption-row button[type="button"]{align-self:start;white-space:nowrap}
+@media (max-width: 800px){
+  .caption-row{grid-template-columns:1fr;}
+  .caption-row .preview{width:100%;height:180px}
+  .caption-row button[type="button"]{width:100%}
+}