From a4ba1bd41ca0a99e31595f6975a04e6718946984 Mon Sep 17 00:00:00 2001 From: "(quasar) nebula" Date: Sun, 18 Feb 2024 16:54:20 -0400 Subject: css: display reveal interaction border as overlay --- src/static/site6.css | 19 ++++++++++++++++--- 1 file changed, 16 insertions(+), 3 deletions(-) diff --git a/src/static/site6.css b/src/static/site6.css index f709c2da..2ab577ae 100644 --- a/src/static/site6.css +++ b/src/static/site6.css @@ -1285,17 +1285,30 @@ img.pixelate, .pixelate img { } .reveal:not(.revealed) .image-outer-area > * { + --reveal-border-radius: 6px; + position: relative; + overflow: hidden; + border-radius: var(--reveal-border-radius); +} + +.reveal:not(.revealed) .image-outer-area > *::after { + content: ""; + position: absolute; box-sizing: border-box; + top: 0; + left: 0; + bottom: 0; + right: 0; border: 1px dotted var(--primary-color); - border-radius: 6px; - overflow: hidden; + border-radius: var(--reveal-border-radius); + pointer-events: none; } .reveal:not(.revealed) .image-inner-area { background: var(--deep-color); } -.reveal:not(.revealed) .image-outer-area > *:hover { +.reveal:not(.revealed) .image-outer-area > *:hover::after { border-style: solid; } -- cgit 1.3.0-6-gf8a5