Difference between revisions of "Template:StatBar"

From Holdfast: Nations At War
Jump to navigation Jump to search
m
m
 
(2 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
<noinclude>
 
<noinclude>
 
<pre>
 
<pre>
−
{{StatBar|max=125|value=70|bonus=12|width=200|sections=5}}
+
{{StatBar|max=100|value=70|bonus=12|width=200|sections=4|height=10}}
 
</pre>
 
</pre>
−
{{StatBar|max=125|value=70|bonus=12|width=200|sections=5}} Text following
+
'''Example:''' {{StatBar|max=100|value=25|bonus=25|width=200|sections=4|height=16}}Text following
 +
 
 +
Next Line
 
</noinclude>
 
</noinclude>
−
<includeonly>
+
<includeonly><span style="vertical-align:middle;width:{{{width|200}}}px;height:{{{height|16}}}px;position:static;display:inline-block;border:3px inset black">
−
<div style="width:{{{width}}}px;height:16px;position:relative;border:3px;border-style:inset;border-color: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">
−
<div style="z-index=-5;position:absolute;left:0px;top:0px;background-color: grey;width:{{{width}}}px;height:16px"></div>
+
<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">
−
<div style="z-index=1;position:absolute;left:0px;top:0px;background-image: linear-gradient(135deg, rgba(255,110,3,255), rgba(254,249,1,255));width:{{#expr:{{{value}}}*{{{width}}}/{{{max}}} }}px;height:16px"></div>
+
<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">
−
<div style="z-index=2;position:absolute;left:{{#expr:{{{value}}}*{{{width}}}/{{{max}}} }}px;top:0px;background-color: rgba(61,236,74,255);width:{{#expr:{{{bonus}}}*{{{width}}}/{{{max}}} }}px;height:16px"></div>
+
</span></span></span>
 
{{#ifeq:{{{sections}}}|4|
 
{{#ifeq:{{{sections}}}|4|
−
<div style="z-index=3;position:absolute;left:{{#expr:1*{{{width}}}/{{{sections}}} }}px;top:0px;width:3px;height:16px;border-left:3px solid black;"></div>
+
<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;">
−
<div style="z-index=3;position:absolute;left:{{#expr:2*{{{width}}}/{{{sections}}} }}px;top:0px;width:3px;height:16px;border-left:3px solid black;"></div>
+
<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;">
−
<div style="z-index=3;position:absolute;left:{{#expr:3*{{{width}}}/{{{sections}}} }}px;top:0px;width:3px;height:16px;border-left:3px solid black;"></div>
+
<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:({{{width|200}}}/{{{sections}}}) }}px;top:0px;width:0px;height:{{{height|16}}}px;border-left:3px solid black;display:block;">
−
<div style="z-index=3;position:absolute;left:{{#expr:1*{{{width}}}/{{{sections}}} }}px;top:0px;width:3px;height:16px;border-left:3px solid black;"></div>
+
<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;">
−
<div style="z-index=3;position:absolute;left:{{#expr:2*{{{width}}}/{{{sections}}} }}px;top:0px;width:3px;height:16px;border-left:3px solid black;"></div>
+
<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;">
−
<div style="z-index=3;position:absolute;left:{{#expr:3*{{{width}}}/{{{sections}}} }}px;top:0px;width:3px;height:16px;border-left:3px solid black;"></div>
+
<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>}}
−
<div style="z-index=3;position:absolute;left:{{#expr:4*{{{width}}}/{{{sections}}} }}px;top:0px;width:3px;height:16px;border-left:3px solid black;"></div>
+
</span></includeonly>
−
<div style="z-index=10;width:{{{width}}}px;height:16px;position:static:border-right:5px solid red"></div>
 
−
Test1
 
−
}}</div>Test2</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


Retrieved from "https://wiki.holdfastgame.com/index.php?title=Template:StatBar&oldid=1130"