This is a documentation for Board Game Arena: play board games online !

Template:GameIcon: Difference between revisions

From Board Game Arena
Jump to navigation Jump to search
(tooltip|​ null parameter, steps)
(3 steps)
Line 1: Line 1:
<span style="display:inline-flex;align-items:center;justify-content:space-around;position:relative;height:{{{height}}}px;width:{{{width}}}px;overflow:hidden;color:{{{textColor|#000}}};font-family:Roboto,Arial,sans-serif;font-weight:700;font-size:16px;text-shadow:0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}};"><span style="position:absolute;left:calc(-1px * {{{x|0}}});top:calc(-1px * {{{y|0}}});transform-origin:top left;transform:scale({{{scale|1}}});">[[File:{{{imageFileName}}}|link=|{{{tooltip|&#8203;}}}]]</span><span style="position:relative;white-space:nowrap;">{{{|&#8203;}}}</span></span><noinclude>
<span style="display:inline-flex;align-items:center;justify-content:space-around;position:relative;height:{{{height}}}px;width:{{{width}}}px;overflow:hidden;color:{{{textColor|#000}}};font-family:Roboto,Arial,sans-serif;font-weight:700;font-size:16px;text-shadow:0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}},0 0 2px {{{outlineColor|#fff0}}};"><span style="position:absolute;left:calc(-1px * {{{x|0}}});top:calc(-1px * {{{y|0}}});transform-origin:top left;transform:scale({{{scale|1}}});">[[File:{{{imageFileName}}}|link=|{{{tooltip|&#8203;}}}]]</span><span style="position:relative;white-space:nowrap;">{{{|&#8203;}}}</span></span><noinclude>


'''Step 1''': Create <code>[https://en.doc.boardgamearena.com/Template:YourNewIconTemplate https://en.doc.boardgamearena.com/Template:'''''YourNewIconTemplate''''']</code>
{{infoBox |maxWidth= |color=#37c |titleAlign=left
(replace '''''YourNewIconTemplate''''')
|title=Step 1
<pre>
|body='''[[Special:Upload|Upload]]''' '''''YourImage'''''.png
}}
 
{{infoBox |maxWidth= |color=#3aa |titleAlign=left
|title=Step 2
|body=Create <code>[https://en.doc.boardgamearena.com/Template:YourIcon https://en.doc.boardgamearena.com<wbr>/Template:'''''YourIcon''''']</code>
Fill in the parameters:
<pre style="background:none;border:none;">
{{gameIcon
{{gameIcon
|tooltip=
|tooltip=
Line 15: Line 22:
|outlineColor=white
|outlineColor=white
}}<nowiki><</nowiki>noinclude<nowiki>>
}}<nowiki><</nowiki>noinclude<nowiki>>
[[Category:GameNameIcons]]
[[Category:YourIcons]]
<</nowiki>noinclude<nowiki>></nowiki>
<</nowiki>noinclude<nowiki>></nowiki>
</pre>
</pre>
'''Step 2''': Insert <code><nowiki>{{</nowiki>'''''YourNewIconTemplate'''''<nowiki>}}</nowiki></code> in a page
}}
 
{{infoBox |maxWidth= |color=#3c7 |titleAlign=left
|title=Step 3
|body=Insert <code><nowiki>{{</nowiki>'''''YourIcon'''''<nowiki>}}</nowiki></code>
}}


== Examples ==
== Examples ==
Line 24: Line 36:
=== Jump Drive ===
=== Jump Drive ===


{{infoBox
{{infoBox |maxWidth= |color=#37c |titleAlign=left
|title=JumpDriveIcons.png (450×30 pixels)
|title=Step 1
|body=[[File:JumpDriveIcons.png]]
|body=<span style="display:inline-flex;flex-direction:column;gap:0.5rem;"><span>'''[[Special:Upload|Upload]]''' <code>JumpDriveIcons.png</code> (450×30 pixels)</span>[[File:JumpDriveIcons.png]]</span>.
}}
}}


'''Step 1''': Create <code>[https://en.doc.boardgamearena.com/Template:JumpDriveGenes https://en.doc.boardgamearena.com/Template:'''''JumpDriveGenes''''']</code>
{{infoBox |maxWidth= |color=#3aa |titleAlign=left
 
|title=Step 2
<pre>
|body=Create <code>[https://en.doc.boardgamearena.com/Template:JumpDriveGenes https://en.doc.boardgamearena.com<wbr>/Template:'''''JumpDriveGenes''''']</code>:
<pre style="background:none;border:none;">
{{gameIcon
{{gameIcon
|tooltip=Genes
|tooltip=Genes
Line 45: Line 58:
<</nowiki>noinclude<nowiki>></nowiki>
<</nowiki>noinclude<nowiki>></nowiki>
</pre>
</pre>
}}


'''Step 2''': Insert <code><nowiki>{{JumpDriveGenes|=1}}</nowiki></code> {{JumpDriveGenes|=1}} in '''[[Gamehelpjumpdrive]]'''
{{infoBox |maxWidth= |color=#3c7 |titleAlign=left
|title=Step 3
|body=Insert <code><nowiki>{{JumpDriveGenes|=1}}</nowiki></code> {{JumpDriveGenes|=1}} in '''[[Gamehelpjumpdrive]]'''.
}}


=== Space Station Phoenix ===
=== Space Station Phoenix ===


{{infoBox |maxWidth=
{{infoBox |maxWidth= |color=#37c |titleAlign=left
|title=SpaceStationPhoenixIcons.png (700×100 pixels)
|title=Step 1
|body=[[File:SpaceStationPhoenixIcons.png]]
|body=<span style="display:inline-flex;flex-direction:column;gap:0.5rem;"><span>'''[[Special:Upload|Upload]]''' <code>SpaceStationPhoenixIcons.png</code> (700×100 pixels).</span>[[File:SpaceStationPhoenixIcons.png]]</span>
}}
}}


'''Step 1''': Create <code>[https://en.doc.boardgamearena.com/Template:SSPShipFarm https://en.doc.boardgamearena.com/Template:'''''SSPShipFarm''''']</code>
{{infoBox |maxWidth= |color=#3aa |titleAlign=left
 
|title=Step 2
<pre>
|body=Create <code>[https://en.doc.boardgamearena.com/Template:SSPShipFarm https://en.doc.boardgamearena.com<wbr>/Template:'''''SSPShipFarm''''']</code>:
<pre style="background:none;border:none;">
{{gameIcon
{{gameIcon
|tooltip=Farm ship
|tooltip=Farm ship
Line 69: Line 87:
<</nowiki>noinclude<nowiki>></nowiki>
<</nowiki>noinclude<nowiki>></nowiki>
</pre>
</pre>
}}


'''Step 2''': Insert <code><nowiki>{{SSPShipFarm}}</nowiki></code> {{SSPShipFarm}} in '''[[Gamehelpspacestationphoenix]]'''
{{infoBox |maxWidth= |color=#3c7 |titleAlign=left
|title=Step 3
|body=Insert <code><nowiki>{{SSPShipFarm}}</nowiki></code> {{SSPShipFarm}} in '''[[Gamehelpspacestationphoenix]]'''.
}}


== Available parameters ==
== Available parameters ==

Revision as of 04:54, 15 December 2023

[[File:{{{imageFileName}}}|link=|​]]​

Step 1
Upload YourImage.png
Step 2
Create https://en.doc.boardgamearena.com/Template:YourIcon

Fill in the parameters: 

{{gameIcon
|tooltip=
|imageFileName=
|scale=1
|width=
|height=
|x=0
|y=0
|textColor=black
|outlineColor=white
}}<noinclude>
[[Category:YourIcons]]
<noinclude>
Step 3
Insert {{YourIcon}}

Examples

Jump Drive

Step 1
Upload JumpDriveIcons.png (450×30 pixels)JumpDriveIcons.png.
Step 2
Create https://en.doc.boardgamearena.com/Template:JumpDriveGenes: 
{{gameIcon
|tooltip=Genes
|imageFileName=JumpDriveIcons.png
|width=30
|height=30
|x=60
|y=0
|textColor=black
|outlineColor=white
}}<noinclude>
[[Category:JumpDriveIcons]]
<noinclude>
Step 3
Insert {{JumpDriveGenes|=1}} genes​ in Gamehelpjumpdrive.

Space Station Phoenix

Step 1
Upload SpaceStationPhoenixIcons.png (700×100 pixels).SpaceStationPhoenixIcons.png
Step 2
Create https://en.doc.boardgamearena.com/Template:SSPShipFarm: 
{{gameIcon
|tooltip=Farm ship
|imageFileName=SpaceStationPhoenixIcons.png
|width=85
|height=50
|x=500
|y=50
}}<noinclude>
[[Category:SpaceStationPhoenixIcons]]
<noinclude>
Step 3
Insert {{SSPShipFarm}} Farm ship​ in Gamehelpspacestationphoenix.

Available parameters

Parameter
Default value
Example
Description
tooltip
&#8203;
(zero width space)
|tooltip=Resource
Optional: specify a tooltip to display on hover.
imageFileName
null
|imageFileName=JumpDriveIcons.png
Required: specify an uploaded image file name including file format (i.e. .png, .jpg etc.).
scale
1
|scale=0.5
Optional: scale the imageFile with origin in the top left corner.
width
null
|width=30
Required: specify the icon width in px units.
height
null
|height=30
Required: specify the icon height in px units.
x
0
|x=60
Optional: specify the x position in px units.
y
0
|y=30
Optional: specify the y position in px units.
textColor
#000
(black)
|textColor=green
Optional: specify the text variable color as a CSS color e.g. green.
outlineColor
#fff0
(transparent white)
|outlineColor=green
Optional: specify the text variable outline color as a CSS color e.g. green.
Retrieved from "http:///index.php?title=Template:GameIcon&oldid=19208"