Template:Hlist/doc: Difference between revisions

From HIBIKIFORUM
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
|-
|-
| {{tji|hlist|entry1|entry2|entry3|entry4|entry5|entry6|entry7|entry8|entry9}} || {{hlist|entry1|entry2|entry3|entry4|entry5|entry6|entry7|entry8|entry9}}
| {{tlc|hlist|entry1|entry2|entry3|entry4|entry5|entry6|entry7|entry8|entry9}} || {{hlist|entry1|entry2|entry3|entry4|entry5|entry6|entry7|entry8|entry9}}
|-
|-
| Giant planets ({{tji|hlist|{{!(n(}}Jupiter{{!}}J]]|{{!(n(}}Saturn{{!}}S]]|{{!(n(}}Uranus{{!}}U]]|{{!(n(}}Neptune{{!}}N]]}}). || Giant planets ({{hlist|[[Jupiter|J]]|[[Saturn|S]]|[[Uranus|U]]|[[Neptune|N]]}}).
| 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 ({{tji|hlist|class:inline|{{!(n(}}Jupiter{{!}}J]]|{{!(n(}}Saturn{{!}}S]]|{{!(n(}}Uranus{{!}}U]]|{{!(n(}}Neptune{{!}}N]]}}). || Giant planets ({{hlist|class=inline|[[Jupiter|J]]|[[Saturn|S]]|[[Uranus|U]]|[[Neptune|N]]}}).
| 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]]}}).
|-
|-
| {{tji|hlist|Winner|Runner-up|Third place|indent:2}} || {{hlist|Winner|Runner-up|Third place|indent=2}}
| {{tlc|hlist|Winner|Runner-up|Third place|indent{{=}}2}} || {{hlist|Winner|Runner-up|Third place|indent=2}}
|-
|-
| {{tji|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|item_style{{=}}color:blue;}} || {{hlist|Winner|Runner-up|Third place|item_style=color:blue;}}
|-
|-
| {{tji|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;}}
| {{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" style="margin:auto"
{| 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": "string",
       "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:Templates]]
[[Category:List templates]]
[[Category:Formatting Templates]]
}}}}</includeonly>
}}}}</includeonly>

Latest revision as of 02:20, 20 August 2023

Light bulb.png }}
It contains usage information, categories and other content that is not part of the original template page.


This template creates horizontal lists. Each item in the list may be individually styled with CSS.

Usage

Basic usage

{{hlist|first item|second item|third item|...}}

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

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 to inline 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}}
  • 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}}
  • Winner
  • Runner-up
  • Third place
{{hlist|Winner|Runner-up|Third place|item_style=color:blue;}}
  • Winner
  • Runner-up
  • Third place
{{hlist|Winner|Runner-up|Third place|item1_style=background-color:yellow;|item2_style:background-color:silver;}}
  • Winner
  • Runner-up
  • Third place

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

TemplateData

For the creation of horizontal lists.

Template parameters

ParameterDescriptionTypeStatus
Positional parameters1 2 3 4

The list items go here.

Stringrequired
Classclass

A class for the <div>.

Suggested values
inline
Stringoptional
Stylestyle

CSS style for the <div>.

Suggested values
font-size
Stringoptional
List Stylelist_style

CSS style for the <ul>.

Stringoptional
Item Styleitem_style

Custom CSS style for all of the list items.

Stringoptional
ItemN StyleitemN_style

Custom CSS styles for each of the list items. Where N is the item number.

Stringoptional
Indentindent

the number of tabs to indent the list.

Default
0
Numberoptional