Re: [tweecode] Using multiple stylesheets?

399 views
Skip to first unread message

Christopher L

unread,
Mar 6, 2013, 1:48:30 PM3/6/13
to twee...@googlegroups.com
I don't know offhand if there's a macro to do it, but from the HTML side I would start by creating 3 classes, and having a stylesheet that produced different colors on each class:

.character1 a { color: red; }
.character2 a { color: blue; }

etc. Then you would have to switch the class attribute of the page, which would change all the colors automatically. How's Twine's jquery compatibility - anyone know?

On Wed, Mar 6, 2013 at 12:57 PM, holly <hab...@gmail.com> wrote:
I'm working on a Twine game which will have three POV characters, and to reflect switching between them I want to have the background colour and link colours change. I'm assuming the best way to do this is to set up a seperate stylesheet for each character, and using some macro-based thing to have the game switch to different stylesheets at story junctures. Is this possible? If not, how should I go about doing it?

--
You received this message because you are subscribed to the Google Groups "Tweecode / Twine" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tweecode+u...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 



--

Adventure Cow: Facebook | Twitter

HarmlessTrouble

unread,
Mar 6, 2013, 2:04:51 PM3/6/13
to twee...@googlegroups.com
You can  try keeping everything in one stylesheet passage and switch the body class.  and have a set of styles for each POV.

::POV Prue
<<set document.getElementsByTagName('body')[0].className ="povPrue">>

::POV Pheobe
<<set document.getElementsByTagName('body')[0].className ="povPheobe">>

::POV Piper
<<set document.getElementsByTagName('body')[0].className ="povPiper">>

Leon Arnott

unread,
Mar 6, 2013, 10:31:31 PM3/6/13
to twee...@googlegroups.com
I've written some code that's designed to let you use different styles on different passages: http://www.glorioustrainwrecks.com/node/5013 The idea is that you tag the passages with a specific tag, and then select the tag using [data-tags~=...]

It could be used by, say, tagging the passages with either "charA" or "charB", then writing CSS like so:
body[data-tags~=charA] { background-color: white; }
body[data-tags~=charA] a { color: red; }
body[data-tags~=charB] { background-color: green; }
body[data-tags~=charB] a { color: yellow; }

Christian Nelson

unread,
Apr 1, 2014, 10:56:29 PM4/1/14
to twee...@googlegroups.com

Tagged stylesheets

Normally, every stylesheet applies to all of the passages. If a passage has additional tags apart from 'stylesheet' (for instance, 'stylesheet forest'), then it will only apply to passages which themselves have that tag. This allows you to easily make different sections of a story have different styles to distinguish them.

Because the passage in the above figure has the same tag as the stylesheet, the stylesheet applies only to it, and any others with the same tag.

Source: 
http://twinery.org/wiki/stylesheet

Reply all
Reply to author
Forward
0 new messages