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

Template:Hex: Difference between revisions

From Board Game Arena
Jump to navigation Jump to search
m (parameters)
(+arrow from edge)
Line 1: Line 1:
<div style="display:inline-grid;place-items:center;grid-area:{{{y|1}}}/{{{x|1}}}/span 1/span 2;z-index:{{{z}}};rotate:calc({{{r|0}}}*30deg);{{{|w}}}height:{{{w|67.195}}}px;{{{|w}}}idth:{{{w|67.195}}}px;aspect-ratio:calc(1/({{{|1/}}}cos(30deg)));clip-path:polygon(
<onlyinclude><div style="display:inline-grid;place-items:center;grid-area:{{{y|1}}}/{{{x|1}}}/span 1/span 2;z-index:{{{z}}};rotate:calc({{{r|0}}}*30deg);{{{f|w}}}height:{{{w|67.195}}}px;{{{f|w}}}idth:{{{w|67.195}}}px;aspect-ratio:calc(1/({{{f|1/}}}cos(30deg)));clip-path:polygon(
20.6% 8.66%,23.1% 5.40%,26.2% 2.67%,29.7% 0.822%,33.2% 0,
20.6% 8.66%,23.1% 5.40%,26.2% 2.67%,29.7% 0.822%,33.2% 0,
66.8% 0,70.3% 0.822%,73.8% 2.67%,76.9% 5.40%,79.3% 8.66%,
66.8% 0,70.3% 0.822%,73.8% 2.67%,76.9% 5.40%,79.3% 8.66%,
Line 6: Line 6:
33.2% 100%,29.7% 99.2%,26.2% 97.3%,23.1% 94.6%,20.7% 91.3%,
33.2% 100%,29.7% 99.2%,26.2% 97.3%,23.1% 94.6%,20.7% 91.3%,
4.33% 58.7%,3.11% 54.6%,2.67% 50%,3.11% 45.4%,4.33% 41.3%
4.33% 58.7%,3.11% 54.6%,2.67% 50%,3.11% 45.4%,4.33% 41.3%
);{{{|c}}}lip-path:polygon(
);{{{f|c}}}lip-path:polygon(
8.66% 20.6%,5.40% 23.1%,2.67% 26.2%,0.822% 29.7%,0 33.2%,
8.66% 20.6%,5.40% 23.1%,2.67% 26.2%,0.822% 29.7%,0 33.2%,
0 66.8%,0.822% 70.3%,2.67% 73.8%,5.40% 76.9%,8.66% 79.3%,
0 66.8%,0.822% 70.3%,2.67% 73.8%,5.40% 76.9%,8.66% 79.3%,
Line 13: Line 13:
100% 33.2%,99.2% 29.7%,97.3% 26.2%,94.6% 23.1%,91.3% 20.7%,
100% 33.2%,99.2% 29.7%,97.3% 26.2%,94.6% 23.1%,91.3% 20.7%,
58.7% 4.33%,54.6% 3.11%,50% 2.67%,45.4% 3.11%,41.3% 4.33%
58.7% 4.33%,54.6% 3.11%,50% 2.67%,45.4% 3.11%,41.3% 4.33%
);c{{{rounded|l}}}ip-path:polygon(0 50%,50% -50%,100% 50%,50% 150%);{{{|c}}}{{{rounded|l}}}ip-path:polygon(-50% 50%,50% 100%,150% 50%,50% 0);background:{{{bg|#ddd}}};"><div style="grid-area:1/1;">{{{1|&ZeroWidthSpace;}}}</div><div style="grid-area:1/1;rotate:calc({{{r|0}}}*-30deg);color:{{{textColor|#fff}}};font-family:Roboto,Arial,sans-serif;font-weight:900;font-size:28px;-webkit-text-stroke:1.2px {{{textOutline|#000}}};">{{{2|&ZeroWidthSpace;}}}</div></div><noinclude>
);c{{{c|l}}}ip-path:polygon(0 50%,50% -50%,100% 50%,50% 150%);{{{f|c}}}{{{c|l}}}ip-path:polygon(-50% 50%,50% 100%,150% 50%,50% 0);overflow:clip;background:{{{b|#ddd}}};"><div style="grid-area:1/1;">{{{1|&ZeroWidthSpace;}}}</div><div style="grid-area:1/1;rotate:calc(({{{ar|0}}} + {{{|.5}}})*60deg);height:100%"><div style="aspect-ratio:3/4;height:25%;clip-path:polygon(25% 0,25% 50%,0 50%,50% 100%,100% 50%,75% 50%,75% 0);background:{{{ac|#0000}}}"></div></div><div style="grid-area:1/1;">{{{1|&ZeroWidthSpace;}}}</div><div style="grid-area:1/1;rotate:calc({{{r|0}}}*-30deg);color:{{{tc|#fff}}};font-family:Roboto,Arial,sans-serif;font-weight:900;font-size:28px;-webkit-text-stroke:1.2px {{{to|#000}}};">{{{t|&ZeroWidthSpace;}}}</div></div></onlyinclude>


== Parameters ==
== Parameters ==


<div style="display:grid;grid-template-columns:min-content min-content 18rem min-content 1fr;gap:0.25rem;overflow:auto;text-overflow:ellipsis;">
<div style="display:grid;grid-template-columns:repeat(5,max-content) 1fr;gap:0 0.25rem;overflow:auto;text-overflow:ellipsis;">
   <div style="font-weight:bold;width:8rem;">Parameter</div>
   <div>{{text|w=bold|Id}}</div>
   <div style="font-weight:bold;width:8rem;">Default value</div>
  <div>{{text|w=bold|Name}}</div>
   <div style="font-weight:bold;width:8rem;">Example</div>
   <div>{{text|w=bold|Default}}</div>
   <div style="font-weight:bold;width:8rem;">Result</div>
   <div>{{text|w=bold|Example}}</div>
   <div style="font-weight:bold;width:8rem;">Description</div>
   <div>{{text|w=bold|Result}}</div>
   <div><code>1</code></div>
   <div>{{text|w=bold|Description}}</div>
   <div><code>&amp;ZeroWidthSpace;</code></div>
   <div>1</div>
   <div><code><nowiki>{{hex |{{TaluvaClearing}} }}</nowiki></code></div>
   <div>Image</div>
   <div>{{hex |{{TaluvaClearing}} }}</div>
  <div>empty</div>
   <div>'''''Optional:''''' specify a '''[[Template:GameIcon]]''' image.</div>
   <div>{{code|<nowiki>{{hex</nowiki>{{text|<nowiki>|{{TaluvaClearing}}</nowiki>|#dfd}}<nowiki>}}</nowiki>}}</div>
   <div><code>2</code></div>
   <div>{{hex|{{TaluvaClearing}}}}</div>
   <div><code>&amp;ZeroWidthSpace;</code></div>
   <div>'''''Optional:''''' '''[[Template:GameIcon]]''' image.</div>
   <div><code><nowiki>{{hex | |1 }}</nowiki></code></div>
   <div>{{code|r}}</div>
   <div>{{hex | |1 }}</div>
  <div>Rotation</div>
   <div>'''''Optional:''''' specify a text value.</div>
  <div>{{code|0}}</div>
   <div><code>textColor</code></div>
  <div>{{code|<nowiki>{{hex|{{TaluvaClearing}}</nowiki>{{text|<nowiki>|r=1</nowiki>|#dfd}}<nowiki>}}</nowiki>}}</div>
   <div><code>#fff</code> (white)</div>
   <div>{{hex|{{TaluvaClearing}}|r=1}}</div>
   <div><code><nowiki>{{hex | |1 |textColor=green }}</nowiki></code></div>
  <div>'''''Optional:''''' rotation in units of 30° ({{code|0}}-{{code|11}}).</div>
   <div>{{hex | |1 |textColor=green }}</div>
  <div>{{code|f}}</div>
   <div>'''''Optional:''''' specify the text color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color].</div>
  <div>Flat-top</div>
   <div><code>textOutline</code></div>
   <div>empty</div>
   <div><code>#000</code> (black)</div>
  <div>{{code|<nowiki>{{hex</nowiki>{{text|<nowiki>|f=</nowiki>|#dfd}}<nowiki>}}</nowiki>}}</div>
   <div><code><nowiki>{{hex | |1 |textOutline=green }}</nowiki></code></div>
  <div>{{hex|f=}}</div>
   <div>{{hex | |1 |textOutline=green }}</div>
  <div>'''''Optional:''''' transform to a flat-top hex.</div>
   <div>'''''Optional:''''' specify the text outline color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color].</div>
  <div>{{code|ac}}</div>
   <div><code>bg</code></div>
  <div>Arrow color</div>
   <div><code>#ddd</code></div>
  <div>transparent</div>
   <div><code><nowiki>{{hex |bg=green }}</nowiki></code></div>
   <div>{{code|<nowiki>{{hex</nowiki>{{text|<nowiki>|ac=green</nowiki>|#dfd}}<nowiki>}}</nowiki>}}</div>
   <div>{{hex |bg=green }}</div>
  <div>{{hex|ac=green}}</div>
   <div>'''''Optional:''''' specify the background as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color].</div>
   <div>'''''Optional:''''' arrow color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color].</div>
   <div><code>rounded</code></div>
   <div>{{code|ar}}</div>
   <div><code>n/a</code></div>
  <div>Arrow rotation</div>
   <div><code><nowiki>{{hex |rounded= }}</nowiki></code></div>
  <div>{{code|0}}</div>
   <div>{{hex |rounded= }}</div>
  <div>{{code|<nowiki>{{hex|ac=black</nowiki>{{text|<nowiki>|ar=1</nowiki>|#dfd}}<nowiki>}}</nowiki>}}</div>
  <div>{{hex|ac=black|ar=1}}</div>
  <div>'''''Optional:''''' arrow rotation in units of 60° ({{code|0}}-{{code|5}}).</div>
  <div>{{code|t}}</div>
  <div>Text</div>
   <div>empty</div>
  <div>{{code|<nowiki>{{hex</nowiki>{{text|<nowiki>|t=1</nowiki>|#dfd}}<nowiki>}}</nowiki>}}</div>
  <div>{{hex|t=1}}</div>
  <div>'''''Optional:''''' text value.</div>
  <div>{{code|tc}}</div>
  <div>Text color</div>
  <div>white</div>
   <div>{{code|<nowiki>{{hex|t=1</nowiki>{{text|<nowiki>|tc=green</nowiki>|#dfd}}<nowiki>}}</nowiki>}}</div>
   <div>{{hex|t=1|tc=green}}</div>
   <div>'''''Optional:''''' text color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color].</div>
   <div>{{code|to}}</div>
   <div>Text outline</div>
  <div>black</div>
   <div>{{code|<nowiki>{{hex|t=1</nowiki>{{text|<nowiki>|to=green</nowiki>|#dfd}}<nowiki>}}</nowiki>}}</div>
   <div>{{hex|t=1|to=green}}</div>
   <div>'''''Optional:''''' text outline color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color].</div>
   <div>{{code|b}}</div>
  <div>Background</div>
   <div>{{code|#ddd}}</div>
   <div>{{code|<nowiki>{{hex</nowiki>{{text|<nowiki>|b=green</nowiki>|#dfd}}<nowiki>}}</nowiki>}}</div>
   <div>{{hex|b=green}}</div>
   <div>'''''Optional:''''' background as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color].</div>
   <div>{{code|c}}</div>
  <div>Corners</div>
   <div>n/a</div>
   <div>{{code|<nowiki>{{hex</nowiki>{{text|<nowiki>|c=</nowiki>|#dfd}}<nowiki>}}</nowiki>}}</div>
   <div>{{hex|c=}}</div>
   <div>'''''Optional:''''' rounded corners.</div>
   <div>'''''Optional:''''' rounded corners.</div>
   <div><code>w</code></div>
   <div>{{code|w}}</div>
   <div><code>67.195</code></div>
  <div>Width</div>
   <div><code><nowiki>{{hex |w=50 }}</nowiki></code></div>
   <div>{{code|67.195}}</div>
   <div>{{hex |w=50 }}</div>
   <div>{{code|<nowiki>{{hex</nowiki>{{text|<nowiki>|w=50</nowiki>|#dfd}}<nowiki>}}</nowiki>}}</div>
   <div>'''''Optional:''''' specify the width of the hex.</div>
   <div>{{hex|w=50}}</div>
   <div><code>x</code></div>
   <div>'''''Optional:''''' width of the hex.</div>
   <div><code>1</code></div>
   <div>{{code|x}}</div>
   <div><code><nowiki>{{hex |x=3 }}</nowiki></code></div>
  <div>X</div>
   <div>{{hex |x=3 }}</div>
   <div>{{code|1}}</div>
   <div>'''''Optional:''''' specify the x co-ordinate of the hex on a '''[[Template:HexMap]]'''.</div>
   <div>{{code|<nowiki>{{hex</nowiki>{{text|<nowiki>|x=3</nowiki>|#dfd}}<nowiki>}}</nowiki>}}</div>
   <div><code>y</code></div>
   <div>{{hex|x=3}}</div>
   <div><code>1</code></div>
   <div>'''''Optional:''''' x coordinate of the hex on a '''[[Template:HexMap]]'''.</div>
   <div><code><nowiki>{{hex |y=2 }}</nowiki></code></div>
   <div>{{code|y}}</div>
   <div>{{hex |y=2 }}</div>
  <div>Y</div>
   <div>'''''Optional:''''' specify the y co-ordinate of the hex on a '''[[Template:HexMap]]'''.</div>
   <div>{{code|1}}</div>
   <div><code>z</code></div>
   <div>{{code|<nowiki>{{hex</nowiki>{{text|<nowiki>|y=2</nowiki>|#dfd}}<nowiki>}}</nowiki>}}</div>
  <div><code>null</code></div>
   <div>{{hex|y=2}}</div>
  <div><code><nowiki>{{hex |z=2 }}</nowiki></code></div>
   <div>'''''Optional:''''' y coordinate of the hex on a '''[[Template:HexMap]]'''.</div>
  <div>{{hex |z=2 }}</div>
   <div>{{code|z}}</div>
   <div>'''''Optional:''''' specify the z-axis position.</div>
   <div>Z</div>
   <div><code>r</code></div>
   <div>empty</div>
   <div><code>0</code></div>
   <div>{{code|<nowiki>{{hex</nowiki>{{text|<nowiki>|z=2</nowiki>|#dfd}}<nowiki>}}</nowiki>}}</div>
  <div><code><nowiki>{{hex |r=1 |🡅 }}</nowiki></code></div>
   <div>{{hex|z=2}}</div>
  <div>{{hex |r=1 |🡅 }}</div>
   <div>'''''Optional:''''' z-axis position stacking order.</div>
  <div>'''''Optional:''''' specify the rotation in units of 30° (<code>0</code>-<code>11</code>).</div>
  <div><code>null</code></div>
  <div><code>n/a</code></div>
  <div><code><nowiki>{{hex |= |🡅 }}</nowiki></code></div>
   <div>{{hex |= |🡅 }}</div>
   <div>'''''Optional:''''' transform to a flat-top hex.</div>
</div>
</div>
<noinclude>
== [[:Category:ShapeTemplates]] ==
{{Category:ShapeTemplates}}


[[Category:GameBoardTemplates]]
== Pages using {{FULLPAGENAME}} ==
{{Special:WhatLinksHere/{{FULLPAGENAME}}}}
</noinclude>
</noinclude>
[[Category:ShapeTemplates]]

Revision as of 17:35, 2 December 2025

​
​
​

Parameters

Id
Name
Default
Example
Result
Description
1
Image
empty
{{hex|{{TaluvaClearing}}}}
Clearing​
Clearing​
​
Optional: Template:GameIcon image.
r
Rotation
0
{{hex|{{TaluvaClearing}}|r=1}}
Clearing​
Clearing​
​
Optional: rotation in units of 30° (0-11).
f
Flat-top
empty
{{hex|f=}}
​
​
​
Optional: transform to a flat-top hex.
ac
Arrow color
transparent
{{hex|ac=green}}
​
​
​
Optional: arrow color as a CSS color.
ar
Arrow rotation
0
{{hex|ac=black|ar=1}}
​
​
​
Optional: arrow rotation in units of 60° (0-5).
t
Text
empty
{{hex|t=1}}
​
​
1
Optional: text value.
tc
Text color
white
{{hex|t=1|tc=green}}
​
​
1
Optional: text color as a CSS color.
to
Text outline
black
{{hex|t=1|to=green}}
​
​
1
Optional: text outline color as a CSS color.
b
Background
#ddd
{{hex|b=green}}
​
​
​
Optional: background as a CSS color.
c
Corners
n/a
{{hex|c=}}
​
​
​
Optional: rounded corners.
w
Width
67.195
{{hex|w=50}}
​
​
​
Optional: width of the hex.
x
X
1
{{hex|x=3}}
​
​
​
Optional: x coordinate of the hex on a Template:HexMap.
y
Y
1
{{hex|y=2}}
​
​
​
Optional: y coordinate of the hex on a Template:HexMap.
z
Z
empty
{{hex|z=2}}
​
​
​
Optional: z-axis position stacking order.

Category:ShapeTemplates

Category:ShapeTemplates

Pages using Template:Hex

Retrieved from "http:///index.php?title=Template:Hex&oldid=27474"