v50 Steam/Premium information for editors
  • v50 information can now be added to pages in the main namespace. v0.47 information can still be found in the DF2014 namespace. See here for more details on the new versioning policy.
  • Use this page to report any issues related to the migration.
This notice may be cached—the current version can be found here.

Difference between revisions of "Template:3-way progress bar"

From Dwarf Fortress Wiki
Jump to navigation Jump to search
(Created page with "<center style="padding:none; margin:none;"> <div style="width:{{{width|100%}}}; padding:none; margin:none;"> <div style=" border: 1px solid {{{border|#ac7}}}; padding:1px; ove...")
 
m (OddballJoe moved page User:OddballJoe/Sandbox/ProgressBar to Template:3-way progress bar: Ready to move out of userspace)
 
(3 intermediate revisions by the same user not shown)
Line 1: Line 1:
<center style="padding:none; margin:none;">
+
<noinclude>To produce a progress bar with sections of relative size 10, 20, and 30: <code><nowiki>{{ProgressBar|10|20|30|text=mytext}}</nowiki></code></noinclude><center style="padding:none; margin:none;">
 
<div style="width:{{{width|100%}}}; padding:none; margin:none;">
 
<div style="width:{{{width|100%}}}; padding:none; margin:none;">
 
<div style=" border: 1px solid {{{border|#ac7}}}; padding:1px; overflow:hidden; background:{{{backbg|#F9F9F9}}}; position:relative; height:{{{height|18}}}px;border-top-left-radius:4px; -moz-border-radius-topleft:4px; -webkit-border-top-left-radius:4px; border-bottom-right-radius:4px; -moz-border-radius-bottomright:4px; -webkit-border-bottom-right-radius:4px;">
 
<div style=" border: 1px solid {{{border|#ac7}}}; padding:1px; overflow:hidden; background:{{{backbg|#F9F9F9}}}; position:relative; height:{{{height|18}}}px;border-top-left-radius:4px; -moz-border-radius-topleft:4px; -webkit-border-top-left-radius:4px; border-bottom-right-radius:4px; -moz-border-radius-bottomright:4px; -webkit-border-bottom-right-radius:4px;">
<span style="width:{{#expr: ({{{1|0}}}+{{{2|0}}})/({{{1|0}}}+{{{2|0}}}+{{{3|100}}})}}%; height:100%; border-right: 1px solid {{{border|#ac7}}}; background:{{{barbg|{{{bg|#cce6b3}}}}}}; float:left; padding:0; margin:0; position:absolute; top: 0px; left: 0px;"></span>
+
<span style="width:{{#expr: 100*({{{1|0}}}+{{{2|0}}})/({{{1|0}}}+{{{2|0}}}+{{{3|100}}})}}%; height:100%; border-right: 1px solid {{{border|#ac7}}}; background:{{{barbg|{{{bg|#cce6b3}}}}}}; float:left; padding:0; margin:0; position:absolute; top: 0px; left: 0px;"></span>
<span style="width:{{#expr: ({{{1|0}}})/({{{1|0}}}+{{{2|0}}}+{{{3|100}}})}}%; height:100%; border-right: 1px solid {{{border|#ac7}}}; background:{{{barbg|{{{bg|#ace6b3}}}}}}; float:left; padding:0; margin:0; position:absolute; top: 0px; left: 0px;"></span>
+
<span style="width:{{#expr: 100*({{{1|0}}})/({{{1|0}}}+{{{2|0}}}+{{{3|100}}})}}%; height:100%; border-right: 1px solid {{{border|#ac7}}}; background:{{{barbg|{{{bg|#ace6b3}}}}}}; float:left; padding:0; margin:0; position:absolute; top: 0px; left: 0px;"></span>
 
<span style="height:100%; padding:0; margin:0; position:absolute; top:0px; left: 10px; font-size:12px; line-height:18px;  text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.75);"><small>{{{text|}}}</small></span>
 
<span style="height:100%; padding:0; margin:0; position:absolute; top:0px; left: 10px; font-size:12px; line-height:18px;  text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.75);"><small>{{{text|}}}</small></span>
 
</div></div></center>
 
</div></div></center>

Latest revision as of 06:47, 18 January 2023

To produce a progress bar with sections of relative size 10, 20, and 30: {{ProgressBar|10|20|30|text=mytext}}