Template:Progress bar: Difference between revisions
No edit summary |
m (possible fix) |
||
(17 intermediate revisions by 2 users not shown) | |||
Line 6:
{{#ifeq: {{{header|yes}}} | yes
| <p>
<span style="font-size: {{{size|120%}}};">▼
{{#if: {{{task|}}}| {{{task}}}:<nowiki> </nowiki>}}
▲ <span style="font-size: 120%;">
{{Nowrap|'''{{#expr: ( {{{1|<noinclude>2</noinclude>0}}} / {{{total|100}}}) * 100 round 1}}%'''
</span>▼
{{{text|completed}}}}}
▲ </span>
</p>
}}{{#vardefine:width1|{{#expr: {{{1|<noinclude>2</noinclude>0}}} / {{{total|100}}} * 100}}}}
}}▼
<p style="border:{{{border|1px solid #c8ccd1}}}; padding:{{{padding|1px}}}; overflow:hidden; position:relative; {{#if:{{{margin|}}}|margin:{{{margin|}}};}}">
<span style="
width:
height:
background:{{{color1|#00af32}}};
float:left;
{{#if:{{{shadow|}}}| box-shadow:{{{shadow|}}};}}
"> </span>
<span style="
Line 26 ⟶ 27:
float:left;
"> </span>
{{#arraydefine:pad|{{{padding|1px 1px 1px 1px}}}|/ /}}
{{#ifeq: {{{texture|no}}} | yes
| [[File:BarTexture1.png||link=|class=progress-bar-texture-{{#replace:{{#sub:{{#var:width1}}|0|4}}|.|}}{{{height|4}}}{{#arrayindex:pad|1|0}}]]
{{#css:
.progress-bar-texture-{{#replace:{{#sub:{{#var:width1}}|0|4}}|.|}}{{{height|4}}}{{#arrayindex:pad|1|0}} {
position: absolute;
opacity: {{{opacity|0.3}}};
left:{{#arrayindex:pad|1|0}};
width:{{#var:width1}}%;
height:{{{height|4}}}px;
}
}}}}
{{#if: {{{text2|}}}
| <span style="
position: absolute;
color:{{{color3|black}}};
left: 5px;
line-height: 1;
{{#if:{{{size2|}}}| font-size:{{{size2|}}};}}
{{#if:{{{shadow2|}}}| text-shadow:{{{shadow2|}}};}}
>{{{text2|}}}</span>
▲}}
</p>
</div><noinclude>{{Documentation}}</noinclude>
|
Latest revision as of 04:44, 21 April 2022
20% completed
Usage[]
{{Progress bar|value}}
This template draws a progress bar. By default, the value
to supply as the parameter is the percent, from 0 to 100 (e.g. 1 would mean 1%, .1 would be 0.1%). The text label of the progress bar will always be rounded to the nearest tenth of a percent (rounding up if the hundreds digit is 5; e.g. 50.15 would round to 50.2%). If a value isn't specified or is invalid, the bar displays 0%. Values greater than 100% will display incorrectly, although the text label will be correct.
Optional parameters[]
height
= height of the progress bar in pixels; defaults to 2width
= width of the progress bar; defaults to 75%text
= message to display after %; defaults to: completedtotal
= amount to use as the denominator (instead of 100), allows the template to compute the percentage on the flyheader
= no (or any value other than "yes", which is the default) suppresses the display of the percentage on the top line
Examples[]
Default configuration[]
{{Progress bar|5}}
:
5% completed
With custom header text[]
{{Progress bar|5|text=done}}
:
5% done
Without header text[]
{{Progress bar|80|header=no|text=does not display here}}
:
Custom height and width[]
{{Progress bar|80|height=8|width=50%}}
:
5% completed
Custom total[]
{{Progress bar|5|total=5}}
:
100% completed
Template data[]
Makes a progress bar
Parameter | Description | Type | Status | |
---|---|---|---|---|
Value | 1 | The value that gets divided by the Total, or by 100 if it is missing | Number | required |
Total | total | The total amount that the value is divided by
| Number | optional |
Header | header | Turns the header on or off
| Boolean | optional |
Task | task | This is showed before the percentage
| String | optional |
Text | text | The text that is displayed above the progress bar, after the percentage | String | optional |
Width | width | Width of the bar | Unknown | optional |
Height | height | Height of the bar | Unknown | optional |