Template:Hex - Revision history

Sammy McSam at 14:31, 9 December 2025

2025-12-09T14:31:55Z

← Older revision		Revision as of 16:31, 9 December 2025
Line 1:		Line 1:
	<onlyinclude><div style="container-type:size;display:inline-grid;place-items:center;grid-area:{{{y\|1}}}/{{{x\|1}}}/span 1/span 2;z-index:{{{z}}};position:relative;left:calc(-1{{{l\|0}}}px);top:calc(-1{{{u\|0}}}px);{{{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(		<onlyinclude><div style="container-type:size;display:inline-grid;place-items:center;grid-area:{{{y\|1}}}/{{{x\|1}}}/span 1/span 2;z-index:{{{z}}};position:relative;left:calc(-1px({{{l\|0}}}));top:calc(-1px({{{u\|0}}}));{{{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%,

Sammy McSam: u & l

2025-12-09T14:29:36Z

u & l

Show changes

Sammy McSam: arrow, rotation & stack order, responsive ew & font-size

2025-12-06T21:37:45Z

arrow, rotation & stack order, responsive ew & font-size

← Older revision		Revision as of 23:37, 6 December 2025
Line 1:		Line 1:
	<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(		<onlyinclude><div style="container-type:size;display:inline-grid;place-items:center;grid-area:{{{y\|1}}}/{{{x\|1}}}/span 1/span 2;z-index:{{{z}}};{{{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 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{{{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;width:100%;height:100%;clip-path:polygon(0 50%,50% -50%,100% 50%,50% 150%,0 50%,{{{ew\|4}}}px 50%,calc(25% + {{{ew\|4}}}pxcos(60deg)) calc(100% - {{{ew\|4}}}pxsin(60deg)),calc(75% - {{{ew\|4}}}pxcos(60deg)) calc(100% - {{{ew\|4}}}pxsin(60deg)),calc(100% - {{{ew\|4}}}px) 50%,calc(75% - {{{ew\|4}}}pxcos(60deg)) calc({{{ew\|4}}}pxsin(60deg)),calc(25% + {{{ew\|4}}}pxcos(60deg)) calc({{{ew\|4}}}pxsin(60deg)),{{{ew\|4}}}px 50%);{{{f\|c}}}lip-path:polygon(50% 0,-50% 50%,50% 100%,150% 50%,50% 0,50% {{{ew\|4}}}px,calc(100% - {{{ew\|4}}}pxsin(60deg)) calc(25% + {{{ew\|4}}}pxcos(60deg)),calc(100% - {{{ew\|4}}}pxsin(60deg)) calc(75% - {{{ew\|4}}}pxcos(60deg)),50% calc(100% - {{{ew\|4}}}px),calc({{{ew\|4}}}pxsin(60deg)) calc(75% - {{{ew\|4}}}pxcos(60deg)),calc({{{ew\|4}}}pxsin(60deg)) calc(25% + {{{ew\|4}}}pxcos(60deg)),50% {{{ew\|4}}}px);background:{{{ec\|#0000}}}"></div><div style="grid-area:1/1;height:100%;rotate:calc(({{{ar\|0}}}{{{f\| + .5}}})60deg)~~"><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~~;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>		);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;rotate:calc({{{r\|0}}}*60deg);">{{{1\|&ZeroWidthSpace;}}}</div><div style="grid-area:1/1;width:100%;height:100%;clip-path:polygon(
			0 50%,50% -50%,100% 50%,50% 150%,0 50%,
			{{{ew\|8}}}% 50%,
			calc(25% + {{{ew\|8}}}%cos(60deg)) calc(100% - {{{ew\|8}}}%sin(60deg)),
			calc(75% - {{{ew\|8}}}%cos(60deg)) calc(100% - {{{ew\|8}}}%sin(60deg)),
			calc(100% - {{{ew\|8}}}%) 50%,
			calc(75% - {{{ew\|8}}}%cos(60deg)) calc({{{ew\|8}}}%sin(60deg)),
			calc(25% + {{{ew\|8}}}%cos(60deg)) calc({{{ew\|8}}}%sin(60deg)),
			{{{ew\|8}}}% 50%
			);{{{f\|c}}}lip-path:polygon(
			50% 0,-50% 50%,50% 100%,150% 50%,50% 0,
			50% {{{ew\|8}}}%,
			calc(100% - {{{ew\|8}}}%sin(60deg)) calc(25% + {{{ew\|8}}}%cos(60deg)),
			calc(100% - {{{ew\|8}}}%sin(60deg)) calc(75% - {{{ew\|8}}}%cos(60deg)),
			50% calc(100% - {{{ew\|8}}}%),
			calc({{{ew\|8}}}%sin(60deg)) calc(75% - {{{ew\|8}}}%cos(60deg)),
			calc({{{ew\|8}}}%sin(60deg)) calc(25% + {{{ew\|8}}}%cos(60deg)),
			50% {{{ew\|8}}}%
			);background:{{{ec\|#0000}}}"></div><div style="grid-area:1/1;height:100%;width:100%;rotate:calc(({{{ar\|0}}}{{{f\| + 2}}})*60deg);clip-path:polygon(
			45% 0,45% 7%,40% 7%,50% 20%,60% 7%,55% 7%,55% 0
			);{{{f\|c}}}lip-path:polygon(
			0 45%,7% 45%,7% 40%,20% 50%,7% 60%,7% 55%,0 55%
			);background:{{{ac\|#0000}}}"></div><div style="grid-area:1/1;color:{{{tc\|#fff}}};font-family:Roboto,Arial,sans-serif;font-weight:900;font-size:clamp(1rem,45cqmin,28px);-webkit-text-stroke:1.2px {{{to\|#000}}};z-index:0">{{{t\|&ZeroWidthSpace;}}}</div></div></onlyinclude>

	== Parameters ==		== Parameters ==
Line 35:		Line 57:
	<div>{{code\|<nowiki>{{hex\|{{TaluvaClearing}}</nowiki>{{text\|<nowiki>\|r=1</nowiki>\|#dfd}}<nowiki>}}</nowiki>}}</div>		<div>{{code\|<nowiki>{{hex\|{{TaluvaClearing}}</nowiki>{{text\|<nowiki>\|r=1</nowiki>\|#dfd}}<nowiki>}}</nowiki>}}</div>
	<div>{{hex\|{{TaluvaClearing}}\|r=1}}</div>		<div>{{hex\|{{TaluvaClearing}}\|r=1}}</div>
	<div>'''''Optional:''''' rotation in units of ~~30°~~ ({{code\|0}}-{{code\|11}}).</div>		<div>'''''Optional:''''' rotation in units of 60° ({{code\|0}}-{{code\|5}}).</div>
	<div>{{code\|f}}</div>		<div>{{code\|f}}</div>
	<div>Flat-top</div>		<div>Flat-top</div>
Line 62:		Line 84:
	<div>{{code\|ew}}</div>		<div>{{code\|ew}}</div>
	<div>Edge width</div>		<div>Edge width</div>
	<div>{{code\|4}}</div>		<div>{{code\|8}}</div>
	<div>{{code\|<nowiki>{{hex\|ec=black</nowiki>{{text\|<nowiki>\|ew=8</nowiki>\|#dfd}}<nowiki>}}</nowiki>}}</div>		<div>{{code\|<nowiki>{{hex\|ec=black</nowiki>{{text\|<nowiki>\|ew=12</nowiki>\|#dfd}}<nowiki>}}</nowiki>}}</div>
	<div>{{hex\|ec=black\|ew=8}}</div>		<div>{{hex\|ec=black\|ew=12}}</div>
	<div>'''''Optional:''''' edge width ~~in pixels~~.</div>		<div>'''''Optional:''''' edge width as a percentage of the hex width.</div>
	<div>{{code\|ac}}</div>		<div>{{code\|ac}}</div>
	<div>Arrow color</div>		<div>Arrow color</div>
Line 106:		Line 128:
	<div>{{code\|1}}</div>		<div>{{code\|1}}</div>
	<div>{{code\|<nowiki>{{hex</nowiki>{{text\|<nowiki>\|x=3</nowiki>\|#dfd}}<nowiki>}}</nowiki>}}</div>		<div>{{code\|<nowiki>{{hex</nowiki>{{text\|<nowiki>\|x=3</nowiki>\|#dfd}}<nowiki>}}</nowiki>}}</div>
	<div>~~{{hex\|x=3}}~~</div>		<div></div>
	<div>'''''Optional:''''' x coordinate of the hex on a '''[[Template:HexMap]]'''.</div>		<div>'''''Optional:''''' x coordinate of the hex on a '''[[Template:HexMap]]'''.</div>
	<div>{{code\|y}}</div>		<div>{{code\|y}}</div>
Line 112:		Line 134:
	<div>{{code\|1}}</div>		<div>{{code\|1}}</div>
	<div>{{code\|<nowiki>{{hex</nowiki>{{text\|<nowiki>\|y=2</nowiki>\|#dfd}}<nowiki>}}</nowiki>}}</div>		<div>{{code\|<nowiki>{{hex</nowiki>{{text\|<nowiki>\|y=2</nowiki>\|#dfd}}<nowiki>}}</nowiki>}}</div>
	<div>~~{{hex\|y=2}}~~</div>		<div></div>
	<div>'''''Optional:''''' y coordinate of the hex on a '''[[Template:HexMap]]'''.</div>		<div>'''''Optional:''''' y coordinate of the hex on a '''[[Template:HexMap]]'''.</div>
	<div>{{code\|z}}</div>		<div>{{code\|z}}</div>
Line 118:		Line 140:
	<div>empty</div>		<div>empty</div>
	<div>{{code\|<nowiki>{{hex</nowiki>{{text\|<nowiki>\|z=2</nowiki>\|#dfd}}<nowiki>}}</nowiki>}}</div>		<div>{{code\|<nowiki>{{hex</nowiki>{{text\|<nowiki>\|z=2</nowiki>\|#dfd}}<nowiki>}}</nowiki>}}</div>
	<div>~~{{hex\|z=2}}~~</div>		<div></div>
	<div>'''''Optional:''''' z-axis position stacking order.</div>		<div>'''''Optional:''''' z-axis position stacking order.</div>
	</div>		</div>

Sammy McSam: ar

2025-12-06T00:44:14Z

← Older revision		Revision as of 02:44, 6 December 2025
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{{{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;width:100%;height:100%;clip-path:polygon(0 50%,50% -50%,100% 50%,50% 150%,0 50%,{{{ew\|4}}}px 50%,calc(25% + {{{ew\|4}}}pxcos(60deg)) calc(100% - {{{ew\|4}}}pxsin(60deg)),calc(75% - {{{ew\|4}}}pxcos(60deg)) calc(100% - {{{ew\|4}}}pxsin(60deg)),calc(100% - {{{ew\|4}}}px) 50%,calc(75% - {{{ew\|4}}}pxcos(60deg)) calc({{{ew\|4}}}pxsin(60deg)),calc(25% + {{{ew\|4}}}pxcos(60deg)) calc({{{ew\|4}}}pxsin(60deg)),{{{ew\|4}}}px 50%);{{{f\|c}}}lip-path:polygon(50% 0,-50% 50%,50% 100%,150% 50%,50% 0,50% {{{ew\|4}}}px,calc(100% - {{{ew\|4}}}pxsin(60deg)) calc(25% + {{{ew\|4}}}pxcos(60deg)),calc(100% - {{{ew\|4}}}pxsin(60deg)) calc(75% - {{{ew\|4}}}pxcos(60deg)),50% calc(100% - {{{ew\|4}}}px),calc({{{ew\|4}}}pxsin(60deg)) calc(75% - {{{ew\|4}}}pxcos(60deg)),calc({{{ew\|4}}}pxsin(60deg)) calc(25% + {{{ew\|4}}}pxcos(60deg)),50% {{{ew\|4}}}px);background:{{{ec\|#0000}}}"></div><div style="grid-area:1/1;height:100%;rotate:calc(({{{ar\|0}}} + {{{f\|.5}}})60deg)"><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;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>		);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;width:100%;height:100%;clip-path:polygon(0 50%,50% -50%,100% 50%,50% 150%,0 50%,{{{ew\|4}}}px 50%,calc(25% + {{{ew\|4}}}pxcos(60deg)) calc(100% - {{{ew\|4}}}pxsin(60deg)),calc(75% - {{{ew\|4}}}pxcos(60deg)) calc(100% - {{{ew\|4}}}pxsin(60deg)),calc(100% - {{{ew\|4}}}px) 50%,calc(75% - {{{ew\|4}}}pxcos(60deg)) calc({{{ew\|4}}}pxsin(60deg)),calc(25% + {{{ew\|4}}}pxcos(60deg)) calc({{{ew\|4}}}pxsin(60deg)),{{{ew\|4}}}px 50%);{{{f\|c}}}lip-path:polygon(50% 0,-50% 50%,50% 100%,150% 50%,50% 0,50% {{{ew\|4}}}px,calc(100% - {{{ew\|4}}}pxsin(60deg)) calc(25% + {{{ew\|4}}}pxcos(60deg)),calc(100% - {{{ew\|4}}}pxsin(60deg)) calc(75% - {{{ew\|4}}}pxcos(60deg)),50% calc(100% - {{{ew\|4}}}px),calc({{{ew\|4}}}pxsin(60deg)) calc(75% - {{{ew\|4}}}pxcos(60deg)),calc({{{ew\|4}}}pxsin(60deg)) calc(25% + {{{ew\|4}}}pxcos(60deg)),50% {{{ew\|4}}}px);background:{{{ec\|#0000}}}"></div><div style="grid-area:1/1;height:100%;rotate:calc(({{{ar\|0}}}{{{f\| + .5}}})60deg)"><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;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 ==

Sammy McSam at 23:12, 5 December 2025

2025-12-05T23:12:55Z

← Older revision		Revision as of 01:12, 6 December 2025
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{{{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;width:100%;height:100%;clip-path:polygon(0 50%,50% -50%,100% 50%,50% 150%,0 50%,{{{ew\|4}}}px 50%,calc(25% + {{{ew\|4}}}pxcos(60deg)) calc(100% - {{{ew\|4}}}pxsin(60deg)),calc(75% - {{{ew\|4}}}pxcos(60deg)) calc(100% - {{{ew\|4}}}pxsin(60deg)),calc(100% - {{{ew\|4}}}px) 50%,calc(75% - {{{ew\|4}}}pxcos(60deg)) calc({{{ew\|4}}}pxsin(60deg)),calc(25% + {{{ew\|4}}}pxcos(60deg)) calc({{{ew\|4}}}pxsin(60deg)),{{{ew\|4}}}px 50%);{{{f\|c}}}lip-path:polygon(50% 0,-50% 50%,50% 100%,150% 50%,50% 0,50% {{{ew\|4}}}px,calc(100% - {{{ew\|4}}}pxsin(60deg)) calc(25% + {{{ew\|4}}}pxcos(60deg)),calc(100% - {{{ew\|4}}}pxsin(60deg)) calc(75% - {{{ew\|4}}}pxcos(60deg)),50% calc(100% - {{{ew\|4}}}px),calc({{{ew\|4}}}pxsin(60deg)) calc(75% - {{{ew\|4}}}pxcos(60deg)),calc({{{ew\|4}}}pxsin(60deg)) calc(25% + {{{ew\|4}}}pxcos(60deg)),50% {{{ew\|4}}}px);background:{{{ec\|#0000}}}"></div><div style="grid-area:1/1;height:100%;rotate:calc(({{{ar\|0}}} + {{{f\|.5}}})60deg)"><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>		);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;width:100%;height:100%;clip-path:polygon(0 50%,50% -50%,100% 50%,50% 150%,0 50%,{{{ew\|4}}}px 50%,calc(25% + {{{ew\|4}}}pxcos(60deg)) calc(100% - {{{ew\|4}}}pxsin(60deg)),calc(75% - {{{ew\|4}}}pxcos(60deg)) calc(100% - {{{ew\|4}}}pxsin(60deg)),calc(100% - {{{ew\|4}}}px) 50%,calc(75% - {{{ew\|4}}}pxcos(60deg)) calc({{{ew\|4}}}pxsin(60deg)),calc(25% + {{{ew\|4}}}pxcos(60deg)) calc({{{ew\|4}}}pxsin(60deg)),{{{ew\|4}}}px 50%);{{{f\|c}}}lip-path:polygon(50% 0,-50% 50%,50% 100%,150% 50%,50% 0,50% {{{ew\|4}}}px,calc(100% - {{{ew\|4}}}pxsin(60deg)) calc(25% + {{{ew\|4}}}pxcos(60deg)),calc(100% - {{{ew\|4}}}pxsin(60deg)) calc(75% - {{{ew\|4}}}pxcos(60deg)),50% calc(100% - {{{ew\|4}}}px),calc({{{ew\|4}}}pxsin(60deg)) calc(75% - {{{ew\|4}}}pxcos(60deg)),calc({{{ew\|4}}}pxsin(60deg)) calc(25% + {{{ew\|4}}}pxcos(60deg)),50% {{{ew\|4}}}px);background:{{{ec\|#0000}}}"></div><div style="grid-area:1/1;height:100%;rotate:calc(({{{ar\|0}}} + {{{f\|.5}}})60deg)"><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;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 ==

Sammy McSam: ar

2025-12-05T23:09:54Z

← Older revision		Revision as of 01:09, 6 December 2025
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{{{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;width:100%;height:100%;clip-path:polygon(0 50%,50% -50%,100% 50%,50% 150%,0 50%,{{{ew\|4}}}px 50%,calc(25% + {{{ew\|4}}}pxcos(60deg)) calc(100% - {{{ew\|4}}}pxsin(60deg)),calc(75% - {{{ew\|4}}}pxcos(60deg)) calc(100% - {{{ew\|4}}}pxsin(60deg)),calc(100% - {{{ew\|4}}}px) 50%,calc(75% - {{{ew\|4}}}pxcos(60deg)) calc({{{ew\|4}}}pxsin(60deg)),calc(25% + {{{ew\|4}}}pxcos(60deg)) calc({{{ew\|4}}}pxsin(60deg)),{{{ew\|4}}}px 50%);{{{f\|c}}}lip-path:polygon(50% 0,-50% 50%,50% 100%,150% 50%,50% 0,50% {{{ew\|4}}}px,calc(100% - {{{ew\|4}}}pxsin(60deg)) calc(25% + {{{ew\|4}}}pxcos(60deg)),calc(100% - {{{ew\|4}}}pxsin(60deg)) calc(75% - {{{ew\|4}}}pxcos(60deg)),50% calc(100% - {{{ew\|4}}}px),calc({{{ew\|4}}}pxsin(60deg)) calc(75% - {{{ew\|4}}}pxcos(60deg)),calc({{{ew\|4}}}pxsin(60deg)) calc(25% + {{{ew\|4}}}pxcos(60deg)),50% {{{ew\|4}}}px);background:{{{ec\|#0000}}}"></div><div style="grid-area:1/1;height:100%;rotate:calc(({{{ar\|0}}} + {{{\|.5}}})60deg)"><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>		);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;width:100%;height:100%;clip-path:polygon(0 50%,50% -50%,100% 50%,50% 150%,0 50%,{{{ew\|4}}}px 50%,calc(25% + {{{ew\|4}}}pxcos(60deg)) calc(100% - {{{ew\|4}}}pxsin(60deg)),calc(75% - {{{ew\|4}}}pxcos(60deg)) calc(100% - {{{ew\|4}}}pxsin(60deg)),calc(100% - {{{ew\|4}}}px) 50%,calc(75% - {{{ew\|4}}}pxcos(60deg)) calc({{{ew\|4}}}pxsin(60deg)),calc(25% + {{{ew\|4}}}pxcos(60deg)) calc({{{ew\|4}}}pxsin(60deg)),{{{ew\|4}}}px 50%);{{{f\|c}}}lip-path:polygon(50% 0,-50% 50%,50% 100%,150% 50%,50% 0,50% {{{ew\|4}}}px,calc(100% - {{{ew\|4}}}pxsin(60deg)) calc(25% + {{{ew\|4}}}pxcos(60deg)),calc(100% - {{{ew\|4}}}pxsin(60deg)) calc(75% - {{{ew\|4}}}pxcos(60deg)),50% calc(100% - {{{ew\|4}}}px),calc({{{ew\|4}}}pxsin(60deg)) calc(75% - {{{ew\|4}}}pxcos(60deg)),calc({{{ew\|4}}}pxsin(60deg)) calc(25% + {{{ew\|4}}}pxcos(60deg)),50% {{{ew\|4}}}px);background:{{{ec\|#0000}}}"></div><div style="grid-area:1/1;height:100%;rotate:calc(({{{ar\|0}}} + {{{f\|.5}}})60deg)"><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 ==

Sammy McSam: +edge

2025-12-05T20:52:13Z

+edge

@@ Line 13: / Line 13: @@
 % 33.2%,99.2% 29.7%,97.3% 26.2%,94.6% 23.1%,91.3% 20.7%,
 .7% 4.33%,54.6% 3.11%,50% 2.67%,45.4% 3.11%,41.3% 4.33%
-);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>
+);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;width:100%;height:100%;clip-path:polygon(0 50%,50% -50%,100% 50%,50% 150%,0 50%,{{{ew|4}}}px 50%,calc(25% + {{{ew|4}}}px*cos(60deg)) calc(100% - {{{ew|4}}}px*sin(60deg)),calc(75% - {{{ew|4}}}px*cos(60deg)) calc(100% - {{{ew|4}}}px*sin(60deg)),calc(100% - {{{ew|4}}}px) 50%,calc(75% - {{{ew|4}}}px*cos(60deg)) calc({{{ew|4}}}px*sin(60deg)),calc(25% + {{{ew|4}}}px*cos(60deg)) calc({{{ew|4}}}px*sin(60deg)),{{{ew|4}}}px 50%);{{{f|c}}}lip-path:polygon(50% 0,-50% 50%,50% 100%,150% 50%,50% 0,50% {{{ew|4}}}px,calc(100% - {{{ew|4}}}px*sin(60deg)) calc(25% + {{{ew|4}}}px*cos(60deg)),calc(100% - {{{ew|4}}}px*sin(60deg)) calc(75% - {{{ew|4}}}px*cos(60deg)),50% calc(100% - {{{ew|4}}}px),calc({{{ew|4}}}px*sin(60deg)) calc(75% - {{{ew|4}}}px*cos(60deg)),calc({{{ew|4}}}px*sin(60deg)) calc(25% + {{{ew|4}}}px*cos(60deg)),50% {{{ew|4}}}px);background:{{{ec|#0000}}}"></div><div style="grid-area:1/1;height:100%;rotate:calc(({{{ar|0}}} + {{{|.5}}})*60deg)"><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 ==
@@ Line 38: / Line 38: @@
    <div>{{code|f}}</div>
    <div>Flat-top</div>
-   <div>empty</div>
+   <div>pointed-top</div>
    <div>{{code|<nowiki>{{hex</nowiki>{{text|<nowiki>|f=</nowiki>|#dfd}}<nowiki>}}</nowiki>}}</div>
    <div>{{hex|f=}}</div>
    <div>'''''Optional:''''' transform to a flat-top hex.</div>
    <div>{{code|ac}}</div>
    <div>Arrow color</div>
@@ Line 72: / Line 96: @@
    <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|w}}</div>
    <div>Width</div>

Sammy McSam: +arrow from edge

2025-12-02T16:35:20Z

+arrow from edge

Show changes

Sammy McSam: parameters

2024-05-30T14:34:13Z

parameters

← Older revision		Revision as of 16:34, 30 May 2024
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 #000;">{{{2\|&ZeroWidthSpace;}}}</div></div><noinclude>		);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>

	== Parameters ==		== Parameters ==

	<div style="display:grid;grid-template-columns:~~5rem~~ min-content 18rem min-content 1fr;gap:0.25rem;overflow:auto;text-overflow:ellipsis;">		<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="font-weight:bold;width:8rem;">Parameter</div>		<div style="font-weight:bold;width:8rem;">Parameter</div>
	<div style="font-weight:bold;width:8rem;">Default value</div>		<div style="font-weight:bold;width:8rem;">Default value</div>
Line 33:		Line 33:
	<div>{{hex \| \|1 }}</div>		<div>{{hex \| \|1 }}</div>
	<div>'''''Optional:''''' specify a text value.</div>		<div>'''''Optional:''''' specify a text value.</div>
			<div><code>textColor</code></div>
			<div><code>#fff</code> (white)</div>
			<div><code><nowiki>{{hex \| \|1 \|textColor=green }}</nowiki></code></div>
			<div>{{hex \| \|1 \|textColor=green }}</div>
			<div>'''''Optional:''''' specify the text color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color].</div>
			<div><code>textOutline</code></div>
			<div><code>#000</code> (black)</div>
			<div><code><nowiki>{{hex \| \|1 \|textOutline=green }}</nowiki></code></div>
			<div>{{hex \| \|1 \|textOutline=green }}</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>bg</code></div>		<div><code>bg</code></div>
	<div><code>#ddd</code></div>		<div><code>#ddd</code></div>

Sammy McSam: replace text-shadow with -webkit-text-stroke

2024-05-30T14:17:14Z

replace text-shadow with -webkit-text-stroke

← Older revision		Revision as of 16:17, 30 May 2024
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:~~700~~;font-size:~~16px~~;text-~~shadow~~:0 0 2px {{{outlineColor\|#000}}},0 0 2px {{{outlineColor\|#000}}},0 0 2px {{{outlineColor\|#000}}},0 0 2px {{{outlineColor\|#000}}},0 0 2px {{{outlineColor\|#000}}},0 0 2px {{{outlineColor\|#000}}},0 0 2px {{{outlineColor\|#000}}},0 0 2px {{{outlineColor\|#000}}},0 0 2px {{{outlineColor\|#000}}},0 0 2px {{{outlineColor\|#000}}},0 0 2px {{{outlineColor\|#000}}},0 0 2px ~~{{{outlineColor\|~~#000~~}}}~~;">{{{2\|&ZeroWidthSpace;}}}</div></div><noinclude>		);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 #000;">{{{2\|&ZeroWidthSpace;}}}</div></div><noinclude>

	== Parameters ==		== Parameters ==
Line 30:		Line 30:
	<div><code>2</code></div>		<div><code>2</code></div>
	<div><code>&ZeroWidthSpace;</code></div>		<div><code>&ZeroWidthSpace;</code></div>
	<div><code><nowiki>{{hex \| \|A }}</nowiki></code></div>		<div><code><nowiki>{{hex \| \|1 }}</nowiki></code></div>
	<div>{{hex \| \|A }}</div>		<div>{{hex \| \|1 }}</div>
	<div>'''''Optional:''''' specify a text value.</div>		<div>'''''Optional:''''' specify a text value.</div>
	<div><code>bg</code></div>		<div><code>bg</code></div>