Template:Show: Difference between revisions

Content deleted Content added

Inline

Revision as of 01:17, 20 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 version prevents the "jump" and keeps the link next to the text.

{{show
|compact=yes
|text=This text is short and the button stays close and aligned.
}}

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.
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.

Required CSS

Add this to your MediaWiki:Common.css to ensure the "more" link doesn't float away:

.mw-compact-toggle .mw-collapsible-toggle {
    float: none !important;
    display: inline-block !important;
    margin-left: 0.5em;
    vertical-align: top !important;
}

@@ Line 2: / Line 2: @@
 data-expandtext="{{{expandtext|more ▾}}}"
 data-collapsetext="{{{collapsetext|less ▴}}}"
-style="{{#ifeq:{{{inline|}}}|yes|display:inline;}}{{#ifeq:{{{compact|}}}|yes|display:inline-block; vertical-align:baseline;}} {{{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}}>
@@ Line 15: / Line 15: @@
 == Compact Usage ==
-This prevents the "more" link from floating to the right margin, keeping it next to the text and aligned to the baseline:
+This version prevents the "jump" and keeps the link next to the text.
 <pre>
 {{show
@@ Line 21: / Line 21: @@
 |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>
@@ Line 43: / Line 27: @@
 * '''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).
+* '''inline''': Set to "yes" to use span tags.
-* '''compact''': Set to "yes" to keep the toggle link next to the text instead of right-aligned and fix baseline vertical alignment.
+* '''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.
 == Required CSS ==
-For the '''compact''' mode to look its best, add this to your [[MediaWiki:Common.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 !important;
+    display: inline-block !important;
     margin-left: 0.5em;
-    vertical-align: baseline !important;
+    vertical-align: top !important;
 }
 </pre>