Bg change with undo button?

If you are requesting technical assistance with Twine, please specify:
Twine Version: twine 2
Story Format: harlowe

When I click undo after I have visited a page with a picture as a background, the previous page (start page) goes from standard black to white. I can’t find any other instances of this happening. Any ideas?

You’ve left some important details out of your question, like:

  1. what means are you using to show the background image.
  2. what custom CSS you’re using to style the project.

I created the following basic Harlowe project containing two Passages (Start & Shops) and a used Passage Tag based CSS selector to show a background image whenever a Passage has been assigned a shops Tag. Example written using TWEE Notation.

:: Start
[[Shops]]

:: Shops [shops]
You're in a shopping mall.

With the following CSS placed within the project’s Story Stylesheet area.

tw-story[tags~="shops"] {
	background-image: url('media/desert.png');
}

And when I used the Undo link in the Shops passage to return to Start passage, that passage still had a black background colour.

Sorry, yes.

The first page has the following.

(enchant:?page,
	(color:gray)+
	(font:'Alegreya')
)(enchant:?link,
	(color:white) +
	(font:'Josefin Sans') + 
	(hover-style: (text-style:'italic'))
)
(enchant:?sidebar,
(color:gray)+
(font:'Josefin Sans'))

The second page with background image has

(enchant: ?page,
(bg: 'url to background image.jpg'))

The only css in the stylesheet is to import the fonts.

I added your code to a new Harlowe v3.2.2 project and when I used the Undo link to return to the initial Passage the background correctly appeared as it the 1st time I viewed that Passage.

However when I added your code to a new Harlowe v3.2.3 project I saw the same white background when I used the Undo link to return to the initial Passage, so obviously some change in the new version is causing the issue. So I went and looked at the HTML being generated by the two releases of Harlowe.

In v3.2.2 the two relevant custom HTML elements, the outer <tw-enchantment> and the <tw-story> elements, change as follows…

/* The initial Passage when its first shown. */
<tw-enchantment style="color: rgb(136, 136, 136); font-family: Alegreya; width: 100%; height: 100%;">
	<tw-story tags="" style="color: inherit; font-family: inherit;">

/* The second Passage with the background image. */
<tw-enchantment style="background-size: cover; background-image: url('url to image'); width: 100%; height: 100%; display: block;">
	<tw-story tags="" style="background-size: inherit; background-image: inherit; display: inherit;">

/* The initial Passage after Undo link used. */
<tw-enchantment style="color: rgb(136, 136, 136); font-family: Alegreya; width: 100%; height: 100%;">
	<tw-story tags="" style="color: inherit; font-family: inherit;">

As you can see the relevant HTML elements of initial Passage is the same after the Undo link as it was when it was first shown.

However in v3.2.3 the behaviour of those same two elements is different after the Undo link is used…

/* The initial Passage after Undo link used. */
<tw-enchantment style="color: rgb(136, 136, 136); font-family: Alegreya; width: 100%; height: 100%;">
	<tw-story tags="" style="background-position: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: transparent; color: inherit; font-family: inherit;">

So it appears you’ve found a potential “bug” in the v3.2.3 release, and I suggest you let the Harlowe Developer know by opening a new issue on the project’s Heptapod Repository.