Template:NavBar: Difference between revisions
Jump to navigation
Jump to search
Navigation bar
THIS TEMPLATE SHOULD NOT BE EDITED UNLESS ABSOLUTELY NESSESARY
Navigation bar
Navigation bar
m (I'm dumb and this is a better solution) |
m (Slight shading tweak) |
||
| Line 1: | Line 1: | ||
<div style="border-radius: 1em; margin: .35em 1em 1em 0em; background: {{{color|#444}}}; width: 100%; box-shadow: 0 0 .5em #888;"> | <div style="border-radius: 1em; margin: .35em 1em 1em 0em; background: {{{color|#444}}}; width: 100%; box-shadow: {{#if:{{{tabs|}}}|0 0 .5em #888|0 0 .5em #999}};"> | ||
<div style="background: {{{color|#444}}}; border-radius: 1em 1em 0 0; color: #FFF; padding: .3em .3em .3em .3em; font-size: 110%;"><center><span style="float:left; color: #FFF; margin-left: .42em;">{{#fas:compass}}</span>'''Navigation bar'''<span style="float:right; color: #FFF; margin-right: 0.42em;">{{#fas:compass}}</span></center></div> | <div style="background: {{{color|#444}}}; border-radius: 1em 1em 0 0; color: #FFF; padding: .3em .3em .3em .3em; font-size: 110%;"><center><span style="float:left; color: #FFF; margin-left: .42em;">{{#fas:compass}}</span>'''Navigation bar'''<span style="float:right; color: #FFF; margin-right: 0.42em;">{{#fas:compass}}</span></center></div> | ||
<div style="background: #FFF; border-radius: 0 0 1em 1em;"> | <div style="background: #FFF; border-radius: 0 0 1em 1em;"> | ||
Revision as of 11:50, 12 March 2023
How to use this template
This template has several parameters and all of them will be displayed in the example below.
colorControls the color in this template.tabsControls the lower open box on this template, input for this is left open but should be used to create buttons to link to different parts of the wiki. See The example for how to do this.
Use case examples
{{Template:NavBar
| color = #005C53
| tabs = PLACEHOLDER!
}}
These parameters will result in the following:
PLACEHOLDER!
A slightly more advanced example
{{Template:NavBar
| color = #005C53
| tabs =
<div style="display:flex;">
<div style="background: #2A96339e; width: 33.3%; border-radius: 0 0 0 1em;">TEST BUTTON 1</div>
<div style="background: #BA56569e; width: 33.3%; border-radius: 0 0 0 0;">TEST BUTTON 2</div>
<div style="background: #127BB79e; width: 33.4%; border-radius: 0 0 1em 0;">TEST BUTTON 3</div>
</div>
}}
These parameters will result in the following:
TEST BUTTON 1
TEST BUTTON 2
TEST BUTTON 3