0 votes
asked by (150 points)
Okay, so this might take some explaining:

I've been writing this story/game for a while, and thanks to some excellent people (greyelf in particular), I was able to alter the CSS to color fonts of certain characters' speech. Now, years later, I'm trying to figure out if there's a way to alter the coding so that over time, a character's font would shift from one color to another by a variable change.

What I'm working with right now is something like this in the style sheet:

#passages .phaera {color: #FF69B4;}

#passages .raphael {color: #51B9DF;}

Now, what I'm currently doing to achieve the effect I'm going for in regular passages is this:

<<if $Status is 7>>@@.phaera;"TEXT"<<else>>@@.raphael;"TEXT"<<endif>>

You can see how that would get tiresome really quick.

Is there anyway of achieving the above by altering the css from without or within the style sheet?

1 Answer

+1 vote
answered by (22.3k points)

You could just make a widget in a passage tagged as "widget":

<<widget "color">><<nobr>>
	<<if $Status is 7>>@@.phaera;$args[0]<<else>>@@.raphael;$args[0]<<endif>>

Then you can just write:

<<color "TEXT">>


commented by (150 points)
Tried putting it in just as you had it. It didn't work quite right.

What does $args[0] represent?
commented by (1.2k points)

<<color>> is the widget name "TEXT" is the argument. Widgets take arguments as an array which are accessed as $args. If you only specify a single argument then it's the first slot in the array, [0].

If one writes a widget that uses multiple arguments then it could be something like this:

<<exampleWidget "argument0" "argument1" "argument2">>

In the code of the widget those variables would correspond like this:

  • $args[0] = "argument0"
  • $args[1] = "argument1"
  • $args[2] = "argument2"
So in idling's example $args[0] is the text you'd like styled.
commented by (131k points)

 It didn't work quite right.

Could you give more detail on what exactly wasn't right about that widget's behaviour?

commented by (22.3k points)

Here's the documentation for sugarcube 1 and sugarcube 2.

I'm afraid without knowing what doesn't work right for you I can only make guesses.

Be sure to put the widget into its own passage and don't forget to tag that passage. You also can't pass linebreaks so if you want a linebreak in your text, you'll have to do something like this:

<<color "line1<br>line2">>


commented by (150 points)

Okay... I actually looked into it a bit and realized that for the version I have, I needed to put the following:


<<widget "color">><<nobr>>
	<<if $Status is 7>>@@.phaera;<<print $args[0]>>@@<<else>>@@.raphael;<<print $args[0]>>@@<<endif>>

The <<print $args[0]>> was what I was missing. Sorry for the confusion, but thanks a LOT for the coding experience (not sarcasm, I genuinely appreciate the help). This should be a huge help going forward for my project.

commented by (1.2k points)

That's... odd. I've tested it without <<print>> and it works just fine. Naked variables and all that.

Welcome to Twine Q&A, where you can ask questions and receive answers from other members of the community.

You can also find hints and information on Twine on the official wiki and the old forums archive.

See a spam question? Flag it instead of downvoting. A question flagged enough times will automatically be hidden while moderators review it.