Trying To Make Each Room With Individual Background
Athslade
17 Dec 2019, 20:49I want each room to have it's own background color scheme but cannot seem to override the general game settings. Any ideas would be greatly appreciated.
Athslade
18 Dec 2019, 01:10I figured out how to change the page itself but still stuck on changing the margin.

Io
18 Dec 2019, 01:52I know I have the code around here somewhere... aha!
game.marginscolour = "DarkGray"
mrangel
18 Dec 2019, 03:46I think that only works on game startup. As far as I can tell, marginscolour is only sent to the frontend during UI Initialisation.
If you want to change it during the game:
JS.setCss ("body", "background-color: blue")
jmnevil54
18 Dec 2019, 03:59I have some loose code that might help.
This code updates a progress bar, if you had one.
JS.eval ("var val = "+val+";$('#progressbar').progressbar({ value: val });")
(I think these are apostrophes. I'll change the code as soon as possible.)
This code is supposed to go with the function UpdateProgressBar (example above). This makes a health bar.
UpdateProgressBar (integer_value)
max_hitpoints = 20
mutiplier = 20/max_hitpoints
This code both hides and shows an inventory label.
JS.uiHide ("#inventoryLabel,#inventoryAccordion")
// /nd
JS.uiShow ("#inventoryLabel,#inventoryAccordion")
msg ("What is your name?")
THIS code contains different colored and different sized panes! They look weird though.
backandborder = "border: darkgrey outset 6px;background:grey"
button = "padding:5px;background:silver;border:outset darkgrey 1px;"
text = "color:black;font-family:georgia, serif"
JS.setCss ("#status", backandborder)
JS.setCss (".ui-accordion-header", "border-radius: 0px;" + backandborder)
JS.setCss (".ui-accordion-content", "border-radius: 0px;" + backandborder + ";border-top:none")
JS.setCss (".accordion-header-text", text)
JS.setCss ("#commandPane", text + ";" + backandborder)
JS.setCss ("#verblinkwait", button)
JS.setCss ("#verblinklook", button)
JS.setCss ("#gamePanes", "margin-top: 16px")
JS.eval ("$('#gamePanes').width(227);")
THIS code has different colored, black and white borders!
backandborder = "border: white outset 6px;background:black"
button = "padding:5px;background:black;border:outset white 2px;"
text = "color:black;font-family:georgia, serif"
Athslade
20 Dec 2019, 00:05Thanks so much for the feedback. I will take these ideas and continue to work on a solution.
Athslade
20 Dec 2019, 00:09Where can I find the CSS file
mrangel
20 Dec 2019, 02:53Where can I find the CSS file
The CSS file for Quest is found in PlayerController/playercore.css
in the Quest source. I'm not sure if there's a copy of it in the distribution, but you wouldn't want to edit it in any case as it's shared between all games.
If you want to modify the CSS within a game, you normally do that by using javascript to add style information.
The command JS.setCss(element, style)
allows you to add custom style information.
AddExternalStylesheet(url)
allows you to load an external stylesheet to override Quest's styling.