Jump to content

MediaWiki:Common.css: Difference between revisions

From Flerf Wiki
m Tighten spoiler blur and clip bleed (overflow: hidden, smaller blur radius)
Tag: Reverted
m Slightly larger pixel blocks and reduced blur
 
(6 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* NSFW spoiler - chunky pixelated blocks until mouse moves over image */
.spoiler-img {
.spoiler-img {
     display: table;
     display: table;
Line 4: Line 5:
}
}
.spoiler-img img {
.spoiler-img img {
     filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='p'><feGaussianBlur stdDeviation='2'/><feComponentTransfer><feFuncA type='discrete' tableValues='0 1'/></feComponentTransfer><feMorphology operator='dilate' radius='3'/></filter></svg>#p");
     filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='pixelate' x='0' y='0'><feFlood x='4' y='4' height='2' width='2'/><feComposite width='28' height='28'/><feTile result='a'/><feComposite in='SourceGraphic' in2='a' operator='in'/><feMorphology operator='dilate' radius='14'/></filter></svg>#pixelate") blur(2px);
     transition: filter 0.3s;
     transition: filter 0.3s;
     cursor: pointer;
     cursor: pointer;

Latest revision as of 13:16, 4 May 2026

/* NSFW spoiler - chunky pixelated blocks until mouse moves over image */
.spoiler-img {
    display: table;
    overflow: hidden;
}
.spoiler-img img {
    filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='pixelate' x='0' y='0'><feFlood x='4' y='4' height='2' width='2'/><feComposite width='28' height='28'/><feTile result='a'/><feComposite in='SourceGraphic' in2='a' operator='in'/><feMorphology operator='dilate' radius='14'/></filter></svg>#pixelate") blur(2px);
    transition: filter 0.3s;
    cursor: pointer;
}
.spoiler-img.revealed img {
    filter: none;
}