Template:Hlist/doc: Difference between revisions
Jump to navigation
Jump to search
(Created page with "{{Documentation subpage}} {{Lua|Module:List}} __NOTOC__ This template creates horizontal lists. Each item in the list may be individually styled with CSS. == Usage == '''Basic usage''' {{tji|hlist|''first item''|''second item''|''third item''|...}} '''All parameters''' {{tj|hlist|first item|second item|third item|... | class: class for div tag | style: style for div tag | list_style: style for ul tag | item_style: style f...") |
mNo edit summary |
||
(4 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
{{Documentation subpage}} | {{Documentation subpage}} | ||
{{Lua|Module:List}} | {{Lua|Module:List}} | ||
{{Uses TemplateStyles|Template:Hlist/styles.css}} | |||
__NOTOC__ | __NOTOC__ | ||
Line 11: | Line 12: | ||
'''All parameters''' | '''All parameters''' | ||
{{tj|hlist|first item|second item|third item| | {{tj|hlist|first item|second item|third item| | ||
| class: class for div tag | | class: class for div tag | ||
| style: style for div tag | | style: style for div tag | ||
Line 18: | Line 19: | ||
| item1_style: style for first li tag | | item1_style: style for first li tag | ||
| item2_style: style for second li tag | | item2_style: style for second li tag | ||
| | | | ||
| indent: the number of tabs to indent | | indent: the number of tabs to indent | ||
}} | }} | ||
Line 36: | Line 37: | ||
! Markup !! Renders As | ! Markup !! Renders As | ||
|- | |- | ||
| {{ | | {{tlc|hlist|entry1|entry2|entry3|entry4|entry5|entry6|entry7|entry8|entry9}} || {{hlist|entry1|entry2|entry3|entry4|entry5|entry6|entry7|entry8|entry9}} | ||
|- | |- | ||
| Giant planets ({{ | | Giant planets ({{tlc|hlist|{{!((}}Jupiter|J]]|{{!((}}Saturn|S]]|{{!((}}Uranus|U]]|{{!((}}Neptune|N]]}}). || Giant planets ({{hlist|[[Jupiter|J]]|[[Saturn|S]]|[[Uranus|U]]|[[Neptune|N]]}}). | ||
|- | |- | ||
| Giant planets ({{ | | Giant planets ({{tlc|hlist|class{{=}}inline|{{!((}}Jupiter|J]]|{{!((}}Saturn|S]]|{{!((}}Uranus|U]]|{{!((}}Neptune|N]]}}). || Giant planets ({{hlist|class=inline|[[Jupiter|J]]|[[Saturn|S]]|[[Uranus|U]]|[[Neptune|N]]}}). | ||
|- | |- | ||
| {{ | | {{tlc|hlist|Winner|Runner-up|Third place|indent{{=}}2}} || {{hlist|Winner|Runner-up|Third place|indent=2}} | ||
|- | |- | ||
| {{ | | {{tlc|hlist|Winner|Runner-up|Third place|item_style{{=}}color:blue;}} || {{hlist|Winner|Runner-up|Third place|item_style=color:blue;}} | ||
|- | |- | ||
| {{ | | {{tlc|hlist|Winner|Runner-up|Third place|item1_style{{=}}background-color:yellow;|item2_style:background-color:silver;}} || {{hlist|Winner|Runner-up|Third place|item1_style=background-color:yellow;|item2_style=background-color:silver;}} | ||
|} | |} | ||
Line 52: | Line 53: | ||
{{tls|hlist}} will produce [[Wikipedia:Linter|Linter]] errors if placed inside a template that uses {{tag|span}} tags, such as {{tl|small}}, {{tl|resize}}, etc. To avoid this, use the substitutions from the table below: | {{tls|hlist}} will produce [[Wikipedia:Linter|Linter]] errors if placed inside a template that uses {{tag|span}} tags, such as {{tl|small}}, {{tl|resize}}, etc. To avoid this, use the substitutions from the table below: | ||
{| class="wikitable | {| class="wikitable" | ||
! Incorrect markup !! Correct markup | ! Incorrect markup !! Correct markup | ||
|- | |- | ||
Line 116: | Line 117: | ||
"label": "Indent", | "label": "Indent", | ||
"description": "the number of tabs to indent the list.", | "description": "the number of tabs to indent the list.", | ||
"type": " | "type": "number", | ||
"default": "0", | "default": "0", | ||
"required": false | "required": false | ||
Line 128: | Line 129: | ||
<!-- Categories below this line, please --> | <!-- Categories below this line, please --> | ||
[[Category: | [[Category:List templates]] | ||
}}}}</includeonly> | }}}}</includeonly> |
Latest revision as of 02:20, 20 August 2023
It contains usage information, categories and other content that is not part of the original template page.
|
This template uses Lua: |
This template uses TemplateStyles: |
This template creates horizontal lists. Each item in the list may be individually styled with CSS.
Usage
Basic usage
{{hlist
All parameters
{{hlist
| first item
| second item
| third item
|
| class = class for div tag
| style = style for div tag
| list_style = style for ul tag
| item_style = style for all li tags
| item1_style = style for first li tag
| item2_style = style for second li tag
|
| indent = the number of tabs to indent
}}
| first item
| second item
| third item
|
| class = class for div tag
| style = style for div tag
| list_style = style for ul tag
| item_style = style for all li tags
| item1_style = style for first li tag
| item2_style = style for second li tag
|
| indent = the number of tabs to indent
}}
Parameters
- Positional parameters (
|1=
,|2=
,|3=
...) - these are the list items. If no list items are present, the module will output nothing.
|class=
- a custom class for the
<div>...</div>
tags surrounding the list. Set toinline
when using {{hlist}} inside text. |style=
- a custom CSS style for the
<div>...</div>
tags surrounding the list, e.g.font-size: 90%;
. |list_style=
- a custom CSS style for the
<ul>...</ul>
tags around the list. The format is the same as for the|style=
parameter. |item_style=
- a custom CSS style for all of the list items (the
<li>...</li>
tags). The format is the same as for the|style=
parameter. |item1_style=
,|item2_style=
,|item3_style=
, ...- custom CSS styles for each of the list items. The format is the same as for the
|style=
parameter. |indent=
- the number of tabs to indent the list. Default value is 0.
Examples
Markup | Renders As |
---|---|
{{hlist|entry1|entry2|entry3|entry4|entry5|entry6|entry7|entry8|entry9}} |
|
Giant planets ({{hlist|[[Jupiter|J]]|[[Saturn|S]]|[[Uranus|U]]|[[Neptune|N]]}} ). |
Giant planets (). |
Giant planets ({{hlist|class=inline|[[Jupiter|J]]|[[Saturn|S]]|[[Uranus|U]]|[[Neptune|N]]}} ). |
Giant planets (). |
{{hlist|Winner|Runner-up|Third place|indent=2}} |
|
{{hlist|Winner|Runner-up|Third place|item_style=color:blue;}} |
|
{{hlist|Winner|Runner-up|Third place|item1_style=background-color:yellow;|item2_style:background-color:silver;}} |
|
Avoiding Linter errors
{{hlist}} will produce Linter errors if placed inside a template that uses <span>...</span>
tags, such as {{small}}, {{resize}}, etc. To avoid this, use the substitutions from the table below:
Incorrect markup | Correct markup |
---|---|
{{small|{{hlist|...}}}} |
{{hlist|...|style=font-size:85%}}
|
{{resize|{{hlist|...}}}} |
{{hlist|...|style=font-size:90%}}
|
{{resize|x%|{{hlist|...}}}} |
{{hlist|...|style=font-size:x%}}
|
{{nowrap|{{hlist|...}}}} |
{{hlist|...|style=white-space: nowrap}}
|
See Also
- {{Bulleted list}}
- {{Flowlist}}
- {{Ordered list}}
TemplateData
For the creation of horizontal lists.
Parameter | Description | Type | Status | |
---|---|---|---|---|
Positional parameters | 1 2 3 4 | The list items go here. | String | required |
Class | class | A class for the <div>.
| String | optional |
Style | style | CSS style for the <div>.
| String | optional |
List Style | list_style | CSS style for the <ul>. | String | optional |
Item Style | item_style | Custom CSS style for all of the list items. | String | optional |
ItemN Style | itemN_style | Custom CSS styles for each of the list items. Where N is the item number. | String | optional |
Indent | indent | the number of tabs to indent the list.
| Number | optional |