From e82881d163c786fb90beee94ac9f5ede183ea133 Mon Sep 17 00:00:00 2001 From: teahubxyz Date: Mon, 19 Oct 2026 15:34:28 +0000 Subject: [PATCH] havre: the gallery grid Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_01BQqGFv54JJTw7p3rgGjP7C --- ventures/havre/style.css | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/ventures/havre/style.css b/ventures/havre/style.css index 6de92f3..7f7feca 100644 --- a/ventures/havre/style.css +++ b/ventures/havre/style.css @@ -223,6 +223,12 @@ input:disabled, textarea:disabled, select:disabled { background: #f2f2f2; color: .line { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 4px 14px; margin-top: 14px; } .line:first-child { margin-top: 0; } .line.cont { margin-top: 6px; } +/* the gallery: square tiles, newest first; a tile takes you to it in its chat */ +.gal { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; margin: 12px 0; padding: 0; list-style: none; max-height: 65vh; overflow: auto; } +.gal button { display: block; width: 100%; padding: 0; border: 0; background: none; color: inherit; text-align: left; cursor: pointer; } +.gal img, .gal video { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; border: 1px solid var(--ink); background: var(--ink); } +.gal button:hover img, .gal button:hover video, .gal button:focus-visible img, .gal button:focus-visible video { outline: 3px solid var(--hi); } +.gal .cap { display: block; margin-top: 4px; font: 11px/1.4 var(--mono); overflow-wrap: anywhere; } /* edit / delete under a message: shown on hover or focus; always, faintly, where there's no hover (phones) */ .msgtools { grid-column: 2; font: 12px/1.4 var(--mono); opacity: 0; } .line:hover .msgtools, .line:focus-within .msgtools { opacity: 1; }