Jump to navigation
Jump to search
m (Cleanup) |
(generalize template) |
||
(13 intermediate revisions by 4 users not shown) | |||
Line 1: | Line 1: | ||
<includeonly> | <includeonly><div style="background-color: {{{outer-color|#d8d8d8}}}; border: 1px solid {{{outer-border|#2f2f2f}}}; overflow: hidden; {{{outer-style|}}}"><div style="width: {{#expr:100*({{{progress|1}}}/{{{total}}})}}%; background-color: {{{inner-color|#b2ff00}}}; color: {{{inner-font|#2f2f2f}}}; margin: 0; white-space: nowrap; padding: 2px; font-size: .9em; {{{inner-style|}}}">{{#if:{{{inner-text|}}}|{{{inner-text}}}|{{#if:{{{units|}}}|{{{progress|1}}} {{{units}}}|{{#expr:100*({{{progress|1}}}/{{{total}}}) round 0}}%}}}}</div></div></includeonly><noinclude> | ||
{{ | {{Documentation}} | ||
[[Category:Templates | [[Category:Templates]]</noinclude> |
Latest revision as of 16:47, 30 May 2012
This page has been transcluded from Template:Progress bar/Documentation.
Usage
This template displays a colored progress bar, visualizing the parameters given.
- Main
- progress: the amount of progress made (numerator)
- total: the total progress allowable (denominator)
- units: the units to display (optional; it's displayed as a percentage if this parameter isn't passed)
- inner-text: custom override of the text to display (overrides units if both are used)
- Styles
- outer-color: color of the background of the bar (default is gray)
- outer-border: color of the border around the progress bar (default is black; use "none" to omit border)
- outer-style: extra styles for the outer progress bar
- inner-color: color of the inner progress bar (default is yellow-green)
- inner-font: color of the text inside
- inner-style: extra styles for the inner progress bar
Examples
Simple | With units |
---|---|
{{progress bar|progress=2|total=10}} |
{{progress bar|progress=2|total=10|units=cookies}} |
Custom text | Different styles |
{{progress bar |progress=2 |total=10 |inner-text=A couple cookies}} |
{{progress bar |progress=2 |total=10 |outer-color=white |outer-border=red |inner-color=black |inner-font=yellow}} |