Flatlist/doc

From Eating Asturias, the Encyclopedia of Asturian Gastronomy
en>WOSlinker
(text)
en>ENeRZet
(text editing)
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}}
{{Documentation subpage}}
<!-- Add categories where indicated at the bottom of this page and interwikis at Wikidata -->
<!-- Add categories where indicated at the bottom of this page and interwikis at Wikidata -->
{{used in system|in [[MediaWiki:Pageinfo-header]]}}
{{Uses TemplateStyles|Template:Flatlist/styles.css}}
{{tlr|startflatlist|flt}}
This template provides a WCAG/ISO-standards-compliant accessible alternative to comma or dash (or other single character) separated lists.
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 ==
== Usage ==
{{tl|flatlist}} starts a horizontal list, such as:
{{Tlx|flatlist}} starts a horizontal list, such as:


{{flatlist|
{{flatlist|
* [[cat]]
* cat
* [[dog]]
* dog
* [[horse]]
* horse
* [[cow]]
* cow
* [[sheep]]
* sheep
* [[pig]]
* 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 ==
== Parameters ==
{{#switch:{{NAMESPACE}}:{{ROOTPAGENAME}}|#default=
{{TemplateData header}}
{{Format TemplateData|<templatedata>
<templatedata>
{
{
"description": {
"description": {
"en": "Used to create plain (i.e. unbulleted) lists."
"en": "Used to create plain (i.e. unbulleted) lists.",
"cs": "Používá se k vytváření jednoduchých (tj. bez odrážek) seznamů."
},
},
"format": "inline",
"format": "inline",
Line 32: Line 28:
"1": {
"1": {
"label": {
"label": {
"en": "Content"
"en": "Content",
"cs": "Obsah"
},
},
"description": {
"description": {
"en": "The list to wrap."
"en": "The list to wrap.",
"cs": "Seznam k zabalení."
},
},
"suggested": true,
"suggested": true,
Line 42: Line 40:
"class": {
"class": {
"label": {
"label": {
"en": "Extra Classes"
"en": "Extra Classes",
"cs": "Extra třídy"
},
},
"description": {
"description": {
"en": "Adds extra CSS classes to the containing div."
"en": "Adds extra CSS classes to the containing div.",
"cs": "Přidá další třídy CSS do obsahující div."
},
},
"type": "string"
"type": "string"
Line 51: Line 51:
"style": {
"style": {
"label": {
"label": {
"en": "CSS Style"
"en": "CSS Style",
"cs": "Styl CSS"
},
},
"description": {
"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."
"en": "Adds extra CSS properties to the containing div.",
"cs": "Přidá další vlastnosti CSS do obsahující div."
},
},
"example": "\n border: solid 1px silver;\n background: lightyellow;\n",
"example": "\n border: solid 1px silver;\n background: lightyellow;\n",
Line 61: Line 63:
"indent": {
"indent": {
"label": {
"label": {
"en": "Indent"
"en": "Indent",
"cs": "Odrážka"
},
},
"description": {
"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.)"
"en": "Indents the list by a number of standard indents (one indent being 1.6em), particularly handy for inclusion in an indented discussion thread.",
"cs": "Odsadí seznam o několik standardních odsazení (jedna odrážka je 1,6 em), což je zvláště užitečné pro zahrnutí do odsazeného diskusního vlákna."
},
},
"example": "2",
"example": "2",
Line 77: Line 81:
]
]
}
}
</templatedata>}}
</templatedata>
|Template:Endflatlist=
{{Format TemplateData|JSON=
{
"description": "Ends a flat list created by {{tl|flatlist}}.",
"format": "inline",
"params": {
}
}
}}
}}


== Examples ==
== Examples ==
<syntaxhighlight lang="text">
<syntaxhighlight lang="moin">
{{flatlist|
{{flatlist|
* [[cat]]
* cat
* [[dog]]
* dog
* [[horse]]
* horse
* [[cow]]
* cow
* [[sheep]]
* sheep
* [[pig]]
* pig
}}
}}
</syntaxhighlight>
</syntaxhighlight>


Line 104: Line 98:


{{flatlist|
{{flatlist|
* [[cat]]
* cat
* [[dog]]
* dog
* [[horse]]
* horse
* [[cow]]
* cow
* [[sheep]]
* sheep
* [[pig]]
* 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 ===
=== Syntax for ordered lists ===
<syntaxhighlight lang="text">
<pre>
{{flatlist|
{{flatlist|
# [[first]]
# first
# [[second]]
# second
# [[third]]
# third
# [[fourth]]
# fourth
# [[fifth]]
# fifth
# [[sixth]]
# sixth
}}
}}
</syntaxhighlight>
</pre>


produces:
produces:


{{flatlist|
{{flatlist|
# [[first]]
# first
# [[second]]
# second
# [[third]]
# third
# [[fourth]]
# fourth
# [[fifth]]
# fifth
# [[sixth]]
# sixth
}}
}}


=== Using optional parameters ===
=== Using optional parameters ===
<syntaxhighlight lang="text">
<syntaxhighlight lang="moin">
{{flatlist |indent=2  
{{flatlist |indent=2  
|style=border:solid 1px silver; background:lightyellow;  
|style=border:solid 1px silver; background:lightyellow;  
|class=nowraplinks |
|class=nowraplinks |
* [[Alpine skiing at the 1936 Winter Olympics]]
* Alpine skiing at the 1936 Winter Olympics
* [[Alpine skiing at the 1948 Winter Olympics]]
* Alpine skiing at the 1948 Winter Olympics
* [[Alpine skiing at the 1952 Winter Olympics]]
* Alpine skiing at the 1952 Winter Olympics
* [[Alpine skiing at the 1956 Winter Olympics]]
* Alpine skiing at the 1956 Winter Olympics
* [[Alpine skiing at the 1960 Winter Olympics]]
* Alpine skiing at the 1960 Winter Olympics
* [[Alpine skiing at the 1964 Winter Olympics]]
* Alpine skiing at the 1964 Winter Olympics
}}
}}
</syntaxhighlight>
</syntaxhighlight>


Line 175: Line 146:


{{flatlist |indent=2 |style=border:solid 1px silver; background:lightyellow; |class=nowraplinks |
{{flatlist |indent=2 |style=border:solid 1px silver; background:lightyellow; |class=nowraplinks |
* [[Alpine skiing at the 1936 Winter Olympics]]
* Alpine skiing at the 1936 Winter Olympics
* [[Alpine skiing at the 1948 Winter Olympics]]
* Alpine skiing at the 1948 Winter Olympics
* [[Alpine skiing at the 1952 Winter Olympics]]
* Alpine skiing at the 1952 Winter Olympics
* [[Alpine skiing at the 1956 Winter Olympics]]
* Alpine skiing at the 1956 Winter Olympics
* [[Alpine skiing at the 1960 Winter Olympics]]
* Alpine skiing at the 1960 Winter Olympics
* [[Alpine skiing at the 1964 Winter Olympics]]
* Alpine skiing at the 1964 Winter Olympics
}}
}}


== Technical details ==
== 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.
This template uses the <code>.hlist</code> [[w:Cascading Style Sheets|CSS]] class defined in the TemplateStyles 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 interpuncts between list items and parentheses around nested lists.


{| class="wikitable"
{| class="wikitable"
Line 201: Line 172:
}}
}}
</pre>
</pre>
| {{nowiki2|tag=pre|
| {{#tag:pre|
{{flatlist|
{{flatlist|
* cat
* cat
Line 224: Line 195:


== See also ==
== See also ==
* {{tl|endflatlist}}
* {{tlx|multi-column numbered list}}
* {{tl|hlist}}
* {{tlx|nowrap}}
* {{tl|plainlist}} and {{tl|unbulleted list}}
* {{tlx|pagelist}}
* {{tl|bulleted list}}
* {{tlx|Hlist}} – Uses [[Module:List]]
* {{tl|ordered list}}
* {{ll|Help:Lists}}
* {{tl|nowrap}}
 
* {{tl|pagelist}}
{{navbox lists}}
* [[WP:HLIST]]
{{HTML lists}}
<includeonly>{{Sandbox other||
<includeonly>{{Sandbox other||
<!-- Categories below this line; interwikis at Wikidata -->
<!-- Categories below this line; interwikis at Wikidata -->
[[Category:Typing-aid templates|Flatlist]]
[[Category:Typing-aid templates{{#translation:}}]]
[[Category:List formatting and function templates|Flatlist]]
[[Category:Formatting templates{{#translation:}}]]
}}</includeonly>
}}</includeonly>

Revision as of 08:17, 23 October 2022

Lua error: callParserFunction: function "#translation" was not found. This template provides a WCAG/ISO-standards-compliant accessible alternative to comma or dash (or other single character) separated lists.

Usage

{{flatlist}} starts a horizontal list, such as:

  • cat
  • dog
  • horse
  • cow
  • sheep
  • pig

Parameters

This is the TemplateData for this template used by TemplateWizard, VisualEditor and other tools. See a monthly parameter usage report for Template:Flatlist in articles based on its TemplateData.

TemplateData for Flatlist

Used to create plain (i.e. unbulleted) lists.

Template parameters

This template prefers inline formatting of parameters.

ParameterDescriptionTypeStatus
Extra Classesclass

Adds extra CSS classes to the containing div.

Stringoptional
CSS Stylestyle

Adds extra CSS properties to the containing div.

Example
border: solid 1px silver;
background: lightyellow;
Stringoptional
Indentindent

Indents the list by a number of standard indents (one indent being 1.6em), particularly handy for inclusion in an indented discussion thread.

Example
2
Numberoptional
Content1

The list to wrap.

Contentsuggested

Examples

 {{flatlist|
 * cat
 * dog
 * horse
 * cow
 * sheep
 * pig
 }}

produces:

  • cat
  • dog
  • horse
  • cow
  • sheep
  • pig

Syntax for ordered lists

{{flatlist|
# first
# second
# third
# fourth
# fifth
# sixth
}}

produces:

  1. first
  2. second
  3. third
  4. fourth
  5. fifth
  6. sixth

Using optional parameters

 {{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
 }}

produces:

  • 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 .hlist CSS class defined in the TemplateStyles 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 interpuncts between list items and parentheses around nested lists.

Wikitext Expanded template HTML 
{{flatlist|
* cat
* dog
* horse
* cow
* sheep
* pig
}}

<div class="hlist " >
* cat
* dog
* horse
* cow
* sheep
* pig

</div>

<div class="hlist">
<ul><li>cat</li>
<li>dog</li>
<li>horse</li>
<li>cow</li>
<li>sheep</li>
<li>pig</li></ul>
</div>

See also

Template:Navbox lists

Retrieved from "https://eatingasturias.com/index.php?title=Template:Flatlist/doc&oldid=5121"
Powered by Semantic MediaWiki