Difference between revisions of "Template:SpoilerText"

From questden
(What have I done)
 
m
 
(6 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
<noinclude>
 
<noinclude>
{{SpoilerText|pre=(pre): |hidden=(hidden)}}
+
This had a fancy [https://i.gyazo.com/72655cdb95434be3ccac506c23c79ab9.gif fade-in effect] on hover, but it turns out that it only worked on the preview page, so I had to settle for this garbage.
 +
 
 +
The syntax is just <code><nowiki>{{SpoilerText|text=Hidden Text Here}}</nowiki></code>.
 +
 
 +
For inline spoilers (no red text appending it), use <code><nowiki>{{SpoilerText|text=Inline Hidden Text Here|inline=1}}</nowiki></code>.
 +
 
 +
To reveal the hidden text, highlight it with your cursor. This sucks ass for mobile users, but if you're viewing Questden on a mobile device, you're already used to suffering. This will not work with hyperlinks.
 +
 
 +
 
 +
Example: {{SpoilerText|text=Hidden Text Here}}
 +
 
 +
Here's some {{SpoilerText|text=inline hidden text|inline=1}} in a sentence.
 
</noinclude>
 
</noinclude>
<includeonly>
+
<includeonly><span style="background-color: #333; color: #333; padding: 3px 5px 2px 5px;">{{{text}}}</span>
{{{pre}}} <span class="oo-ui-buttonElement-frameless" style="display:inline;">
+
{{#if:{{{inline|}}}||<span style="display:inline-block; line-height:8px; vertical-align:sub; padding-left:4px;"><span style="font-size:9px; color:red;">Spoiler Text <br/>Highlight to Expose</span></span>}}</span></span></includeonly>
<span class="oo-ui-buttonElement-button oo-ui-decoratedOptionWidget oo-ui-widget-disabled" style="display:inline-block; background-color: #383737; padding: 1px 4px 0px 4px;">
 
<span class="oo-ui-labelElement-label oo-ui-iconElement-icon" style="display:inline;">{{{hidden}}}</span>
 
</span>
 
</span>
 
</includeonly>
 

Latest revision as of 00:40, 27 October 2020

This had a fancy fade-in effect on hover, but it turns out that it only worked on the preview page, so I had to settle for this garbage.

The syntax is just {{SpoilerText|text=Hidden Text Here}}.

For inline spoilers (no red text appending it), use {{SpoilerText|text=Inline Hidden Text Here|inline=1}}.

To reveal the hidden text, highlight it with your cursor. This sucks ass for mobile users, but if you're viewing Questden on a mobile device, you're already used to suffering. This will not work with hyperlinks.


Example: Hidden Text Here Spoiler Text
Highlight to Expose

Here's some inline hidden text in a sentence.