Template:Composition bar/doc: Difference between revisions

Content added Content deleted

Inline

Latest revision as of 21:11, 19 May 2021

This is a documentation subpage for Template:Composition bar.
It contains usage information, categories and other content that is not part of the original template page.

This template is used on approximately 7,100 pages and changes may be widely noticed. Test changes in the template's /sandbox or /testcases subpages, or in your own user subpage. Consider discussing changes on the talk page before implementing them.

This template displays the numeric composition of a thing in terms of its sub-units. For example, it is frequently used as part of {{Infobox political party}} to show the number of seats a given political party holds in a legislature. A single line, flexible width version of this template is available at Template:Composition bar compact. A textless, single line, flexible width version of this template is available at Template:Composition bar textless.

Usage

{{Composition bar|amount|total|bar-color|options...}}

amount: The first parameter is the number of sub-units.
total: The second parameter is the total number of sub-units possible.
bar-color: (default is light grey) The third parameter is the background color of the left part of the bar - a valid web color, which can be specified by name, as a hex triplet (#rrbbgg), or rgb triplet (rgb(0–255,0–255,0–255)).
In the case of political parties, most will have their logo color available in {{political party/meta/color}} templates.

Additional display options:

background-color=...: (default is transparent) is the background color of the right part of the bar - a valid web color.
border=...: (default is medium grey) is the color of the border, or "none" for no border
width=...: (default is 100px) a width value for the bar, such as "100%" or "8em" (unitless numbers are interpreted as px)
per=...: (default is false), when set to any value (true), adds a percentage to the bar as well
ref=...: (default is blank), may be used to add a reference/citation for the numbers.

Examples

Code	Result
`{{Composition bar\|50\|100\|red}}`	50 / 100
`{{Composition bar\|50\|100\|red\|background-color=#DDD\|border=none}}`	50 / 100
`{{Composition bar\|50\|100\|#99F\|width=85%}}`	50 / 100
`{{Composition bar\|50\|100\|{{Green Party (UK)/meta/color}}}}`	50 / 100
`{{Composition bar\|50\|100\|rgb(255,255,16)}}`	50 / 100
`{{Composition bar\|75\|100\|#FF0}}`	75 / 100
`{{Composition bar\|40\|100\|#F00\|per=1}}`	40 / 100 (40%)
`{{Composition bar\|90\|100\|#F0F0F0\|per=1\|background-color=#F00}}`	90 / 100 (90%)
`{{Composition bar\|90\|100\|#F0C\|per=1}}`	90 / 100 (90%)
`{{Composition bar\|0\|26\|hex=#00BFFF\|per=1}}`	0 / 26 (0%)

TemplateData

This is the TemplateData documentation for this template used by VisualEditor and other tools; see the monthly parameter usage report for this template.

TemplateData for Composition bar

A composition bar.

Template parameters
Parameter		Description	Type	Status
1	`1`	The number of sub-units.	Line	required
2	`2`	The total number of sub-units possible.	Line	required
3	`3` `hex`	The background color of the left part of the bar - a valid web color, which can be specified by name, as a hex triplet (#rrbbgg), or rgb triplet (rgb(0–255,0–255,0–255)). In the case of political parties, most will have their logo color available in {{political party/meta/color}} templates. Default #CCCCCC	Line	optional
Background color	`background-color`	The background color of the right part of the bar - a valid web color. Default transparent	Line	optional
Border color	`border` `border-color`	The color of the border, or 'none' for no border Default #AAAAAA	Line	optional
Width	`width`	The width of the bar with units, such as 100% or 10em (unitless numbers are interpreted as px) Default 100px	Line	optional
Show percent	`per`	When set to 1 (true), adds a percentage to the bar as well Default 0	Line	optional

@@ Line 1: / Line 1: @@
 {{Documentation subpage}}
-<!-- Categories go where indicated at the bottom of this page, please; interwikis go to Wikidata (see also: [[Wikipedia:Wikidata]]) -->
+<!-- Add categories where indicated at the bottom of this page and interwikis at Wikidata -->
 {{high-use| 4913 }}
-This template displays the numeric composition of a thing in terms of its sub-units. For example, it is frequently used as part of {{tl|Infobox political party}} to show the number of seats a given political party holds in a legislature.
+This template displays the numeric composition of a thing in terms of its sub-units. For example, it is frequently used as part of {{tl|Infobox political party}} to show the number of seats a given political party holds in a legislature. A single line, flexible width version of this template is available at [[Template:Composition bar compact]]. A textless, single line, flexible width version of this template is available at [[Template:Composition bar textless]].
 == Usage ==
- <nowiki>{{</nowiki>Composition bar|''amount''|''total''|''bar-color''|background-color=''background-color''|per=0/1}}
+ <nowiki>{{</nowiki>Composition bar|''amount''|''total''|''bar-color''|''options...''}}
 ; amount
-: is the number of sub-units
+: The first parameter is the number of sub-units.
 ; total
-: is the total number of sub-units possible
+: The second parameter is the total number of sub-units possible.
 ; bar-color
-: (default is light grey) is the background color of the left part of the bar - a valid [[web colors|web color]], which can be specified by name, as a [[hex triplet]] (#rrbbgg), or rgb triplet (rgb(0–255,0–255,0–255)).<br />In the case of political parties, most will have their logo color available in {{tld|political party/meta/color}} templates.
+: (default is light grey) The third parameter is the background color of the left part of the bar - a valid [[web colors|web color]], which can be specified by name, as a [[hex triplet]] (#rrbbgg), or rgb triplet (rgb(0–255,0–255,0–255)).<br />In the case of political parties, most will have their logo color available in {{tlc|political party/meta/color}} templates.
-; background-color
-: (default is very light grey) is the background color of the right part of the bar - a valid [[web colors|web color]].
-; width
-: is the width of the bar in px.
-; per
-: (default is false), when set to 1 (true), adds a percentage to the bar as well.
+Additional display options:
-The background colour for the right part of the bar may then be too light to give sufficient contrast, in which case the background-color parameter may be used to provide a dark background for that part of the bar. See the first three examples below. [http://snook.ca/technical/colour_contrast/colour.html Snook's Colour Contrast Check] may be used to check compliance with [[WCAG]] guidelines for contrast.
+; background-color=...
+: (default is transparent) is the background color of the right part of the bar - a valid [[web colors|web color]].
+; border=...
+: (default is medium grey) is the color of the border, or "none" for no border
+; width=...
+: (default is 100px) a width value for the bar, such as "100%" or "8em" (unitless numbers are interpreted as px)
+; per=...
+: (default is false), when set to any value (true), adds a percentage to the bar as well
+; ref=...
+: (default is blank), may be used to add a reference/citation for the numbers.
 == Examples ==
@@ Line 31: / Line 35: @@
 | {{Composition bar|50|100|red}}
 |-
-| style="font-size: 95%"| <code><nowiki>{{Composition bar|50|100|red|color=#FFF}}</nowiki></code>
+| style="font-size: 95%"| <code><nowiki>{{Composition bar|50|100|red|background-color=#DDD|border=none}}</nowiki></code>
-| {{Composition bar|50|100|red|color=#FFF}}
+| {{Composition bar|50|100|red|background-color=#DDD|border=none}}
 |-
-| style="font-size: 95%"| <code><nowiki>{{Composition bar|50|100|red|color=#FFF|background-color=#000}}</nowiki></code>
+| style="font-size: 95%"| <code><nowiki>{{Composition bar|50|100|#99F|width=85%}}</nowiki></code>
-| {{Composition bar|50|100|red|color=#FFF|background-color=#000}}
+| {{Composition bar|50|100|#99F|width=85%}}
-|-
-| style="font-size: 95%"| <code><nowiki>{{Composition bar|50|100|#99F}}</nowiki></code>
-| {{Composition bar|50|100|#99F}}
 |-
 | style="font-size: 95%"| <code><nowiki>{{Composition bar|50|100|{{Green Party (UK)/meta/color}}}}</nowiki></code>
@@ Line 46: / Line 47: @@
 | {{Composition bar|50|100|rgb(255,255,16)}}
 |-
-| style="font-size: 95%"| <code><nowiki>{{Composition bar|75|100|#FF0|width=250}}</nowiki></code>
+| style="font-size: 95%"| <code><nowiki>{{Composition bar|75|100|#FF0}}</nowiki></code>
-| {{Composition bar|75|100|#FF0|width=250}}
+| {{Composition bar|75|100|#FF0}}
 |-
-| style="font-size: 95%"| <code><nowiki>{{Composition bar|40|100|#F00|width=300|per=1}}</nowiki></code>
+| style="font-size: 95%"| <code><nowiki>{{Composition bar|40|100|#F00|per=1}}</nowiki></code>
-| {{Composition bar|40|100|#F00|width=300|per=1}}
+| {{Composition bar|40|100|#F00|per=1}}
 |-
-| style="font-size: 95%"| <code><nowiki>{{Composition bar|90|100|#F0F0F0|width=300|per=2|background-color=#F00}}</nowiki></code>
+| style="font-size: 95%"| <code><nowiki>{{Composition bar|90|100|#F0F0F0|per=1|background-color=#F00}}</nowiki></code>
-| {{Composition bar|90|100|#F0F0F0|width=300|per=2|background-color=#F00}}
+| {{Composition bar|90|100|#F0F0F0|per=1|background-color=#F00}}
 |-
-| style="font-size: 95%"| <code><nowiki>{{Composition bar|90|100|#F0C|width=300|per=1}}</nowiki></code>
+| style="font-size: 95%"| <code><nowiki>{{Composition bar|90|100|#F0C|per=1}}</nowiki></code>
-| {{Composition bar|90|100|#F0C|width=300|per=1|color=#FFF}}
+| {{Composition bar|90|100|#F0C|per=1}}
+|-
+| style="font-size: 95%"| <code><nowiki>{{Composition bar|0|26|hex=#00BFFF|per=1}}</nowiki></code>
+| {{Composition bar|0|26|hex=#00BFFF|per=1}}
 |}
@@ Line 81: / Line 85: @@
             "label": "3",
             "description": "The background color of the left part of the bar - a valid web color, which can be specified by name, as a hex triplet (#rrbbgg), or rgb triplet (rgb(0–255,0–255,0–255)).  In the case of political parties, most will have their logo color available in {{political party/meta/color}} templates.",
-            "default": "#CCC",
+            "default": "#CCCCCC",
             "type": "string/line",
             "required": false,
-            "aliases": ["hex"],
+            "aliases": ["hex"]
         },
-        "Background color": {
+        "background-color": {
-            "label": "background-color",
+            "label": "Background color",
             "description": "The background color of the right part of the bar - a valid web color.",
-            "default": "#F0F0F0",
+            "default": "transparent",
             "type": "string/line",
             "required": false
         },
-        "Width": {
+        "border": {
-            "label": "width",
+            "label": "Border color",
-            "description": "The width of the bar in px.",
+            "description": "The color of the border, or 'none' for no border",
+            "default": "#AAAAAA",
+            "type": "string/line",
+            "required": false,
+            "aliases": ["border-color"]
+        },
+        "width": {
+            "label": "Width",
+            "description": "The width of the bar with units, such as 100% or 10em (unitless numbers are interpreted as px)",
             "default": "100px",
             "type": "string/line",
             "required": false
         },
-        "Show Percent": {
+        "per": {
-            "label": "per",
+            "label": "Show percent",
-            "description": "When set to 1 (true), adds a percentage to the bar as well.",
+            "description": "When set to 1 (true), adds a percentage to the bar as well",
             "default": "0",
             "type": "string/line",
@@ Line 118: / Line 130: @@
 <includeonly>{{When on basepage
-| <!-- Categories go below this line, please; interwikis go to Wikidata, thank you! -->
+| <!-- Categories below this line; interwikis at Wikidata -->
 [[Category:Chart, diagram and graph templates]]
 [[Category:Wikipedia progress templates]]

v t e Progress templates
General progress templates	{{Progress bar}} {{Progression}} {{Composition bar}} {{Composition histogram}} {{Percentage bar}} {{Percent-done}} {{Progress meter}} {{Percentile}} {{Stacked bar}}
Specific-use templates	{{Backlog progress bar}} {{Progress box}} {{Stage short}} {{Progression rainbow}} {{WikiProject assessment progression}}
Category List (partial)

Template:Composition bar/doc: Difference between revisions

Latest revision as of 21:11, 19 May 2021

Contents

Usage

Examples

TemplateData

See also

Navigation menu

Template:Composition bar/doc: Difference between revisions

Latest revision as of 21:11, 19 May 2021

Usage

Examples

TemplateData

See also

Navigation menu

Search