Permalink
Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
47 lines (32 sloc) 1.13 KB

"Variable Story Styling": SugarCube (v2.18)

Summary

"Variable Story Styling" demonstrates how to use the <<toggleClass>> macro to switch between two pre-defined style rulesets. Combined with the “body” selector, the entire page is selected and the classes are switched when the macro is used.

Live Example

<iframe src="sugarcube_storystyling_example.html" height=400 width=90%></iframe>

Download: Live Example

Twee Code

:: StoryTitle
Variable Story Styling in SugarCube

:: UserStylesheet[stylesheet]
.green {
	background: white;
  	color: green;
}
.white {
	background: black;
  	color: white;
}

:: Start
<<set $classToShow to "green">>
This text is green on a white background.
<<toggleclass "body" $classToShow>>
[[Next Passage]]

:: Next Passage
<<set $classToShow to "white">>
This text is white on a black background.
<<toggleclass "body" $classToShow>>

Download: Twee Code