Template:Show: Difference between revisions

Content deleted Content added
No edit summary
Tags: Manual revert Reverted
No edit summary
 
(3 intermediate revisions by the same user not shown)
Line 1:
<includeonly><{{#ifeq:{{{inline|}}}|yes|span|div}} class="mw-collapsible {{#ifeq:{{lc:{{{state|collapsed}}}}}|expanded||mw-collapsed}} {{#ifeq:{{{compact|}}}|yes|mw-compact-toggle|}}"
data-expandtext="{{{expandtext|more ▾}}}"
data-collapsetext="{{{collapsetext|less ▴}}}"
style="{{{style|}}}">
style="{{#ifeq:{{{inline|}}}|yes|display:inline;}}{{#ifeq:{{{compact|}}}|yes|display:inline-block; vertical-align:top;}} {{{style|}}}">
<{{#ifeq:{{{inline|}}}|yes|span|div}} class="mw-collapsible-content" style="{{#ifeq:{{{inline|}}}|yes|display:inline;}}">
{{{text|}}}</{{#ifeq:{{{inline|}}}|yes|span|div}}>
</prediv>
</{{#ifeq:{{{inline|}}}|yes|span|div}}></includeonly><noinclude>
== Usage ==
A simple collapsible block for hiding/showing content.
Standard block usage (floats toggle to the far right):
 
<pre>
{{show
Line 14 ⟶ 16:
</pre>
 
== CompactCustom UsageLabels ==
To change the "more" and "less" buttons:
This version prevents the "jump" and keeps the link next to the text.
<pre>
{{show
|expandtext=Read Bio
|compact=yes
|collapsetext=Close
|text=This text is short and the button stays close and aligned.
|text=John Doe has been the CEO since 2010...
}}
</pre>
Line 27 ⟶ 30:
* '''expandtext''': The text for the "show" link (Defaults to "more ▾").
* '''collapsetext''': The text for the "hide" link (Defaults to "less ▴").
* '''inline''': Set to "yes" to use span tags.
* '''compact''': Set to "yes" to keep the toggle link next to the text and fix the "push down" alignment issue.
* '''state''': Set to "expanded" to have the text visible on page load.
* '''style''': Pass additional CSS styles directly to the container.
 
[[Category:Generic templates]]
== Required CSS ==
Add this to your [[MediaWiki:Common.css]] to ensure the "more" link doesn't float away:
<pre>
.mw-compact-toggle .mw-collapsible-toggle {
float: none !important;
display: inline-block !important;
margin-left: 0.5em;
vertical-align: top !important;
}
</pre>
</noinclude>