Difference between revisions of "Template:StatBar"
Jump to navigation
Jump to search
m |
m |
||
(One intermediate revision by the same user not shown) | |||
Line 1: | Line 1: | ||
<noinclude> | <noinclude> | ||
<pre> | <pre> | ||
− | {{StatBar|max= | + | {{StatBar|max=100|value=70|bonus=12|width=200|sections=4|height=10}} |
</pre> | </pre> | ||
− | '''Example:''' {{StatBar|max= | + | '''Example:''' {{StatBar|max=100|value=25|bonus=25|width=200|sections=4|height=16}}Text following |
Next Line | Next Line | ||
</noinclude> | </noinclude> | ||
− | <includeonly><span style="vertical-align:middle;width:{{{width|200}}}px;height:{{{height|16}}}px;position:static;display:inline-block;border:3px | + | <includeonly><span style="vertical-align:middle;width:{{{width|200}}}px;height:{{{height|16}}}px;position:static;display:inline-block;border:3px inset black"> |
<span style="z-index=-5;position:relative;left:0px;top:0px;background-color: grey;width:{{{width|200}}}px;height:{{{height|16}}}px;display:inline-block;float:left"> | <span style="z-index=-5;position:relative;left:0px;top:0px;background-color: grey;width:{{{width|200}}}px;height:{{{height|16}}}px;display:inline-block;float:left"> | ||
− | <span style="z-index=1;position:relative;left:0px;top:0px;background-image: linear-gradient(135deg, rgba(255,110,3,255), rgba(254,249,1,255));width:{{#expr:{{{value}}}*{{{width|200}}}/{{{max}}} }}px;height:{{{height|16}}}px;display:inline-block"> | + | <span style="z-index=1;position:relative;left:0px;top:0px;background-image: linear-gradient(135deg, rgba(255,110,3,255), rgba(254,249,1,255));width:{{#expr:({{{value}}}*{{{width|200}}})/{{{max}}} }}px;height:{{{height|16}}}px;display:inline-block"> |
− | <span style="z-index=2;position:relative;left:{{#expr:{{{value}}}*{{{width|200}}}/{{{max}}} }}px;top:0px;background-color: rgba(61,236,74,255);width:{{#expr:{{{bonus}}}*{{{width|200}}}/{{{max}}} }}px;height:{{{height|16}}}px;display:inline-block"> | + | <span style="z-index=2;position:relative;left:{{#expr:({{{value}}}*{{{width|200}}})/{{{max}}} }}px;top:0px;background-color: rgba(61,236,74,255);width:{{#expr:{{{bonus}}}*{{{width|200}}}/{{{max}}} }}px;height:{{{height|16}}}px;display:inline-block"> |
</span></span></span> | </span></span></span> | ||
{{#ifeq:{{{sections}}}|4| | {{#ifeq:{{{sections}}}|4| | ||
− | <span style="z-index=3;position:relative;left:{{#expr: | + | <span style="z-index=3;position:relative;left:{{#expr:({{{width|200}}}/{{{sections}}}) }}px;top:0px;width:0px;height:{{{height|16}}}px;border-left:3px outset black;display:block;"> |
− | <span style="z-index=3;position:relative;left:{{#expr: | + | <span style="z-index=3;position:relative;left:{{#expr:({{{width|200}}}/{{{sections}}})-3 }}px;top:0px;width:0px;height:{{{height|16}}}px;border-left:3px outset black;display:block;"> |
− | <span style="z-index=3;position:relative;left:{{#expr: | + | <span style="z-index=3;position:relative;left:{{#expr:({{{width|200}}}/{{{sections}}})-3 }}px;top:0px;width:0px;height:{{{height|16}}}px;border-left:3px outset black;display:block;"></span></span></span>| |
− | <span style="z-index=3;position:relative;left:{{#expr: | + | <span style="z-index=3;position:relative;left:{{#expr:({{{width|200}}}/{{{sections}}}) }}px;top:0px;width:0px;height:{{{height|16}}}px;border-left:3px solid black;display:block;"> |
− | <span style="z-index=3;position:relative;left:{{#expr: | + | <span style="z-index=3;position:relative;left:{{#expr:({{{width|200}}}/{{{sections}}})-3 }}px;top:0px;width:0px;height:{{{height|16}}}px;border-left:3px solid black;display:block;"> |
− | <span style="z-index=3;position:relative;left:{{#expr: | + | <span style="z-index=3;position:relative;left:{{#expr:({{{width|200}}}/{{{sections}}})-3 }}px;top:0px;width:0px;height:{{{height|16}}}px;border-left:3px solid black;display:block;"> |
− | <span style="z-index=3;position:relative;left:{{#expr: | + | <span style="z-index=3;position:relative;left:{{#expr:({{{width|200}}}/{{{sections}}})-3 }}px;top:0px;width:0px;height:{{{height|16}}}px;border-left:3px solid black;display:block;"></span></span></span></span>}} |
</span></includeonly> | </span></includeonly> |
Latest revision as of 18:49, 21 August 2019
{{StatBar|max=100|value=70|bonus=12|width=200|sections=4|height=10}}
Example: Text following
Next Line