No edit summary |
No edit summary |
||
| Line 8: | Line 8: | ||
<includeonly> | <includeonly> | ||
<div style="width: 100%; height: 20px; background: #e0e0e0; border-radius: 5px; position: relative;"> | <div style="width: 100%; height: 20px; background: #e0e0e0; border-radius: 5px; position: relative;"> | ||
<!-- Background gradient (red to green) --> | |||
<div style="height: 100%; | <div style="height: 100%; | ||
background: linear-gradient(to right, red, yellow, green); | background: linear-gradient(to right, red, yellow, green); | ||
width: | width: 100%; | ||
position: absolute; | position: absolute; | ||
left: 0; | left: 0; | ||
top: 0;"> | top: 0;"> | ||
</div> | |||
<!-- Value bar that moves left or right --> | |||
<div style="height: 100%; | |||
background: #3a8d3a; | |||
position: absolute; | |||
top: 0; | |||
left: 50%; | |||
width: {{#expr: abs(100 * {{{value|0}}})}}%; | |||
transform: translateX({{{value|0}}} * 50%); | |||
border-radius: 5px;"> | |||
</div> | </div> | ||
</div> | </div> | ||
</includeonly> | </includeonly> | ||
Revision as of 04:18, 15 December 2024
Usage:
{{Reputation_Table/Item|value=0.1}}