I'm having trouble with the Stylesheet

IiJn57

I've tried several different codes on color (the background, text and link) but none of them worked. I can't change the color. It stays the default black and white. I'm using harlowe 2.0.1
What to do?

Chapel

Can you post your code so we can take a look?

IiJn57

body {
background-color: white;
}

tw-passage {
background-color: #ffffff;
color: red;
}

tw-link {
color: blue;
}


This is the last code I tried, and it worked but only for the inside text. The background on the outside is still black.

greyelf

Please use the code tag when posting examples - it's the C on the editor bar.

Harlowe 2.x assigns it's default foreground/background colours on the tw-story element, not the body or tw-passage elements. The equivalent of your example would be.

tw-story {
	background-color: white;
	color: red;
}

... you can use your web-browser's built-in Developer Tools to navigate the HTML element generated based on the content of the current Passage, and to determine the CSS associated with those elements.


This comment in the Harlowe -Changing color of text.... thread explains that four different CSS selectors used by Harlowe to control the default foreground/background colours of the two different link types it supports. The equivalent of your example would be.

tw-link, .enchantment-link {
    color: blue;
}

IiJn57

greyelf wrote: »

Please use the code tag when posting examples - it's the C on the editor bar.

Harlowe 2.x assigns it's default foreground/background colours on the tw-story element, not the body or tw-passage elements. The equivalent of your example would be.

tw-story {
	background-color: white;
	color: red;
}

... you can use your web-browser's built-in Developer Tools to navigate the HTML element generated based on the content of the current Passage, and to determine the CSS associated with those elements.


This comment in the Harlowe -Changing color of text.... thread explains that four different CSS selectors used by Harlowe to control the default foreground/background colours of the two different link types it supports. The equivalent of your example would be.

tw-link, .enchantment-link {
    color: blue;
}

I see. Thank you very much!