ANimates text in twine?

Authoring Twine
1

Please specify version and format if asking for help, or apply optional tags above:
Twine Version:2.3.9
Story Format: Sugarcube 2.31.1

Heya!

I found this website that did animated text and wanted to know how to translate it to suguarcube?

I just want certain buts of text to have this style and wondered if it was somehting just to put in the segment i was working on or something to put in ther story script?

2

Basically, just click the down arrow in the upper-right of the “CSS” section, select “View Compiled CSS” (which will compile the SCSS to CSS), and then copy that CSS to your game’s Stylesheet section.

You’ll need to fix one thing by adding “position: absolute;” to the “.c-rainbow__layer:nth-child(1) {” part, like this:

.c-rainbow__layer:nth-child(1) {
	position: absolute;
	animation-delay: calc( 1 / var(--delay) * 1s);
	left: calc(var(--axis-x) * 1);
	z-index: -10;
}

Then you can just copy the HTML to the passage where you want it to make it do that.

You’ll need to fiddle around with the CSS to get it positioned and styled the way you want, but that should get it working in Twine.

Enjoy! :grinning: