<includeonlynoinclude>{{Progress bar| progression-text = низкий#vardefine: lpbCurrent |progression = 64% {{| bar-background = #ifexpr: {{{currentff7f4f|0}}} box- {{{maxwidth = 98%|100}text-size = 89%}} &gt; 0 | {{== Examples =='''Simple progress bar, using the first method:'''<pre>{max{Progress bar| progression = 52.4%|100desc = explored}}} |</pre> {{{currentProgress bar|0}progression = 52.4%| desc = explored}} }}}}{{#vardefine'''Styled progress bar, using the second method: lpbProgression |''' <pre>{{{progression Progress bar|min = 10| max = 15 {{#ifexpr: ({{#var:lpbCurrent}} - {{{min|0}}} &gt;current = 0) and 13| mode = value| desc = maxed titles| progression-text = [[People Know Me]] ({{{max2)|100}}} box- {{{minwidth = 15em|0box-border = 1px dotted black| bar-background = #99CC66| text-size = 8pt}}} &gt; 0) |</pre> {{#expr: (({{#var:lpbCurrent}} - {{{Progress bar| min= 10|0}}}) / ({{{max= 15| current = 13|100}}} mode = value| desc = maxed titles| progression- {{{mintext = [[People Know Me]] (2)|0}}})) * 100 round 1}}% box-width = 15em|box-border = 1px dotted black 0%| bar-background = #99CC66 }}| text-size = 8pt }}}}}{{#vardefine: lpbTooltipDisplayMode | {{{tooltip'''A few combinations of both calculation methods and the <code>desc</code>, <code>progression-display-mode |text</code> and <code>title</code> parameters:''' <pre>{{#if: {{#var:pb-tooltip-display-mode}} Progress bar| min = 10| max = 15|current = 13 {{#var:pb-tooltip-display-mode}} |desc = maxed titles percentage| title = People Know Me (2)| box-width = 15em }}| text-size = 8pt }}}</pre>}}{{Progress bar#vardefine: lpbTooltipText |min = 10| max = 15 {{#switch: {{#var:lpbTooltipDisplayMode}} |current = 13 percentage | desc = {{formatnum:{{#var:lpbProgression}}}}&nbsp; |maxed titles current | title = {{formatnum:{{{currentPeople Know Me (2)| box-width = 15em|0text-size = 8pt}}}}}&nbsp; | remaining = {{formatnum:{{#expr: { <pre>{{Progress bar| min = 10| max= 15|100}}} current = 13| desc = maxed titles| progression-text = People Know Me (2)| box- {{{currentwidth = 15em|0text-size = 8pt}}}}}}}&nbsp; </pre>{{Progress bar|min = 10 ratio | max = {{formatnum:{{{15| current= 13|0desc = maxed titles| progression-text = People Know Me (2)| box-width = 15em| text-size = 8pt}}}}} /   <pre>{{formatnum:{{{maxProgress bar|100}}}}}&nbsp; min = 10|max = 15 }}{{{tooltip-text |current = 13 {{#if: {{#var:pb-tooltip-text}} |mode = value {{#var:pb-tooltip-text}} |desc = maxed titles }}| title = People Know Me (2)| box-width = 15em| text-size = 8pt }}}</pre>}}{{Progress bar#vardefine: lpbBarDisplayMode |min = 10 {{{bar-display-| max = 15| current = 13| mode = value|desc = maxed titles {{#if: {{#var:pb| title = People Know Me (2)| box-barwidth = 15em| text-display-modesize = 8pt}} |  <pre>{{#var:pb-Progress bar-display-mode}} | min = 10|max = 15 percentage| current = 13 }}| mode = value }}}| desc = maxed titles}}{{#vardefine: lpbBarText | {{#switch: {{#var:lpbBarDisplayMode}} progression-text = People Know Me (2)|box-width = 15em percentage | text-size = 8pt}}</pre>{{formatnum:{{#var:lpbProgression}}}}&nbsp; Progress bar| min = 10|max = 15 | current = {{formatnum:{{{current13| mode = value|0}}}}}&nbsp; desc = maxed titles|progression-text = People Know Me (2) remaining | box-width = {{formatnum:{{#expr: {{{max|015em| text-size = 8pt}}} -   <pre>{{{currentProgress bar|0}}}}}}}&nbsp; progression = 14.7%|desc = explored ratio | progression-text = {{formatnum:{{{currentexploration|0}}}box-width = 15em| text-size = 8pt}} </ pre>{{formatnum:{{{maxProgress bar|100}}}}}&nbsp; progression = 14.7%|desc = explored }}{{{bar| progression-text = exploration|box-width = 15em| text-size = 8pt {{#if: {{#var:pb-bar-text}} |  <pre>{{#var:pb-Progress bar-text}} |progression = 14.7% }}| desc = explored| title = exploration| box-width = 15em| text-size = 8pt }}}</pre>}}{{Progress bar#vardefine: lpbBarBackground | {{{bar-background progression = 14.7%|desc = explored {{#if: {{#var:pb-bar-background}} |title = exploration {{#var:pb| box-barwidth = 15em| text-background}} | #AAD5FFsize = 8pt }} }}}}}{{== Parameters ==#vardefine: lpbBarCustomStyle | {{{Here is the list of accepted parameters and their effect on the progress bar-custom-style | {{#if: {{#var:pb-. There are two ways of indicating the value (percentage) represented by the bar-custom-style}} | {{#var:pb-bar-custom-style}} | }} }}}}}{{#vardefine: lpbBoxBackground |. The first method uses the <code>progression</code> parameter, while the second uses the <code>min</code>, <code>max</code> and <code>current</code> parameters. Whatever method you use, you can use the <code>progression-text</code> parameter to display any text on the bar, or use the <code>desc</code> parameter which writes down the percentage represented by the bar before the text contained in this parameter. See examples below.  {{{box-background |; progression: Indicates the percentage represented by the progression bar. {{#if: {{#var* ex:pb-box-background}} |<code>74.2%</code> {{#var:pb-box-background}} |* default value: <code>0%</code> white }}; min }}}: Indicates the value of the lower bound of the range represented by this bar.}}{{#vardefine: lpbBoxBorder | {{{box-border |* ex: <code>10</code> {{#if: {{#var* default value:pb-box-border}} |<code>0</code> {{#var:pb-box-border}} | 1px solid black* note: if the <code>progression</code> parameter is used, the <code>min</code> parameter is discarded. }} }}}; max}}{{: Indicates the value of the upper bound of the range represented by this bar.#vardefine: lpbBoxMargin | {{{box-margin |* ex: <code>15</code> {{#if: {{#var* default value:pb-box-margin}} |<code>100</code> {{#var:pb-box-margin}} |* note: if the <code>progression</code> parameter is used, the <code>max</code> parameter is discarded. 1px }}; current }}}: Indicates the value of the position into the range represented by this bar. This number must be contained between <code>min</code> and <code>max</code>.}}{{#vardefine: lpbBoxPadding | {{{box-padding |* ex: <code>13</code> {{#if: {{#var* default value:pb-box-padding}} |<code>0</code> {{#var:pb* note: if the <code>progression</code> parameter is used, the <code>current</code> parameter is discarded. ; progression-box-padding}} |text 1px: Indicates the text written on the progression bar. If not specified, the text is determined automatically. See explanations below. }}:* ex: <code>People know me</code> }}}}}{{:* default value: <code>0%</code>#vardefine: lpbBoxWidth | {{{box-width |; title {{#if: {{#varIndicates the text displayed in the tooltip. If not specified, the text is determined automatically. See explanations below.:* ex:pb-box-width}} |<code>People know me</code> {{#var:pb-box-width}} | 100* default value: <code>0%</code> }} }}}}}{{; mode#vardefine: lpbBoxCustomStyle | {{{box-custom-style |Indicates which of the percentage or the current value is to be displayed on the bar and the tooltip. Used only if the second method is used. {{#if: {{#var:pb-box-custom-style}} |* specify <code>mode=value</code> to make the text display the value of the <code>current</code> parameter instead of the calculated percentage {{#var:pb-box-custom-style}} |* to get the default behavior, simply don't use this parameter  }}; desc }}}: Indicates the text to be displayed on the bar behind the actual percentage represented by the bar.}}{{:* ex: <code>explored</code>#vardefine: lpbTextColor |* default value: none {{{text-color | {{#if: {{#var* note:pbthe <code>desc</code> parameter is overridden by the <code>progression-text-color}} |</code> and the <code>title</code> parameters respectively.  {{#var:pb; bar-text-color}} |background black: Color used as the background of the progression bar. }}:* ex: <code>red</code> or <code>#328A9C</code> }}}:* default value: <code>#AAAAFF</code>}}{{#vardefine; box-background: lpbTextSize | {{{text-size |Color used as the background of the block in which the bar is located. {{#if: {{#var* ex:pb-text-size}} |<code>red</code> or <code>#328A9C</code> {{#var:pb* default value: <code>white</code> ; box-text-size}} |border small: Style of the border of the block in which the bar is located. }}:* ex: <code>2px dotted red</code> }}}}}{{:* default value: <code>1px solid black</code>#vardefine: lpbTextWeight | {{{text; box-weight |margin {{#if: {{#varIndicates how far the block in which the bar is located must be from the text around it.:* ex:pb-text-weight}} |<code>5px</code> {{#var:pb-text-weight}} |* default value: <code>1px</code> bold }}; box-padding }}}: Indicates the width of the space between the progression bar and the border of the block around it.}}{{#if: {{{title|}}} | * ex: <code>0<span style="font-size/code>:{{#var* default value:lpbTextSize}}<code>1px</code> ;fontbox-weightwidth: Indicates the width of the block in which the bar is located.:{{#var* ex:lpbTextWeight}}"<code>15em</code>{{{title|}}}:* default value: <code>100%</spancode> |}}<div role="progressbar" aria; text-valuemin="{{{min|0}}}" ariacolor: Color of the text written in the center of the bar.:* default value: <code>black</code> ; text-valuemax="{{{max|100}}}" ariasize: Size of the text written in the center of the bar.:* default value: <code>small</code> ; text-valuenowweight: Weight of the text written in the center of the bar.:* default value: <code>bold</code> ; box-style: Any additional values inside the style="{{{current|{{{progression|0}}}}}}" aria" attribute for the box. Values here overwrite default values. ; bar-valuetextstyle: Any additional values inside the style="{{#var:lpbBarText}}" " attribute for the bar. Values here overwrite default values. </noinclude><includeonly><div title="{{#var:lpbTooltipText}}" style="background:{title|{#var:lpbBoxBackground}};border:{{progression|<!-- -->{{#var:lpbBoxBorder}};marginifeq:{{#var:lpbBoxMargin{mode|}};padding:}|value|{{{#var:lpbBoxPaddingcurrent|0}}};width:|<!-- -->{{#var:lpbBoxWidth}};colorifexpr:({{#var:lpbTextColor{current|0}}};font-size:{{#var:lpbTextSize{min|0}}}&gt;font-weight:=0) and ({{{#var:lpbTextWeightmax|100}}};line-height:1.25em;{{#var:lpbBoxCustomStyle{min|0}}}">&gt;0)|<div style="margin!-- -->{{#expr:(({{{current|0;padding:0;position:relative;"><div style="margin:}}}-{{{min|0}}})/({{{max|100}}}-{{{min|0}}}))*100 round 1}}%|0%}}}}}}} {{{desc|}}}}}}" style="background: {{{box-background|}}};padding:0;width:{{#var:lpbProgression}};background:{{#var:lpbBarBackground} border: {{{box-border|1px solid black}}}; margin: {{{box-margin|1px}}}; padding: {{{box-padding|1px}}}; width: {{{box-width|100%}}}; color: {{{text-color|black}}}; text-shadow: 0px 0px 5px white; font-size: {{{text-size|small}}}; font-weight: {{{text-weight|bold}}}; line-height: 1.25em; {{{box-style|}}}"><!-- --><div style="margin: 0; padding:0; position:relative;"><!-- --><div style="margin: 0; padding: 0; width: 100%; position: absolute; top: 0; z-index: 1; background: transparent; -ms-linear-gradient(top, #4b4b4b 0%, #919191 45%, #aeaeae 50%, #939393 55%, #aaaaaa 100%); linear-gradient(to bottom, #4b4b4b 0%, #919191 45%, #aeaeae 50%, #939393 55%, #aaaaaa 100%); border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; text-align: center;"><!-- -->{{{progression-text|{{{progression|<!-- -->{{#ifeq:{{{mode|}}}|value|{{{current|0}}}|<!-- -->{{#ifexpr:({{{current|0}}}-{{{min|0}}}&gt;=0) and ({{{max|100}}}-{{{min|0}}}&gt;0)|<!-- -->{{#expr:(({{{current|0}}}-{{{min|0}}})/({{{max|100}}}-{{{min|0}}}))*100 round 1}}%|0%}}}}}}} <!-- -->{{{desc|}}}}}}</div><!-- --><div style="margin: 0; padding: 0; width: {{{progression|<!-- -->{{#ifexpr:({{{current|0}}}-{{{min|0}}}&gt;=0) and ({{{max|100}}}-{{{min|0}}}&gt;0)|<!-- -->{{#expr:(({{{current|0}}}-{{{min|0}}})/({{{max|100}}}-{{{min|0}}}))*100 round 1}}%|0%}}}}}; background: {{{bar-background|#AAAAFF}}}; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; height: 1.25em; {{{bar-style|};height:1.25em;{{#var:lpbBarCustomStyle}}">&nbsp;</div><div style="margin:0;padding:0;width:100%;position:absolute;top:0;z-index:1;background-color:transparent;text-align:center;">{{#var:lpbBarText}}</div></div></div></includeonly><noinclude>