(add bar_class) |
(change background-color to background) |
||
| Line 2: | Line 2: | ||
<div>{{{1|46}}} / {{{2|200}}} ({{#expr: ({{{1|46}}} / {{{2|200}}}) * 100 round 0 }}%)</div> | <div>{{{1|46}}} / {{{2|200}}} ({{#expr: ({{{1|46}}} / {{{2|200}}}) * 100 round 0 }}%)</div> | ||
<div style="background-color:none; width:100%; height:{{{height|2em}}}; border:1px black solid; box-sizing:border-box;> | <div style="background-color:none; width:100%; height:{{{height|2em}}}; border:1px black solid; box-sizing:border-box;> | ||
<div style="background | <div style="background:{{{color|cyan}}}; height:100%; border-right:1px black solid; box-sizing:border-box; width:{{#expr: ({{{1|46}}} / {{{2|200}}}) * 100 round 0 }}%" class="{{{bar_class|}}}"> | ||
</div></div> | </div></div> | ||
</div><noinclude> | </div><noinclude> | ||
Latest revision as of 03:55, 13 December 2024
46 / 200 (23%)
Shows a progress bar, comparing one value to a total.
| Parameter | Description | Type | Status | |
|---|---|---|---|---|
| 1st value | 1 | The first value. | Number | required |
| Total | 2 | The total. | Number | required |
| Height | height | Customise the height of the bar.
| String | optional |
| Bar color | color | Customise the color of the bar.
| String | optional |
| CSS class | class | Add CSS classes to the main div containing all parts of the bar, including the preceding number label. | String | optional |
| Bar CSS class | bar_class | Add CSS classes to the colored part of the bar. | String | optional |