Template:Show: Difference between revisions
Jump to navigation
Jump to search
Content deleted Content added
No edit summary Tag: Reverted |
No edit summary Tag: Manual revert |
||
| Line 1: | Line 1: | ||
<includeonly><{{#ifeq:{{{inline|}}}|yes|span|div}} class="mw-collapsible {{#ifeq:{{lc:{{{state|collapsed}}}}}|expanded||mw-collapsed}} {{#ifeq:{{{compact|}}}|yes|mw-compact-toggle|}}" |
<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 ▴}}}" |
|||
| ⚫ | |||
{{#ifeq:{{{compact|}}}|yes| |
|||
<span class="mw-collapsible-toggle mw-compact-show" style="cursor:pointer; color:#0645ad;" role="button" tabindex="0">{{{expandtext|more ▾}}}</span> |
|||
| ⚫ | |||
<{{#ifeq:{{{inline|}}}|yes|span|div}} class="mw-collapsible-content" style="{{#ifeq:{{{inline|}}}|yes|display:inline;}}"> |
<{{#ifeq:{{{inline|}}}|yes|span|div}} class="mw-collapsible-content" style="{{#ifeq:{{{inline|}}}|yes|display:inline;}}"> |
||
{{{text|}}} |
{{{text|}}}</{{#ifeq:{{{inline|}}}|yes|span|div}}> |
||
{{#ifeq:{{{compact|}}}|yes| |
|||
<span class="mw-collapsible-toggle mw-compact-hide" style="cursor:pointer; color:#0645ad;" role="button" tabindex="0">{{{collapsetext|less ▴}}}</span> |
|||
|}} |
|||
</{{#ifeq:{{{inline|}}}|yes|span|div}}> |
|||
</{{#ifeq:{{{inline|}}}|yes|span|div}}></includeonly><noinclude> |
</{{#ifeq:{{{inline|}}}|yes|span|div}}></includeonly><noinclude> |
||
== Usage == |
== Usage == |
||
| Line 23: | Line 15: | ||
== Compact Usage == |
== Compact Usage == |
||
This |
This prevents the "more" link from floating to the right margin, keeping it next to the text and aligned to the baseline: |
||
<pre> |
<pre> |
||
{{show |
{{show |
||
| Line 29: | Line 21: | ||
|text=This text is short and the button stays close and aligned. |
|text=This text is short and the button stays close and aligned. |
||
}} |
}} |
||
</pre> |
|||
== Custom Labels == |
|||
To change the "more" and "less" buttons: |
|||
<pre> |
|||
{{show |
|||
|expandtext=Read Bio |
|||
|collapsetext=Close |
|||
|text=John Doe has been the CEO since 2010... |
|||
| ⚫ | |||
</pre> |
|||
== Inline Usage == |
|||
To use within a sentence (uses span tags): |
|||
<pre> |
|||
The company reported a record revenue {{show|inline=yes|text=of $1.2B in Q4 2025.|expandtext=(more)}} |
|||
</pre> |
</pre> |
||
| Line 35: | Line 43: | ||
* '''expandtext''': The text for the "show" link (Defaults to "more ▾"). |
* '''expandtext''': The text for the "show" link (Defaults to "more ▾"). |
||
* '''collapsetext''': The text for the "hide" link (Defaults to "less ▴"). |
* '''collapsetext''': The text for the "hide" link (Defaults to "less ▴"). |
||
* '''inline''': Set to "yes" to use span tags. |
* '''inline''': Set to "yes" to use span tags (remains part of the paragraph). |
||
* '''compact''': Set to "yes" to |
* '''compact''': Set to "yes" to keep the toggle link next to the text instead of right-aligned and fix baseline vertical alignment. |
||
* '''state''': Set to "expanded" to have the text visible on page load. |
* '''state''': Set to "expanded" to have the text visible on page load. |
||
* '''style''': Pass additional CSS styles directly. |
* '''style''': Pass additional CSS styles directly. |
||
== Required CSS == |
== Required CSS == |
||
For the '''compact''' mode to look its best, add this to your [[MediaWiki:Common.css]]: |
|||
<pre> |
<pre> |
||
| ⚫ | |||
/* Compact Toggle Logic */ |
|||
float: none !important; |
|||
/* 1. When expanded, hide the 'Show' link */ |
|||
display: inline !important; |
|||
.mw-collapsible:not(.mw-collapsed) .mw-compact-show { |
|||
margin-left: 0.5em; |
|||
vertical-align: baseline !important; |
|||
} |
|||
/* 2. When collapsed, the 'Hide' link is naturally hidden because |
|||
its parent (.mw-collapsible-content) is hidden by MW default CSS. */ |
|||
/* Optional: Ensure pointer cursor if inline styles are stripped */ |
|||
| ⚫ | |||
cursor: pointer; |
|||
} |
} |
||
</pre> |
</pre> |
||
Revision as of 17:34, 19 December 2025
Usage
Standard block usage (floats toggle to the far right):
{{show
|text=The primary driver for the acquisition was the target's proprietary AI technology.
}}
Compact Usage
This prevents the "more" link from floating to the right margin, keeping it next to the text and aligned to the baseline:
{{show
|compact=yes
|text=This text is short and the button stays close and aligned.
}}
Custom Labels
To change the "more" and "less" buttons:
{{show
|expandtext=Read Bio
|collapsetext=Close
|text=John Doe has been the CEO since 2010...
}}
Inline Usage
To use within a sentence (uses span tags):
The company reported a record revenue {{show|inline=yes|text=of $1.2B in Q4 2025.|expandtext=(more)}}
Parameters
- text: The content to be hidden/shown.
- 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 (remains part of the paragraph).
- compact: Set to "yes" to keep the toggle link next to the text instead of right-aligned and fix baseline vertical alignment.
- state: Set to "expanded" to have the text visible on page load.
- style: Pass additional CSS styles directly.
Required CSS
For the compact mode to look its best, add this to your MediaWiki:Common.css:
.mw-compact-toggle .mw-collapsible-toggle {
float: none !important;
display: inline !important;
margin-left: 0.5em;
vertical-align: baseline !important;
}