Template:Flatlist/doc: Difference between revisions
imported>Fire Blanked the page |
No edit summary |
||
Line 1: | Line 1: | ||
{{redirect|Template:Inline list|a navbox listing templates used within lines of text to mark problems needing attention|Template:Inline cleanup tags}} | |||
{{Documentation subpage}} | |||
<!-- Add categories where indicated at the bottom of this page and interwikis at Wikidata --> | |||
{{used in system|in [[MediaWiki:Pageinfo-header]]}} | |||
{{tlr|startflatlist|flt}} | |||
{{Uses TemplateStyles|Template:Hlist/styles.css}} | |||
This template provides a [[Web Content Accessibility Guidelines|WCAG]]/ISO-standards-compliant accessible alternative to comma- or dash- (or other single character-) separated lists, per [[WP:FLATLIST]] and [[WP:HLIST]]. | |||
{{TOC limit|3}} | |||
== Usage == | |||
{{tl|flatlist}} starts a horizontal list, such as: | |||
{{flatlist| | |||
* [[cat]] | |||
* [[dog]] | |||
* [[horse]] | |||
* [[cow]] | |||
* [[sheep]] | |||
* [[pig]] | |||
}} | |||
This template can be used with or without {{tl|endflatlist}}. For navigation boxes using {{tl|navbox}}, one can set {{para|listclass|hlist}}, and achieve the same styling without using this template. For image captions, list (i.e. asterisk) markup does not work, so consider using {{tl|hlist}} instead. | |||
== Parameters == | |||
{{#switch:{{NAMESPACE}}:{{ROOTPAGENAME}}|#default= | |||
{{Format TemplateData|<templatedata> | |||
{ | |||
"description": { | |||
"en": "Used to create plain (i.e. unbulleted) lists." | |||
}, | |||
"format": "inline", | |||
"params": { | |||
"1": { | |||
"label": { | |||
"en": "Content" | |||
}, | |||
"description": { | |||
"en": "The list to wrap." | |||
}, | |||
"suggested": true, | |||
"type": "content" | |||
}, | |||
"class": { | |||
"label": { | |||
"en": "Extra Classes" | |||
}, | |||
"description": { | |||
"en": "Adds extra CSS classes to the containing div." | |||
}, | |||
"type": "string" | |||
}, | |||
"style": { | |||
"label": { | |||
"en": "CSS Style" | |||
}, | |||
"description": { | |||
"en": "Adds extra CSS properties to the containing div. Complex styles should not be used in articles (per [[MOS:DEVIATIONS]]) but may be acceptable on user, project and talk pages." | |||
}, | |||
"example": "\n border: solid 1px silver;\n background: lightyellow;\n", | |||
"type": "string" | |||
}, | |||
"indent": { | |||
"label": { | |||
"en": "Indent" | |||
}, | |||
"description": { | |||
"en": "Indents the list by a number of standard indents (one indent being 1.6[[em (typography)|em]]). (Useful in an indented discussion thread.)" | |||
}, | |||
"example": "2", | |||
"type": "number" | |||
} | |||
}, | |||
"paramOrder": [ | |||
"class", | |||
"style", | |||
"indent", | |||
"1" | |||
] | |||
} | |||
</templatedata>}} | |||
|Template:Endflatlist= | |||
{{Format TemplateData|JSON= | |||
{ | |||
"description": "Ends a flat list created by {{tl|flatlist}}.", | |||
"format": "inline", | |||
"params": { | |||
} | |||
} | |||
}} | |||
}} | |||
== Examples == | |||
<syntaxhighlight lang="text"> | |||
{{flatlist| | |||
* [[cat]] | |||
* [[dog]] | |||
* [[horse]] | |||
* [[cow]] | |||
* [[sheep]] | |||
* [[pig]] | |||
}} | |||
</syntaxhighlight> | |||
produces: | |||
{{flatlist| | |||
* [[cat]] | |||
* [[dog]] | |||
* [[horse]] | |||
* [[cow]] | |||
* [[sheep]] | |||
* [[pig]] | |||
}} | |||
=== Alternative syntax === | |||
<syntaxhighlight lang="text"> | |||
{{startflatlist}} | |||
* [[cat]] | |||
* [[dog]] | |||
* [[horse]] | |||
* [[cow]] | |||
* [[sheep]] | |||
* [[pig]] | |||
{{endflatlist}} | |||
</syntaxhighlight> | |||
produces: | |||
{{startflatlist}} | |||
* [[cat]] | |||
* [[dog]] | |||
* [[horse]] | |||
* [[cow]] | |||
* [[sheep]] | |||
* [[pig]] | |||
{{endflatlist}} | |||
=== Syntax for ordered lists === | |||
<syntaxhighlight lang="text"> | |||
{{flatlist| | |||
# [[first]] | |||
# [[second]] | |||
# [[third]] | |||
# [[fourth]] | |||
# [[fifth]] | |||
# [[sixth]] | |||
}} | |||
</syntaxhighlight> | |||
produces: | |||
{{flatlist| | |||
# [[first]] | |||
# [[second]] | |||
# [[third]] | |||
# [[fourth]] | |||
# [[fifth]] | |||
# [[sixth]] | |||
}} | |||
=== Using optional parameters === | |||
<syntaxhighlight lang="text"> | |||
{{flatlist |indent=2 | |||
|style=border:solid 1px silver; background:lightyellow; | |||
|class=nowraplinks | | |||
* [[Alpine skiing at the 1936 Winter Olympics]] | |||
* [[Alpine skiing at the 1948 Winter Olympics]] | |||
* [[Alpine skiing at the 1952 Winter Olympics]] | |||
* [[Alpine skiing at the 1956 Winter Olympics]] | |||
* [[Alpine skiing at the 1960 Winter Olympics]] | |||
* [[Alpine skiing at the 1964 Winter Olympics]] | |||
}} | |||
</syntaxhighlight> | |||
produces: | |||
{{flatlist |indent=2 |style=border:solid 1px silver; background:lightyellow; |class=nowraplinks | | |||
* [[Alpine skiing at the 1936 Winter Olympics]] | |||
* [[Alpine skiing at the 1948 Winter Olympics]] | |||
* [[Alpine skiing at the 1952 Winter Olympics]] | |||
* [[Alpine skiing at the 1956 Winter Olympics]] | |||
* [[Alpine skiing at the 1960 Winter Olympics]] | |||
* [[Alpine skiing at the 1964 Winter Olympics]] | |||
}} | |||
== Technical details == | |||
This template uses the <code>.hlist</code> [[Cascading Style Sheets|CSS]] class defined in [[MediaWiki:Common.css]] to generate horizontal lists. It causes ordinary html list items to be displayed inline (horizontally), where they would normally display as block elements (vertically). The class also generates the [[interpunct]]s between list items and parentheses around nested lists. Some of the CSS used is not compatible with some older browsers, notably Internet Explorer 6 and 7. | |||
{| class="wikitable" | |||
! Wikitext | |||
! Expanded template | |||
! HTML | |||
|- style="vertical-align:top;" | |||
| <pre> | |||
{{flatlist| | |||
* cat | |||
* dog | |||
* horse | |||
* cow | |||
* sheep | |||
* pig | |||
}} | |||
</pre> | |||
| {{nowiki2|tag=pre| | |||
{{flatlist| | |||
* cat | |||
* dog | |||
* horse | |||
* cow | |||
* sheep | |||
* pig | |||
}} | |||
}} | |||
| <syntaxhighlight lang="html"> | |||
<div class="hlist"> | |||
<ul><li>cat</li> | |||
<li>dog</li> | |||
<li>horse</li> | |||
<li>cow</li> | |||
<li>sheep</li> | |||
<li>pig</li></ul> | |||
</div> | |||
</syntaxhighlight> | |||
|} | |||
== See also == | |||
* {{tl|endflatlist}} | |||
* {{tl|hlist}} | |||
* {{tl|plainlist}} and {{tl|unbulleted list}} | |||
* {{tl|bulleted list}} | |||
* {{tl|ordered list}} | |||
* {{tl|nowrap}} | |||
* {{tl|pagelist}} | |||
* [[WP:HLIST]] | |||
{{HTML lists}} | |||
<includeonly>{{Sandbox other|| | |||
<!-- Categories below this line; interwikis at Wikidata --> | |||
[[Category:Typing-aid templates|Flatlist]] | |||
[[Category:List formatting and function templates|Flatlist]] | |||
}}</includeonly> |