テンプレート:Tileのソースを表示

<includeonly>{{#vardefine:BG2|white, lightyellow}}<li class="tile_container pseudo-link" style="{{#if:{{{css|}}}|{{#replace:{{{css}}}|;|!important;}}|}} {{#switch:{{BASEPAGENAME}}|{{{caption/link}}}|{{{caption}}}|{{{text}}}|{{{link}}}=color:#000; box-shadow:0 0 8px #397d75; background: -webkit-linear-gradient({{#var:BG2}}); background: -o-linear-gradient({{#var:BG2}}); background: -moz-linear-gradient({{#var:BG2}}); background: linear-gradient({{#var:BG2}});|#default=}}">
<div class="tile_inner">[[File:{{{1|{{{image}}}}}}|75x75px|link=]]<br>{{#if:{{{caption/link|}}}|{{{caption/link}}}|{{#if:{{{caption|}}}{{{text|}}}|{{{caption|{{{text}}}}}}}}}}</div>{{#if:{{{caption/link|}}}|[[{{{caption/link}}}|<span class="link-spanner"></span>]]|{{#if:{{{link|}}}|[[{{{link}}}|<span class="link-spanner"></span>]]|[[:File:{{{1|{{{image}}}}}}|<span class="link-spanner"></span>]]}}}}</li></includeonly><noinclude>

==Usage==
This template provides a custom tiling navigation with icons.

===Usage and Notes===
* '''Image (Parameter 1):''' The image/icon to be displayed.
:: Example: <code><font color="teal">Color Wheel.svg</font></code> or <code>image = <font color="teal">Color Wheel.svg</font></code>
* '''Caption:''' The caption/text to be displayed.
:: Example: <code>caption = <font color="teal">Color IDs</font></code>
* '''Link:''' Hyperlink to follow when clicked.
:: Example: <code>link = <font color="teal">Console Commands</font></code>
:: Note: if no link is defined, it will automatically link to the image shown instead.
* '''Equivalent Caption and Link: ''(Optional)''''' Use only when both the Caption and Link are the same to increase legibility of the code or reduce redundancy.
:: Example: <code>caption/link = <font color="teal">Color IDs</font></code>
:: For instance, <code>caption/link = <font color="teal">Color IDs</font></code>
:::does exactly the same as
:::<code>caption = <font color="teal">Color IDs</font></code>
:::<code>link = <font color="teal">Color IDs</font></code>
* '''CSS: ''(Optional)''''' CSS to affect the entire element at the <nowiki><li></nowiki> html tag encompassing it.
:: Example: <code>css = <font color="teal">color:red; background:pink; font-variant:small-caps;</font></code>
:: You can also change the two-toned background gradient by redefining the color variables within the CSS.
:: Variable BG1 is the normal background, while Variable BG2 is shown when the user is on the same page as the tile links to.
::: Example: <code>css = <font color="teal"><nowiki>{{#vardefine:BG1|pink, #000}} {{#vardefine:BG2|goldenrod, black}}</nowiki></font></code>

<pre>
<ul style="margin:0; margin-top:8px; padding:0; width:100%;">
{{ Tile | Blank.png
 | caption = Example
 | link    = Target Page
 | css     = color:purple;
}}
</ul>
</pre>

<ul style="margin:0; margin-top:8px; padding:0; width:100%;">
{{Tile|Stone Pick.png|caption=Example|link=}}
{{Tile|Stone Pick.png|caption=You're Here!|link=}}
{{Tile|Stone Pick.png|caption=Custom Css|link=|css=background:pink; color:purple; border:1px dotted purple; font-variant:small-caps;}}
{{Tile|Stone Pick.png|caption=Custom Css|link=|css=background:none; color:purple; border:none; font-family:Georgia;}}
{{Tile|Stone Pick.png|caption=Custom BG|link=|css={{#vardefine:BG1|lightgray, black}} color:white;}}
</ul>

----

<ul style="margin:0; margin-top:8px; padding:0; width:100%;">
{{Tile|Artifact of the Clever.png|caption=Clever|link=Artifact of the Clever}}
{{Tile|Artifact of the Devourer.png|caption=Devourer|link=Artifact of the Devourer}}
{{Tile|Artifact of the Hunter.png|caption=Hunter|link=Artifact of the Hunter}}
{{Tile|Artifact of the Immune.png|caption=Immune|link=Artifact of the Immune}}
{{Tile|Artifact of the Massive.png|caption=Massive|link=Artifact of the Massive}}
{{Tile|Artifact of the Pack.png|caption=Pack|link=Artifact of the Pack}}
{{Tile|Artifact of the Skylord.png|caption=Skylord|link=Artifact of the Skylord}}
{{Tile|Artifact of the Strong.png|caption=Strong|link=Artifact of the Strong}}
</ul>

----

<ul style="margin:0; margin-top:8px; padding:0; width:100%;">
{{Tile|Crafting_Light.png|caption=Commands|link=Console Commands}}
{{Tile|Campfire.png|caption=Item IDs|link=Item IDs}}
{{Tile|Dodo.png|caption=Creature IDs|link=Creature IDs}}
{{Tile|Color Wheel.svg|caption=Color IDs|link=Color IDs}}
{{Tile|ArksupplyCrate.png|caption=Beacon IDs|link=Beacon IDs}}
</ul>

[[Category:Templates]]
[[fr:Modèle:Tile]]</noinclude>