Can different footers be applied to different passages via CSS, by tw-include? Harlowe2

Question

Version: Harlowe 2

I'm trying to apply different footers to differently tagged passages in this one game I'm working on. That is, one group of passages (about twenty) are assigned the tag "consequences", while another set is assigned the tag "solutions". I want to automatically include, via CSS since there are so many assigned the "consequences" tag, a footer into pages tagged "consequences" that differs in function and appearance from the "solutions"-tagged passages.

I think I had found a possible avenue to do so, by creating a separate passage from the main footer passage called "scorecard", and applying this code into the CSS:

tw-passage[tags~="consequences"] tw-include[tag="scorecard"] {
display: block;
}

but it currently doesn't work. I've been trying to work out what needs to be done to fix the situation.

For reference I had bastardized the first segment of code based on GreyElf's work here, here, and here. I had already scoured the Harlowe 2 manual. What am I missing? Is there any way to make this work? I'd appreciate any advice possible. Thanks!

Answer 1

WARNING: Code contained within a header or footer tagged Passage is still executed, even when it is being 'hidden' via a CSS display: none; property setting.

The following assumes the footer tagged Passage to be shown for the "consequences" tagged passages is named Consequences Footer, obviously if you named yours something different then you need to change the tittle referenced in the following CSS example.

You will need two CSS selectors to achieve the result you have asked for:

1. One that handles the state of the Consequences Footer for passages without the "consequences" tag.

2. One that handles the state of the Consequences Footer for passages with the "consequences" tag.

The following CSS needs to be placed in your project's Story Stylesheet area.

tw-include[title="Consequences Footer"] {
  display: none;
}
tw-passage[tags~="consequences"] tw-include[title="Consequences Footer"] {
  display: block;
}

You will likely need CSS similar to the above for your "solutions" tagged passages and related footer, so copy the above and change the tags and title attributes as required.

Comments

1. One that handles the state of the Consequences Footer for passages withoutthe "consequences" tag.

**facepalms** 

So that's what I missed. Thank you so much, GreyElf! You've been a great help.