0 votes
by (170 points)
edited by

Hi

As the title say I have a little problem changing the background color.

I implement a theme selector to my project and work perfectly, but today when I open it, the color of the background stop changing

I'm using Sugarcube 2.21 in twine 2

Edit: http://twinery.org/questions/5167/settings-menu-option-to-change-stylesheets?show=5173#a5173 I take the code from there

This is the code in the javascript section

var settingThemeNames = ["(none)", "1", "2", "3", "4"];
var settingThemeHandler = function () {
	// cache the jQuery-wrapped <html> element
	var $html = $("html");

	// remove any existing theme class
	$html.removeClass("theme-1 theme-2 theme-3 theme-4");

	// switch on the theme name to add the requested theme class
	switch (settings.theme) {
	case "1":
		$html.addClass("theme-1");
		break;
	case "2":
		$html.addClass("theme-2");
		break;
	case "3":
		$html.addClass("theme-3");
		break;
	case "4":
		$html.addClass("theme-4");
		break;
	}
};
Setting.addList("theme", {
	label    : "Choose a theme.",
	list     : settingThemeNames,
	onInit   : settingThemeHandler,
	onChange : settingThemeHandler
});

 

And this in the CSS section

html.theme-1 body
{
 background-color: #3C1642;
}
html.theme-1 .passage
{
 color: #005095;
}
html.theme-1 #ui-bar
{
  background-color: #462255;
  color: #1DD3B0;
}
html.theme-1 .passage a
{
  color:#1DD3B0;
}
html.theme-1 .passage a:hover
{
  color:#AFFC41;
}
html.theme-1 #ui-dialog-body.saves
{
  background-color: #462255;
  color: #1DD3B0;
}
html.theme-1 #ui-dialog-body.settings
{
  background-color: #462255;
  color: #1DD3B0;
}

Someone know why this stop working only on the background?

1 Answer

0 votes
by (159k points)

> I can't find again from where I take the code..

I would guess you got it from either this answer by TheMadExile or from this answer by me (which is based on TheMadExile's)

> This is the code in the java section

You mean the JavaScript section, Java is a different and unrelated programming language.

> the color of the background stop changing

I created a new SugarCube 2 based project and tested your examples in it and they worked correctly.

Have you made any recent edits to the Story Javascript area of your project?

Could you please run your story HTML file again in your web-browser and open it's Developer Console to check if there are any error messages in it, how you open this console depends on which web-browser & Operating System combination you are using (although generally the F12 key on your keyboard will open the web-browser's Web Developer Tool window, and Console should be one of the tabs in that window's action bar)

by (170 points)
Thanks for the link and the correction on the javascript thing.

I try on different browsers and in everyone happens the same, I didn't change anything, literally close and open twine and stop working, I'll try reinstall it, but have no idea what could probably cause it
by (159k points)
DId you look at your web-browser's Developer Console which playing your story HTML file? Were there any error messages?

If you need more help and are willing to upload your story HTML file to a file hosting site then I can look at it to see what is causing the issue.
...