« get me outta code hell

css: fixes & tweaks for reveal, mostly in grid - hsmusic-wiki - HSMusic - static wiki software cataloguing collaborative creation
about summary refs log tree commit diff
diff options
context:
space:
mode:
author(quasar) nebula <qznebula@protonmail.com>2024-02-25 17:46:16 -0400
committer(quasar) nebula <qznebula@protonmail.com>2024-02-25 17:46:16 -0400
commit5a183f12ba50024975cb19fa3dbf635d7249d651 (patch)
treef935c8d678b537f8abc475f55c5159ff1e465a9d
parent0500d6b8a44c0882bf367f7e398d49541bc659aa (diff)
css: fixes & tweaks for reveal, mostly in grid
-rw-r--r--src/static/site6.css11
1 files changed, 11 insertions, 0 deletions
diff --git a/src/static/site6.css b/src/static/site6.css
index 2bb44dd6..686b3c40 100644
--- a/src/static/site6.css
+++ b/src/static/site6.css
@@ -1266,6 +1266,7 @@ img.pixelate, .pixelate img {
 .reveal .image.reveal-thumbnail {
   position: absolute;
   top: 0;
+  left: 0;
   image-rendering: pixelated;
 }
 
@@ -1309,6 +1310,15 @@ img.pixelate, .pixelate img {
   border: 1px dotted var(--primary-color);
   border-radius: var(--reveal-border-radius);
   pointer-events: none;
+
+  /* By an awkward DOM intersection, this element might be
+   * .image-inner-area::after, which is already styled with
+   * a slight visual effect. Guarantee that the properties
+   * set to that end are overwritten, and fully co-opt it
+   * to serve as the interaction cue instead.
+   */
+  box-shadow: none;
+  opacity: 1;
 }
 
 .reveal:not(.revealed) .image-inner-area {
@@ -1317,6 +1327,7 @@ img.pixelate, .pixelate img {
 
 .reveal:not(.revealed) .image-outer-area > *:hover::after {
   border-style: solid;
+  box-shadow: 0 0 0 1.5px #00000099 inset;
 }
 
 .reveal:not(.revealed) .image-outer-area > *:hover .image {