diff --git a/randogoth.com/bbs/static/bbs.css b/randogoth.com/bbs/static/bbs.css index 9c89481..0c265ae 100644 --- a/randogoth.com/bbs/static/bbs.css +++ b/randogoth.com/bbs/static/bbs.css @@ -144,24 +144,13 @@ a:visited { color: var(--lcyan); } .msgbody ul > li::before { content: "\00B7 "; color: var(--cyan); } /* Pictures keep the scanlines the page gave up: on a board, an image was a monitor showing it. See plugins/crtimages.py for the wrapper. */ -.msgbody .crt { position: relative; display: block; margin: 1em 0; line-height: 0; +.msgbody .crt { display: block; margin: 1em 0; line-height: 0; border: 1px solid var(--blue); } /* Everything fills the column, including images smaller than it. Upscaling is nearest-neighbour, so a 320 wide DOS screenshot comes out as bigger pixels rather than a blurred one, which is the right answer for this material. */ .msgbody .crt img { display: block; width: 100%; height: auto; margin: 0; border: 0; image-rendering: pixelated; } -/* The scanlines are the monitor it is being shown on. Look straight at it and - they go, which is also the only way to see the picture clean. */ -.msgbody .crt::after { content: ""; position: absolute; inset: 0; pointer-events: none; - background: repeating-linear-gradient(to bottom, - rgba(0,0,0,0) 0 2px, rgba(0,0,0,.38) 2px 3px); - opacity: 1; transition: opacity .12s linear; } -.msgbody .crt:hover::after, -.msgbody .crt:focus-within::after { opacity: 0; } -@media (prefers-reduced-motion: reduce) { - .msgbody .crt::after { transition: none; } -} /* Embeds fill the column like everything else. The ratio is injected per element by plugins/crtimages.py from each embed's own attributes. */ .msgbody iframe { display: block; width: 100%; height: auto; margin: 1em 0;