This is a documentation for Board Game Arena: play board games online !
Template:Cardholder: Difference between revisions
Jump to navigation
Jump to search
Sammy McSam (talk | contribs) No edit summary |
Sammy McSam (talk | contribs) No edit summary |
||
Line 1: | Line 1: | ||
< | <div style="position:relative;display:grid;grid:repeat(3, auto) / repeat({{{n|5}}},auto);gap:0rem {{{gap|2}}}px;background:{{{background|#fff0}}};border-radius:{{{corner|0.2}}}rem {{{corner|0.2}}}rem 0 0;padding:0.5rem;line-height:0.1;width:max-content;align-items:end;"> | ||
<div style="background:{{{clue1Colour|#fff0}}};margin-left:5%;padding-left:10%;height:1.4rem;width:75%;border-radius:{{{corner|0.2}}}rem {{{corner|0.2}}}rem 0 0;color:{{{colour|#000}}};font-size:calc({{{size|2}}}rem - 0.75rem);line-height:1.2;">{{{clue1|}}}</div> | |||
<div style="background:{{{clue2Colour|#fff0}}};margin-left:5%;padding-left:10%;height:1.4rem;width:75%;border-radius:{{{corner|0.2}}}rem {{{corner|0.2}}}rem 0 0;color:{{{colour|#000}}};font-size:calc({{{size|2}}}rem - 0.75rem);line-height:1.2;">{{{clue2|}}}</div> | |||
<div style="background:{{{clue3Colour|#fff0}}};margin-left:5%;padding-left:10%;height:1.4rem;width:75%;border-radius:{{{corner|0.2}}}rem {{{corner|0.2}}}rem 0 0;color:{{{colour|#000}}};font-size:calc({{{size|2}}}rem - 0.75rem);line-height:1.2;">{{{clue3|}}}</div> | |||
<div style="background:{{{clue4Colour|#fff0}}};margin-left:5%;padding-left:10%;height:1.4rem;width:75%;border-radius:{{{corner|0.2}}}rem {{{corner|0.2}}}rem 0 0;color:{{{colour|#000}}};font-size:calc({{{size|2}}}rem - 0.75rem);line-height:1.2;">{{{clue4|}}}</div> | |||
<div style="background:{{{clue5Colour|#fff0}}};margin-left:5%;padding-left:10%;height:1.4rem;width:75%;border-radius:{{{corner|0.2}}}rem {{{corner|0.2}}}rem 0 0;color:{{{colour|#000}}};font-size:calc({{{size|2}}}rem - 0.75rem);line-height:1.2;">{{{clue5|}}}</div> | |||
<div>{{card|={{{card1| }}}|background={{{cardBackground|#fafafa}}}|colour={{{card1Colour|#000}}}|size={{{size|2}}}}}</div> | |||
<div>{{card|={{{card2| }}}|background={{{cardBackground|#fafafa}}}|colour={{{card2Colour|#000}}}|size={{{size|2}}}}}</div> | |||
<div>{{card|={{{card3| }}}|background={{{cardBackground|#fafafa}}}|colour={{{card3Colour|#000}}}|size={{{size|2}}}}}</div> | |||
<div>{{card|={{{card4| }}}|background={{{cardBackground|#fafafa}}}|colour={{{card4Colour|#000}}}|size={{{size|2}}}}}</div> | |||
<div>{{card|={{{card5| }}}|background={{{cardBackground|#fafafa}}}|colour={{{card5Colour|#000}}}|size={{{size|2}}}}}</div> | |||
<div style="position:absolute;grid-row-start:-1;top:-0.2rem;background:#000;color:{{{colour|#fff}}};font-size:{{{size|1}}}rem;width:calc(100% - 0.8rem);height:25%;padding:0.5rem;border-radius:0.2rem 0.2rem 0 0;">{{{player|A}}} {{{arrow|➞}}}</div></div><noinclude> | |||
[[Category:Card templates]] | [[Category:Card templates]] | ||
== Available parameters == | |||
<div style="display:grid;grid-template-columns:repeat(2,min-content) repeat(3,auto);gap:1rem;"> | |||
<div style="font-weight:bold;">Parameter</div> | |||
<div style="font-weight:bold;">Default value</div> | |||
<div style="font-weight:bold;">Example</div> | |||
<div style="font-weight:bold;">Result</div> | |||
<div style="font-weight:bold;">Description</div> | |||
<div><code>card<b>#</b></code></div> | |||
<div><code>&nbsp;&nbsp;</code> (two non-breaking spaces)</div> | |||
<div><code><nowiki>{{cardholder |card1=1 |card2=2}}</nowiki></code></div> | |||
<div>{{cardholder |card1=1 |card2=2}}</div> | |||
<div><b><i>Optional:</i></b> specify cards as text where <code><b>#</b></code> is the card number from left to right.</div> | |||
<div><code>card<b>#</b>Colour</code></div> | |||
<div><code><nowiki>#000</nowiki></code></div> | |||
<div><code><nowiki>{{cardholder |card1=1 |card1Colour=green |card2=2 |card2Colour=green}}</nowiki></code></div> | |||
<div>{{cardholder |card1=1 |card1Colour=green |card2=2 |card2Colour=green}}</div> | |||
<div><b><i>Optional:</i></b> specify card colours as [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS colours] where <code><b>#</b></code> is the card number from left to right.</div> | |||
<div><code>clue<b>#</b></code></div> | |||
<div><code>?</code></div> | |||
<div><code><nowiki>{{cardholder |clue1=1 |clue2=2}}</nowiki></code></div> | |||
<div>{{cardholder |clue1=1 |clue2=2}}</div> | |||
<div><b><i>Optional:</i></b> specify clues as text</b> where <code><b>#</b></code> is the card number from left to right.</div> | |||
<div><code>clue<b>#</b>Colour</code></div> | |||
<div><code>#fff0</code> (transparent)</div> | |||
<div><code><nowiki>{{cardholder |clue1Colour=green |clue2Colour=green}}</nowiki></code></div> | |||
<div>{{cardholder|clue1Colour=green|clue2Colour=green}}</div> | |||
<div><b><i>Optional:</i></b> specify clue colours as [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS colours] where <code><b>#</b></code> is the card number from left to right.</div> | |||
<div><code>gap</code></div> | |||
<div><code>2</code></div> | |||
<div><code><nowiki>{{cardholder |gap=10}}</nowiki></code></div> | |||
<div>{{cardholder|gap=10}}</div> | |||
<div><b><i>Optional:</i></b> specify the gap between cards in px units.</div> | |||
<div><code>background</code></div> | |||
<div><code>#fff0</code> (transparent)</div> | |||
<div><code><nowiki>{{cardholder |background=green}}</nowiki></code></div> | |||
<div>{{cardholder|background=green}}</div> | |||
<div><b><i>Optional:</i></b> specify the background colour as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS colour].</div> | |||
<div><code>player</code></div> | |||
<div><code>A</code></div> | |||
<div><code><nowiki>{{cardholder |player=Amy}}</nowiki></code></div> | |||
<div>{{cardholder|player=Amy}}</div> | |||
<div><b><i>Optional:</i></b> specify the player name as text.</div> | |||
<div><code>arrow</code></div> | |||
<div><code>➞</code></div> | |||
<div><code><nowiki>{{cardholder |arrow=}}</nowiki></code></div> | |||
<div>{{cardholder|arrow=}}</div> | |||
<div><b><i>Optional:</i></b> hide the arrow or use another symbol.</div> | |||
</div> | |||
== Examples == | |||
=== Hanabi === | |||
{{cardholder |background=#dfd |cardBackground=#324 | |||
|clue1=1 |clue1Colour=white | |||
|clue2=2 |clue2Colour=lightgreen | |||
|clue3=3 |clue3Colour=yellow | |||
|clue4=4 |clue4Colour=red | |||
|clue5=5 |clue5Colour=deepskyblue | |||
|card1=1 |card1Colour=white | |||
|card2=2 |card2Colour=lightgreen | |||
|card3=3 |card3Colour=yellow | |||
|card4=4 |card4Colour=red | |||
|card5=5 |card5Colour=deepskyblue | |||
}} | |||
<pre> | |||
{{cardholder |background=#dfd |cardBackground=#324 | |||
|clue1=1 |clue1Colour=white | |||
|clue2=2 |clue2Colour=lightgreen | |||
|clue3=3 |clue3Colour=yellow | |||
|clue4=4 |clue4Colour=red | |||
|clue5=5 |clue5Colour=deepskyblue | |||
|card1=1 |card1Colour=white | |||
|card2=2 |card2Colour=lightgreen | |||
|card3=3 |card3Colour=yellow | |||
|card4=4 |card4Colour=red | |||
|card5=5 |card5Colour=deepskyblue | |||
}} | |||
</pre> | |||
</noinclude> | </noinclude> |
Revision as of 18:24, 16 March 2022
A ➞
Available parameters
Parameter
Default value
Example
Result
Description
card#
(two non-breaking spaces){{cardholder |card1=1 |card2=2}}
A ➞
Optional: specify cards as text where
#
is the card number from left to right.card#Colour
#000
{{cardholder |card1=1 |card1Colour=green |card2=2 |card2Colour=green}}
A ➞
Optional: specify card colours as CSS colours where
#
is the card number from left to right.clue#
?
{{cardholder |clue1=1 |clue2=2}}
1
2
A ➞
Optional: specify clues as text where
#
is the card number from left to right.clue#Colour
#fff0
(transparent){{cardholder |clue1Colour=green |clue2Colour=green}}
A ➞
Optional: specify clue colours as CSS colours where
#
is the card number from left to right.gap
2
{{cardholder |gap=10}}
A ➞
Optional: specify the gap between cards in px units.
background
#fff0
(transparent){{cardholder |background=green}}
A ➞
Optional: specify the background colour as a CSS colour.
player
A
{{cardholder |player=Amy}}
Amy ➞
Optional: specify the player name as text.
arrow
➞
{{cardholder |arrow=}}
A
Optional: hide the arrow or use another symbol.
Examples
Hanabi
1
2
3
4
5
A ➞
{{cardholder |background=#dfd |cardBackground=#324 |clue1=1 |clue1Colour=white |clue2=2 |clue2Colour=lightgreen |clue3=3 |clue3Colour=yellow |clue4=4 |clue4Colour=red |clue5=5 |clue5Colour=deepskyblue |card1=1 |card1Colour=white |card2=2 |card2Colour=lightgreen |card3=3 |card3Colour=yellow |card4=4 |card4Colour=red |card5=5 |card5Colour=deepskyblue }}