Howdy, Stranger!
It looks like you're new here. If you want to get involved, click one of these buttons!
SugarCube — any way to CSS-style "initialising" and assorted screens?
Is there any particular way to style the "initialising" and assorted screens so I can differentiate them a bit in my project from a stock SugarCube-based twine game? I recognise that the screen appears for just a split second, but the ability to change how it appears would help me as I've put a lot of work in making my project look as little like a twine title as possible, but that screen keeps stymieing my efforts.
Because the screen appears for so little I haven't been able to use CSS inspection tools to figure out what it's bound in or what I can use to override its appearance.
Because the screen appears for so little I haven't been able to use CSS inspection tools to figure out what it's bound in or what I can use to override its appearance.
Comments
You cannot override it's styling when you most need to, no. It's an init/loading screen for the story format itself. SugarCube hasn't finished loading, let alone begun to run, at the point which it's normally seen--ergo, no end-user code or CSS is close to being applied either.
The only way to override the styling of the init/loading screen, before it's displayed to players, is to modify the story format itself. You can do this in a number of ways, however, the two easiest are modifying the final compiled HTML file or creating a custom build of SugarCube which you'd then install/use for your project.
For the former, look for the <style> element, in the document head, with the ID "style-init-screen".
For the latter, follow the instructions on the overview page of SugarCube's source repository on how to get and build it--if you're using v1, be sure to select the correct branch, as the default is v2. Once you've got that working, edit the init-screen.css file (v2 path: src/css/init-screen.css; v1 path: src/init-screen.css) to your liking.
In either case, use a plain text editor, not--I say again--not a word processor.
I once started a thread asking if there was a way to prevent the slight delay during loading, in which the default style of SC2 displays for a second or so, before my own CSS is triggered. Is this what @mixvio is referring to?
If it is I'm not sure if your solutions are beyond my abilities, but still worth looking at
If you're referring to styling issues with the init screen, then it is related to your question/issue and my answer does cover what you wanted to know. The second paragraph of my reply to mixvio explains why attempting to override it's styling normally--as you may with everything else--cannot work, thus why you're seeing the default styling on the init screen until your styles are finally loaded. The rest of my reply explains how to properly override its styling.
I should probably just cut the init screen down to the progress bar or a spinner/throbber, so it would be more neutral in the first place.
Yeah, that would be massively appreciated if it's not a problem for you to do so. I've abused the javascript and CSS of the project to an impressive degree and it looks practically like a native app, but that first screen keeps thwarting my efforts. I know it's only up for a split second but I notice it and it haunts me.
I was hoping there was a way to avoid the brute-force method of changing the story format itself, so if that's something you don't mind changing on your end I'd be greatly pleased.