Template:ImageLink: Difference between revisions

From Baldur's Gate 3 Wiki
Jump to navigation Jump to search
No edit summary
No edit summary
Line 1: Line 1:
<includeonly><div style="display: inline-block;">
<includeonly><div style="display: inline table;">
<div style="display: flex; justify-content: center; align-items: center; width: {{{w|100}}}px; height: {{{h|100}}}px;"
<div style="display: flex; justify-content: center; align-items: center; width: {{{w|100}}}px; height: {{{h|100}}}px;"
>[[File:{{{1}}}|{{{w|100}}}x{{{h|100}}}px|{{{3|{{{2}}}}}}|link={{{2}}}]]</div>
>[[File:{{{1}}}|{{{w|100}}}x{{{h|100}}}px|{{{3|{{{2}}}}}}|link={{{2}}}]]</div>
Line 13: Line 13:
Standard width/height is 100:
Standard width/height is 100:


<nowiki>{{ImageLink|Frenzy Icon.png|Origins}}</nowiki>
<pre>
<nowiki>{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds}}</nowiki>
{{ImageLink|Frenzy Icon.png|Origins}}
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds}}
{{ImageLink|Passive Feature Generic Icon.png|Feats|Just a test with very very long text}}
</pre>


Result:
Result:
Line 20: Line 23:
{{ImageLink|Frenzy Icon.png|Origins}}
{{ImageLink|Frenzy Icon.png|Origins}}
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds}}
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds}}
{{ImageLink|Passive Feature Generic Icon.png|Feats|Just a test with very very long title text}}


----
----
Line 25: Line 29:
Limiting width only; note this may cause the text to clip as seen here:
Limiting width only; note this may cause the text to clip as seen here:


<nowiki>{{ImageLink|Frenzy Icon.png|Origins|w=50}}</nowiki>
<pre>
<nowiki>{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds|w=50}}</nowiki>
{{ImageLink|Frenzy Icon.png|Origins|w=50}}
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds|w=50}}
</pre>


Result:
Result:
Line 37: Line 43:
Limiting height only:
Limiting height only:


<nowiki>{{ImageLink|Frenzy Icon.png|Origins|h=50}}</nowiki>
<pre>
<nowiki>{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds|h=50}}</nowiki>
{{ImageLink|Frenzy Icon.png|Origins|h=50}}
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds|h=50}}
</pre>


Result:
Result:
Line 49: Line 57:
Limiting width and height:
Limiting width and height:


<nowiki>{{ImageLink|Frenzy Icon.png|Origins|w=50|h=50}}</nowiki>
<pre>
<nowiki>{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds|w=50|h=50}}</nowiki>
{{ImageLink|Frenzy Icon.png|Origins|w=50|h=50}}
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds|w=50|h=50}}
</pre>


Result:
Result:

Revision as of 01:53, 29 July 2023

This template allows you to add images on top of links.

The element will be an inline block, meaning several can appear in one line. You can give them all a specific width and height to get a nice consistent layout.


Standard width/height is 100:

{{ImageLink|Frenzy Icon.png|Origins}}
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds}}
{{ImageLink|Passive Feature Generic Icon.png|Feats|Just a test with very very long text}}

Result:

Origins
Backgrounds
Just a test with very very long title text

Limiting width only; note this may cause the text to clip as seen here:

{{ImageLink|Frenzy Icon.png|Origins|w=50}}
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds|w=50}}

Result:

Origins
Backgrounds

Limiting height only:

{{ImageLink|Frenzy Icon.png|Origins|h=50}}
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds|h=50}}

Result:

Origins
Backgrounds

Limiting width and height:

{{ImageLink|Frenzy Icon.png|Origins|w=50|h=50}}
{{ImageLink|Defensive Duellist Icon.png|Character Creation#Backgrounds|Backgrounds|w=50|h=50}}

Result:

Origins
Backgrounds