Last active
November 1, 2018 16:42
-
-
Save Artanis/d7bc3266f3b8c383bf11 to your computer and use it in GitHub Desktop.
Change Invistext (color=transparent, usually used for spoilers) to blurred text, hover for less blur, hold down mouse button to reveal hidden text.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Invisitext to Blurtext | |
Author: Erik Youngren <[email protected]> | |
Webpage: https://gist.github.com/Artanis/d7bc3266f3b8c383bf11 | |
Licence: http://opensource.org/licenses/MIT | |
Targets: http://forums.sufficientvelocity.com | |
http://forums.spacebattles.com | |
README | |
====== | |
Text in forums that is hidden using the [color=transparent] tag is | |
very difficult to notice, being invisible and all. | |
With clever use of the CSS, the markup for this tag is hunted down and | |
forcibly re-styled. | |
- Invisible text becomes blurred. The text remains unreadable, | |
preserving the intent to obscure the text. | |
- Hover over blurred text and it becomes less blurred. This is not | |
useful, but it sure looks neat! | |
- Hold down mouse over invisible text to clear the blur and un-hide | |
the text. Release to re-blur. | |
Without JavaScript, I don't believe it is possible to preserve the | |
revealed state. If you find a way, please make a fork and add it! | |
Some systems will override color and text-blur styles on highlight, | |
but you could do that already anyway. | |
Author is using the Control Freak extension (http://goo.gl/QARGZ4) | |
in Google Chrome, however any extension that inserts CSS into a page | |
should work. | |
*/ | |
span[style='color: transparent'] { | |
text-shadow: gray 0px 0px 10px; | |
} | |
span[style='color: transparent']:hover { | |
text-shadow: gray 0px 0px 5px; | |
/* Changing the pointer might be too much, feel free to comment it | |
out if you don't like it. | |
*/ | |
cursor: pointer; | |
} | |
span[style='color: transparent']:active { | |
color: inherit !important; | |
text-shadow: none; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment