Bose Portable PA Knowledge

Template:FAQList: Difference between revisions

ST (talk | contribs)
Bureaucrats, Interface administrators, Administrators
20,075 edits
VisualWikitext
Created page with "<noinclude> This template wraps multiple FAQItem entries and provides a pure‑CSS Expand All / Collapse All toggle using the checkbox hack. Usage: <nowiki>{{FAQList| cont..."
 
mNo edit summary
 
(18 intermediate revisions by the same user not shown)
Line 1: Line 1:
<noinclude>
<noinclude>
This template wraps multiple FAQItem entries and provides a pure‑CSS
<big>FAQList usage</big>
Expand All / Collapse All toggle using the checkbox hack.


Usage:
# Wrap multiple FAQItem entries inside this template
# Put all FAQItem calls after | content =
# Each FAQItem will appear inside a single FAQ list with Expand/Collapse All controls


<nowiki>{{FAQList|
----
  content =
 
     {{FAQItem|question=...|answer=...}}
<nowiki>{{</nowiki>'''FAQList'''
     {{FAQItem|question=...|answer=...}}
 
}}</nowiki>
| content =  
</noinclude>
     <nowiki>{{</nowiki>FAQItem
    |question = question 1
    |answer   = answer 1
    <nowiki>}}</nowiki>
 
     <nowiki>{{</nowiki>FAQItem
    |question = question 2
    |answer   = answer 2
    <nowiki>}}</nowiki>


<style>
<nowiki>}}</nowiki>
.faq-toggle { display:none; }
.faq-toggle + label {
  cursor:pointer;
  font-weight:bold;
  display:inline-block;
  margin:0.5em 0;
}
.faq-collapsed,
.faq-expanded { display:none; }
.faq-toggle:not(:checked) ~ .faq-collapsed { display:block; }
.faq-toggle:checked ~ .faq-expanded { display:block; }
</style>


<!-- Hidden checkbox controls which block is visible -->
The FAQList will render as it appears below this line.
<input type="checkbox" id="faq-toggle" class="faq-toggle" />
----
{{FAQList


<!-- Toggle label -->
| content =
<label for="faq-toggle">
    {{FAQItem
   <span class="expand-text">Expand all</span>
    |question = question 1
   <span class="collapse-text">Collapse all</span>
    |answer   = answer 1
</label>
    }}
    {{FAQItem
    |question = question 2
    |answer   = answer 2
    }}
}}


<!-- Collapsed version (normal FAQItems) -->
This template wraps multiple FAQItem entries and provides Expand All / Collapse All
<div class="faq-collapsed">
using site-level JavaScript in MediaWiki:Common.js.
</noinclude>
<div class="faq-list" >
<div class="faq-controls">
  <span class="faq-expand-all" style="cursor:pointer; font-weight:bold;">Expand all</span>&nbsp;|&nbsp;<span class="faq-collapse-all" style="cursor:pointer; font-weight:bold;">Collapse all</span>
</div>
{{{content}}}
{{{content}}}
</div>
</div>


<!-- Expanded version (all items forced open) -->
<noinclude>
<div class="faq-expanded">
[[Category:FAQ]]
{{#tag:html|
</noinclude>
<details open>
}}}{{{content}}}{{#tag:html|</details>}}
</div>
Retrieved from "https://boseperformer.com/Template:FAQList"