User talk:Eli

Fog over Zero

Hey,

I made a crude first version rendition of the foggy effect over the word Zero, if ever we want that in the wiki. Works with Template:Zero.

Can you add this in MediaWiki:Vector.css:

@supports (background-clip: text) or (-webkit-background-clip: text) {
	@keyframes zero {
		from	{ background-position: 0% center; }
		to	{ background-position: 100% center; }
	}
	.zero {
		background-image: url(Zero_Fog.png);
		animation-name: zero;
		animation-duration: 10s;
		animation-timing-function: linear;
		animation-iteration-count: infinite;
		-webkit-background-clip: text;	
		background-clip: text;
		color: rgba(0,0,0,0);
	}
}

Zero_Fog.png is there: File:Zero Fog.png. Lots to improve, but it’s bed time for me.

Thanks!

Nclm (talk) 23:08, 31 January 2018 (UTC)

Oh wow, this is SO super impressive. Thank you so much!!! I was wanting to do something like this, but wasn't exactly sure how to do it with a background image and CSS animations. I've added it now and it looks great: Zero. It would be cool if this could be used in links, too, if you'd have any ideas there. This also gets me thinking that we could add support for the other fonts sometimes found throughout the game, too, such as the style used when reading text on computers (just a different font should probably suffice for this, i.e. span class that just switches text to Letter Gothic). Thanks again!

–Eli (talk) 00:21, 1 February 2018 (UTC)

Expanded it slightly to support fog over other text, too. –Eli (talk) 00:35, 1 February 2018 (UTC)