From edf0ddb50cbf57cefc6b8f0d1984cd3269466789 Mon Sep 17 00:00:00 2001 From: Přemysl Eric Janouch Date: Sun, 24 Dec 2023 06:22:29 +0100 Subject: Handle missing thumbnails better --- public/style.css | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) (limited to 'public/style.css') diff --git a/public/style.css b/public/style.css index 0df44d9..888fd6a 100644 --- a/public/style.css +++ b/public/style.css @@ -46,10 +46,14 @@ ul.sidebar li.child a { gap: 3px; padding: 9px; } .browser:focus-visible { outline: 0; box-shadow: none; } -img.thumbnail { display: block; box-shadow: 0 0 3px rgba(0, 0, 0, 0.75); - margin: 3px; border: 0px solid #000; +img.thumbnail { display: block; background: repeating-conic-gradient(#eee 0% 25%, transparent 0% 50%) 50% / 20px 20px; } +img.thumbnail, .thumbnail.missing { box-shadow: 0 0 3px rgba(0, 0, 0, 0.75); + margin: 3px; border: 0px solid #000; } +.thumbnail.missing { width: 128px; height: 128px; position: relative; } +.thumbnail.missing::after { content: '?'; font-size: 64px; + position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .view { display: flex; flex-grow: 1; overflow: hidden; justify-content: center; align-items: center; } -- cgit v1.2.3-70-g09d2