Background/Text Colors

Hello, I'm a newer member of the site and have been working on my first squiffy game, looking stuff up as I go. I've found that colors can be modified with

$("body").css("background-color", "rgba(0, 0, 0, 0.8)");
$("body").css("color", "yellow");

but have been struggling to find a way of isolating colors to certain sections rather than having to switch the entire game's color scheme independently. If there is a way of isolating background and text colors to certain

[[section]]:
@clear

type sections, please let me know! Thank you in advance for your help, I'm sure newcomers can be somewhat irritating with our infant-level of knowledge.

-- constant


Here's a rather lengthy example of how to do it in the Squiffy Editor.

@set style_sunny=<meta name="viewport" content="width=device-width, initial-scale=1.0"><div style="color:black; font-family:Verdana; font-weight:900; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: white; border:5px outset darkblue; padding:20px; max-width:auto; max-height:auto; background-repeat: no-repeat; background-size: cover; background-image: url('https://p0.pxfuel.com/preview/71/224/852/field-trees-sunny-summer.jpg');"">

After declaring this style, any time you want a section to use this style, you just put

{style_sunny}

If you just want to change the appearance of a short section of text

@set Y=<span style="text-decoration:underline; text-decoration-color:yellow; color:yellow;">

After declaring this style, any time you want to use it, just

{Y}Some yellow and underlined text.</span>

To change links do

[[{Y}Link text here]](name of section)

Log in to post a reply.

Support

Forums