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

Template:HCard: Difference between revisions

From Board Game Arena
Jump to navigation Jump to search
mNo edit summary
(optimisation, fix inline)
Line 1: Line 1:
<div style="display:inline-grid;grid:16px 24px 28px/auto-flow;width:26px;color:{{{2|#fff}}};text-align:center;vertical-align:-webkit-baseline-middle"><div style="grid-area:2/1/4/1;z-index:1;width:26px;border-radius:3px;background:{{{b|#324}}};font:700 28px/1.1 Roboto;-webkit-text-stroke:1px rgb(255 255 255/{{{o|0}}})"><span style="font-size:0">{{{4|card}}}</span>{{{1|&#8203;}}}</div><div aria-hidden="true" style="grid-area:3/1/4/1;z-index:1;width:26px;font:20px/1.1 cursive">{{{3|&#8203;}}}</div><div aria-hidden="true" style="grid-area:3/1/4/1;width:26px;position:relative;top:26px;color:{{{hc|#fff}}};font:500 16px/1.1 Roboto;z-index:4">{{{h|}}}</div><span style="visibility:hidd{{{sc|e}}}{{{sn|n}}};font-size:0">,with a </span><div style="grid-area:1/1/3/1;width:12px;margin:0 1px;border-radius:3px;border:1px solid #324;background:#ccc8;visibility:hidde{{{sn|n}}}"></div><span style="grid-area:1/1/3/1;justify-self:center;width:22px;border-radius:3px;border:1px solid #324;background:{{{cc|{{{2|transparent}}}}}};visibility:hidd{{{sc|e}}}n"><span style="visibility:hidd{{{sc|e}}}n;font-size:0">{{{cN|{{{4|card}}}}}}</span></span><span style="grid-area:1/1/3/1;visibility:hidde{{{sn|n}}};padding:0 3px;font:500 16px/1.15 Roboto;text-align:left;color:#324">{{{cn|{{{1|&#8203;}}}}}}</span><span style="visibility:hidd{{{sc|e}}}{{{sn|n}}};font-size:0">clue,</span></div><noinclude>
<span style="display:inline-grid;grid:16px 24px 28px/auto-flow;width:26px;font:500 16px/1.1 Roboto;text-align:center;color:{{{2|#fff}}}"><span style="grid-area:2/1/4/1;z-index:1;width:26px;font:700 28px/1.1 Roboto;border-radius:3px;background:{{{b|#324}}};-webkit-text-stroke:{{{o|0}}}px #fff"><span style="font-size:0">{{{4|card}}}</span>{{{1|}}}</span><span aria-hidden="true" style="grid-area:3/1/4/1;z-index:1;width:26px;font:20px/1.1 cursive">{{{3|}}}</span><span aria-hidden="true" style="grid-area:3/1/4/1;position:relative;top:26px;z-index:4;width:26px;color:{{{d|#fff}}}">{{{p|}}}</span><span style="font-size:0;{{{c|visibility:hidde}}}{{{n|n}}}">,with a </span><span style="grid-area:1/1/3/1;width:12px;margin:0 1px;border-radius:3px;border:1px solid #324;background:#ccc8;visibility:hidde{{{n|n}}}"></span><span style="grid-area:1/1/3/1;justify-self:center;width:22px;border-radius:3px;border:1px solid #324;background:{{{C|{{{2}}}}}};{{{c|visibility:hidde}}}n"><span style="font-size:0;{{{c|visibility:hidde}}}n">{{{a|{{{4|}}}}}}</span></span><span style="grid-area:1/1/3/1;padding:0 3px;line-height:1.15;text-align:left;color:#324;visibility:hidde{{{n|n}}}">{{{1|}}}</span><span style="font-size:0;{{{c|visibility:hidde}}}{{{n|n}}}">clue,</span></span><noinclude>


== Examples ==
== Examples ==


{|class="wikitable" style="width:auto;line-height:0.8;"
{|class="wikitable" style="width:auto;line-height:1;"
|+style="line-height:normal"|Hanabi cards
|-
|-
!style="writing-mode:vertical-rl;transform:rotate(180deg);"|red
!style="writing-mode:vertical-rl;transform:rotate(180deg);"|red
Line 98: Line 97:
|}
|}


== Parameters ==


== Parameters ==
<div style="display:grid;grid-template-columns:2rem repeat(3,max-content) 2fr;gap:0.5rem;overflow:auto;text-overflow:ellipsis;">
<div style="display:grid;grid-template-columns:repeat(4,max-content) 2fr;gap:0.5rem;overflow:auto;text-overflow:ellipsis;">
   <div style="font-weight:bold;width:8rem;">Id</div>
   <div style="font-weight:bold;width:8rem;">Parameter Id</div>
   <div style="font-weight:bold;width:8rem;">Parameter Name</div>
   <div style="font-weight:bold;width:8rem;">Parameter Name</div>
   <div style="font-weight:bold;width:8rem;">Default value</div>
   <div style="font-weight:bold;width:8rem;">Default value</div>
Line 107: Line 106:
   <div style="font-weight:bold;width:8rem;">Description</div>
   <div style="font-weight:bold;width:8rem;">Description</div>
   <div><code>1</code></div>
   <div><code>1</code></div>
   <div><code>rank</code></div>
   <div>Rank</div>
   <div><code>&amp;ZeroWidthSpace;</code></div>
  <div>empty</div>
   <div><code><nowiki>|5</nowiki></code></div>
  <div><code><nowiki>{{HCard|5}}</nowiki></code><br>
   <div>'''''Required:''''' specify the card rank (<code>1</code>/<code>2</code>/<code>3</code>/<code>4</code>/<code>5</code>).</div>
    <code><nowiki>{{Hg|5}}</nowiki></code></div>
  <div>'''''Required:''''' card rank<br> (<code>1</code>/<code>2</code>/<code>3</code>/<code>4</code>/<code>5</code>).</div>
  <div><code>c</code></div>
  <div>Show clue colour</code></div>
  <div>hidden</div>
  <div><code><nowiki>{{HCard|c=}}</nowiki></code><br>
    <code><nowiki>{{Hg|c=}}</nowiki></code></div>
  <div>'''''Optional:''''' display the colour clue.</div>
  <div><code>n</code></div>
  <div>Show clue number</code></div>
  <div>hidden</div>
  <div><code><nowiki>{{HCard|n=}}</nowiki></code><br>
    <code><nowiki>{{Hg|n=}}</nowiki></code></div>
  <div>'''''Optional:''''' display the rank clue.</div>
   <div><code>p</code></div>
   <div>Player text</div>
  <div>empty</div>
  <div><code><nowiki>{{HCard|p=A}}</nowiki></code><br>
    <code><nowiki>{{Hg|p=A}}</nowiki></code></div>
   <div>'''''Optional:''''' card holder text: single character below the card to represent a player e.g. <code>A</code>/<code>B</code>/<code>C</code>/<code>D</code>/<code>E</code>.</div>
  <div><code>d</code></div>
  <div>Player text colour</div>
  <div>white</div>
  <div><code><nowiki>{{HCard|d=black}}</nowiki></code><br>
    <code><nowiki>{{Hw|d=black}}</nowiki></code></div>
  <div>'''''Optional:''''' card holder text colour<br> e.g. <code><nowiki>green</nowiki></code>.</div>
   <div><code>2</code></div>
   <div><code>2</code></div>
   <div><code>colour</code></div>
   <div>Colour</div>
   <div><code>transparent</code></div>
  <div>white</div>
  <div><code><nowiki>|{{g}}</nowiki></code></div>
   <div><code><nowiki>{{HCard|5|{{g}}}}</nowiki></code><br>
   <div>'''''Required:''''' specify the card colour e.g. <code><nowiki>{{r}}</nowiki></code> <code><nowiki>{{y}}</nowiki></code> <code><nowiki>{{g}}</nowiki></code> <code><nowiki>{{b}}</nowiki></code> <code><nowiki>{{w}}</nowiki></code> <code><nowiki>{{m}}</nowiki></code></div>
    <code><nowiki>{{Hg}}</nowiki></code></div>
   <div><code><nowiki>{{HCard}}</nowiki></code> '''''Required''''': card colour<br> e.g. <code><nowiki>{{r}}</nowiki></code> <code><nowiki>{{y}}</nowiki></code> <code><nowiki>{{g}}</nowiki></code> <code><nowiki>{{b}}</nowiki></code> <code><nowiki>{{w}}</nowiki></code> <code><nowiki>{{m}}</nowiki></code>.</div>
   <div><code>3</code></div>
   <div><code>3</code></div>
   <div><code>colourLetter</code></div>
   <div>Colour letter</div>
   <div><code>null</code></div>
  <div>empty</div>
  <div><code><nowiki>|g</nowiki></code></div>
   <div><code><nowiki>{{HCard|5|{{g}}|g}}</nowiki></code><br>
   <div>'''''Required:''''' specify the card colour letter: red ⇨<code>r</code>, yellow ⇨<code>y</code>, green ⇨<code>g</code>, blue ⇨<code>b</code>, white ⇨<code>w</code>, multicolour ⇨<code>m</code>.</div>
    <code><nowiki>{{Hg}}</nowiki></code></div>
   <div><code><nowiki>{{HCard}}</nowiki></code> '''''Required''''': card colour letter<br>(<code>r</code>ed, <code>y</code>ellow, <code>g</code>reen, <code>b</code>lue, <code>w</code>hite, <code>m</code>ulticolour).</div>
   <div><code>4</code></div>
   <div><code>4</code></div>
   <div><code>colourName</code></div>
   <div>Colour name</div>
   <div><code>card</code></div>
  <div>empty</div>
  <div><code><nowiki>|green</nowiki></code></div>
   <div><code><nowiki>{{HCard|5|{{g}}|g|green}}</nowiki></code><br>
   <div>'''''Required:''''' specify the colour word used for tooltips and screen readers.</div>
    <code><nowiki>{{Hg}}</nowiki></code></div>
   <div><code>cN</code></div>
   <div><code><nowiki>{{HCard}}</nowiki></code> '''''Required''''': colour word used for tooltips and screen readers.</div>
   <div><code>clueColourName</code></div>
   <div><code>a</code></div>
   <div><code><nowiki>{{{N|card}}}</nowiki></code></div>
   <div>Clue colour name</div>
  <div><code><nowiki>|cN=green</nowiki></code></div>
  <div>empty</div>
   <div>'''''Optional:''''' specify the clue colour word used for tooltips and screen readers.</div>
   <div><code><nowiki>{{HCard|a=green}}</nowiki></code><br>
   <div><code>cc</code></div>
    <code><nowiki>{{Hg}}</nowiki></code></div>
   <div><code>clueColour</code></div>
   <div><code><nowiki>{{HCard}}</nowiki></code> '''''Optional''''': clue colour word used for tooltips and screen readers.</div>
   <div><code><nowiki>{{{2|transparent}}}</nowiki></code></div>
   <div><code>C</code></div>
  <div><code><nowiki>|cc={{g}}</nowiki></code></div>
   <div>Clue colour</div>
   <div>'''''Optional:''''' specify the clue colour e.g. <code><nowiki>{{r}}</nowiki></code> <code><nowiki>{{y}}</nowiki></code> <code><nowiki>{{g}}</nowiki></code> <code><nowiki>{{b}}</nowiki></code> <code><nowiki>{{w}}</nowiki></code> <code><nowiki>{{m}}</nowiki></code></div>
  <div>Colour</div>
  <div><code>cn</code></div>
   <div><code><nowiki>{{HCard|C=green}}</nowiki></code><br>
   <div><code>clueNumber</code></div>
    <code><nowiki>{{Hm|C=green}}</nowiki></code></div>
   <div><code><nowiki>{{{1|&amp;#8203;}}}</nowiki></code></div>
   <div><code><nowiki>{{HCard}}</nowiki></code> '''''Optional''''':<br> e.g. <code><nowiki>{{r}}</nowiki></code> <code><nowiki>{{y}}</nowiki></code> <code><nowiki>{{g}}</nowiki></code> <code><nowiki>{{b}}</nowiki></code> <code><nowiki>{{w}}</nowiki></code> <code><nowiki>{{m}}</nowiki></code>.</div>
  <div><code><nowiki>|cn={{1}}</nowiki></code></div>
<div><code>b</code></div>
   <div>'''''Optional:''''' specify the clue rank: (<code>1</code>/<code>2</code>/<code>3</code>/<code>4</code>/<code>5</code>).</div>
<div>Background colour</div>
   <div><code>#324</code> (black)</div>
   <div><code><nowiki>{{HCard|b=grey}}</nowiki></code><br>
    <code><nowiki>{{HBack}}</nowiki></code></div>
   <div><code><nowiki>{{HCard}}</nowiki></code> '''''Optional''''': background colour.</div>
   <div><code>o</code></div>
   <div><code>o</code></div>
   <div><code>textOutline</code></div>
   <div>Text outline</div>
   <div><code>0</code></div>
   <div><code>0</code></div>
   <div><code><nowiki>|o=1</nowiki></code></div>
   <div><code><nowiki>{{HCard|o=1}}</nowiki></code><br>
  <div>'''''Optional:''''' specify the text outline opacity: transparent ⇨<code><nowiki>0</nowiki></code>, opaque ⇨<code><nowiki>1</nowiki></code></div>
    <code><nowiki>{{Hk}}</nowiki></code></div>
<div><code>b</code></div>
   <div><code><nowiki>{{HCard}}</nowiki></code> '''''Optional''''': white text outline thickness in px units.</div>
<div><code>backgroundColour</code></div>
  <div><code>#324</code> (black)</div>
  <div><code><nowiki>|b=grey</nowiki></code></div>
  <div>'''''Optional:''''' specify the background colour.</div>
  <div><code>sn</code></div>
  <div><code>showClueNumber</code></div>
  <div>''visibility:hidde''<code>n</code></div>
  <div><code><nowiki>|sn=</nowiki></code></div>
  <div>'''''Optional:''''' display the rank clue.</div>
  <div><code>sc</code></div>
  <div><code>showClueColour</code></div>
  <div>''visibility:hidd''<code>e</code>''n''</div>
  <div><code><nowiki>|sc=</nowiki></code></div>
  <div>'''''Optional:''''' display the colour clue.</div>
  <div><code>h</code></div>
  <div><code>holderLabel</code></div>
  <div><code>&amp;#8203;</code></div>
   <div><code><nowiki>|h=A</nowiki></code></div>
  <div>'''''Optional:''''' specify a character below the card e.g. to represent a player: <code>A</code>/<code>B</code>/<code>C</code>.</div>
  <div><code>hc</code></div>
  <div><code>holderLabelColour</code></div>
  <div><code>#fff</code> (white)</div>
  <div><code><nowiki>|hc=green</nowiki></code></div>
  <div>'''''Optional:''''' specify the card holder label colour e.g. <code><nowiki>green</nowiki></code></div>
</div>
</div>


[[Category:HanabiCards]]
[[Category:HanabiCards]]
</noinclude>
</noinclude>

Revision as of 17:40, 23 June 2025

card,with a clue,

Examples

red red1,with a red1clue, red2,with a red2clue, red3,with a red3clue, red4,with a red4clue, card back5,with a red5clue, {{Hr|1}}

{{Hr|2|n=}}

{{Hr|3|c=}}

{{Hr|4|n=|c=}}

{{HBack|5|{{r}}|red|n=|c=}}

yellow yellow1,with a yellow1clue, yellow2,with a yellow2clue, yellow3,with a yellow3clue, yellow4,with a yellow4clue, card back5,with a yellow5clue, {{Hy|1}}

{{Hy|2|n=}}

{{Hy|3|c=}}

{{Hy|4|n=|c=}}

{{HBack|5|{{y}}|yellow|n=|c=}}

green green1,with a green1clue, green2,with a green2clue, green3,with a green3clue, green4,with a green4clue, card back5,with a green5clue, {{Hg|1}}

{{Hg|2|n=}}

{{Hg|3|c=}}

{{Hg|4|n=|c=}}

{{HBack|5|{{g}}|green|n=|c=}}

blue blue1,with a blue1clue, blue2,with a blue2clue, blue3,with a blue3clue, blue4,with a blue4clue, card back5,with a blue5clue, {{Hb|1}}

{{Hb|2|n=}}

{{Hb|3|c=}}

{{Hb|4|n=|c=}}

{{HBack|5|{{b}}|blue|n=|c=}}

white white1,with a white1clue, white2,with a white2clue, white3,with a white3clue, white4,with a white4clue, card back5,with a white5clue, {{Hw|1}}

{{Hw|2|n=}}

{{Hw|3|c=}}

{{Hw|4|n=|c=}}

{{HBack|5|{{w}}|white|n=|c=}}

multicolor multicolour1,with a multicolour1clue, multicolour2,with a multicolour2clue, multicolour3,with a multicolour3clue, multicolour4,with a multicolour4clue, multicolour5,with a green5clue, card back5,with a multicolor5clue, {{Hm|1}}

{{Hm|2|n=}}

{{Hm|3|c=}}

{{Hm|4|n=|c=}}

{{Hm|5|{{g}}|green|n=|c=}}

{{HBack|5|{{m}}|multicolor|n=|c=}}

black powder black powder5,with a black powder5clue, black powder4,with a black powder4clue, {{Hk|5}}

{{Hk|4|n=}}

deck cards in the deck5,with a cards in the deck5clue, {{HDeck|5}}
cardholder red1,with a red1clue,yellow2,with a yellow2clue,green3,with a green3clue,blue4,with a blue4clue, Alice 🡲 {{cardholder|{{Hr|1}}{{Hy|2}}{{Hg|3}}{{Hb|4}}|Alice 🡲}}
red1,with a red1clue,yellow2,with a yellow2clue,green3,with a green3clue,blue4,with a blue4clue, ​ {{cardholder|{{Hr|1|h=A}}{{Hy|2|h=B}}{{Hg|3|h=C}}{{Hb|4|h=D}}}}

Parameters

Id
Parameter Name
Default value
Example
Description
1
Rank
empty
{{HCard|5}}
{{Hg|5}}
Required: card rank
(1/2/3/4/5).
c
Show clue colour
hidden
{{HCard|c=}}
{{Hg|c=}}
Optional: display the colour clue.
n
Show clue number
hidden
{{HCard|n=}}
{{Hg|n=}}
Optional: display the rank clue.
p
Player text
empty
{{HCard|p=A}}
{{Hg|p=A}}
Optional: card holder text: single character below the card to represent a player e.g. A/B/C/D/E.
d
Player text colour
white
{{HCard|d=black}}
{{Hw|d=black}}
Optional: card holder text colour
e.g. green.
2
Colour
white
{{HCard|5|{{g}}}}
{{Hg}}
{{HCard}} Required: card colour
e.g. {{r}} {{y}} {{g}} {{b}} {{w}} {{m}}.
3
Colour letter
empty
{{HCard|5|{{g}}|g}}
{{Hg}}
{{HCard}} Required: card colour letter
(red, yellow, green, blue, white, multicolour).
4
Colour name
empty
{{HCard|5|{{g}}|g|green}}
{{Hg}}
{{HCard}} Required: colour word used for tooltips and screen readers.
a
Clue colour name
empty
{{HCard|a=green}}
{{Hg}}
{{HCard}} Optional: clue colour word used for tooltips and screen readers.
C
Clue colour
Colour
{{HCard|C=green}}
{{Hm|C=green}}
{{HCard}} Optional:
e.g. {{r}} {{y}} {{g}} {{b}} {{w}} {{m}}.
b
Background colour
#324 (black)
{{HCard|b=grey}}
{{HBack}}
{{HCard}} Optional: background colour.
o
Text outline
0
{{HCard|o=1}}
{{Hk}}
{{HCard}} Optional: white text outline thickness in px units.
Retrieved from "http:///index.php?title=Template:HCard&oldid=25554"