From 07e5e5c15b20077fd325b2546ae96c5a50d4c1bd Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Fri, 17 Apr 2020 19:15:47 -0400
Subject: Show small image preview on [Image] link hover/focus

---
 ext/mixed/css/display.css | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

(limited to 'ext/mixed/css')

diff --git a/ext/mixed/css/display.css b/ext/mixed/css/display.css
index ca1fa371..4f43af6f 100644
--- a/ext/mixed/css/display.css
+++ b/ext/mixed/css/display.css
@@ -697,6 +697,25 @@ button.action-button {
 
 :root[data-compact-glossaries=true] .term-glossary-image-container {
     display: none;
+    position: absolute;
+    left: 0;
+    top: 100%;
+    z-index: 1;
+}
+
+:root[data-compact-glossaries=true] .entry:nth-last-of-type(1):not(:nth-of-type(1)) .term-glossary-image-container {
+    bottom: 100%;
+    top: auto;
+}
+
+:root[data-compact-glossaries=true] .term-glossary-image-link {
+    position: relative;
+    display: inline-block;
+}
+
+:root[data-compact-glossaries=true] .term-glossary-image-link:hover .term-glossary-image-container,
+:root[data-compact-glossaries=true] .term-glossary-image-link:focus .term-glossary-image-container {
+    display: block;
 }
 
 :root:not([data-compact-glossaries=true]) .term-glossary-image-link-text {
-- 
cgit v1.2.3