Roll20 uses cookies to improve your experience on our site. Cookies enable you to enjoy certain features, social sharing functionality, and tailor message and display ads to your interests on our site and others. They also help us understand how our site is being used. By continuing to use our site, you consent to our use of cookies. Update your cookie preferences .
×
Create a free account

[Sheet improvement help] Independent checkboxes arent so independent

July 27 (6 years ago)

Edited July 27 (6 years ago)
Andreas J.
Forum Champion
Sheet Author
Translator

Background:

I've been working on introducing tabs and a few other options to the Star Wars D6 sheet, but somehow a few classes or features have become interconnected without me having any idea how it's possible. I'm not that great at these things yet, and 

Earlier I introduced a Setting Menu (pulled from Gumshoe Official) with a few checkboxes to hide some sections of the sheet, and one checkbox to toggle between PC/NPC version of the sheet, and the current version works fine, with all chatboxes and the resulting hiding of sections or switches between PC/NPC working fine.

Problem:

Then I introduced tabs(pulled from Shadowrun 5th) and a new checkbox that regulates "wild die" rolls(through a sheetworker). Now, in some way the previously independent checkboxes didn't work independent anymore, as when the "wild die" checkbox is unchecked, for some reason the sheet shows both PC&NPC sections even if I've seen no connection between them.

Here is snippets from what I think are central to the problem:

CSS:

input.sheet-wilddie:checked ~ input.sheet-selector-switch:checked ~ .sheet-master-container .sheet-wild-hide,
input.sheet-npc:checked ~ input.sheet-selector-switch:checked ~ .sheet-master-container .sheet-npc-hide ,
input.sheet-selector-switch:checked ~ .sheet-master-container .sheet-pc-hide,
input.sheet-gmroll:checked ~ input.sheet-selector-switch:checked ~ .sheet-master-container .sheet-gmroll-hide {
	display: none;
}
input.sheet-selector-switch:checked ~ .sheet-master-container div.sheet-npc-hide{
	display: inline-block;
}

input.sheet-npc:checked ~ input.sheet-selector-switch:checked ~ .sheet-master-container .sheet-pc-hide {
	display: inherit;
}

HTML:

<input class="sheet-selector-switch sheet-npc" name="attr_npcswitch" type="checkbox" value="1">
<input class="sheet-selector-switch sheet-wilddie" name="attr_wildswitch" type="checkbox" value="1">
			<div class="sheet-input-row sheet-top-row sheet-bold"> 
				<span title="Shows a more dense statblock for NPCs. Equipment sections uses the first field from the PC version">Use NPC sheet</span>
				 <input name="attr_npcswitch" type="checkbox" value="1">
			</div>
...
			<div class="sheet-input-row sheet-top-row sheet-bold">
				<span>Use 1E rules?</span>
				<input name="attr_wildswitch" type="checkbox" value="1">
			</div>
	<div class="content6 sheet-section sheet-equipment-hide"><!------------Equipment -------------->
		<div class="sheet-npc-hide"> <!-- Equipment PC-->
			<label style="text-align: center;">Equipment</label>
			<table style="width:97%">
				<tr>
					<td style="text-align: right;">
						<textarea name="attr_geartext1"></textarea>
						<textarea name="attr_geartext2"></textarea>
					</td>
					<td style="text-align: center;">
						<textarea name="attr_geartext3"></textarea>
						<textarea name="attr_geartext4"></textarea>
					</td>
					<td style="text-align: Left;">
						<textarea name="attr_geartext5"></textarea>
						<textarea name="attr_geartext6"></textarea>
					</td>
				</tr>
			</table>
		</div>
		<div class="sheet-pc-hide"><!-- Equipment NPC-->
			<label style="text-align: center">Equipment</label>
			<textarea style="height:7em;width:96%" name="attr_geartext1"></textarea>
		</div>
	</div>

Whole problem code

Test Campaign to witness the problem

I'm aware that 

input.sheet-npc:checked ~ input.sheet-selector-switch:checked ~ .sheet-master-container .sheet-pc-hide {
	display: inherit;
}

might lead to some problem as property inheritance can be a tricky thing, but changing it to something else or removing only made the situation wrong. Any pointers or suggestions what I should look for is welcome. In worst case I'll remove the (fairly minor) NPC variation from the sheet and try to add it in again later in some other way, hopefully not ending up in a similar situation.

July 31 (6 years ago)
Andreas J.
Forum Champion
Sheet Author
Translator

Anyone got any suggestions?

September 06 (6 years ago)
Andreas J.
Forum Champion
Sheet Author
Translator

Bump for visibility. Any pointers whatsoever would be helpful. 

September 06 (6 years ago)
Jakob
Sheet Author
API Scripter

Okay, I cannot seem to find the wild die setting to actually replicate this, but I have some remarks and a suggestion:

  1. You should not have to use display inheritance or setting display to inline-block or anything like that to make tabs or hiding elements based on a global setting work. A single set of rules setting display: none; using :checked or :not(:checked) should do the trick (or [value="xxx"] if you're using a hidden input); if it doesn't, there's probably something to simplify there.
  2. I noticed that your wild die checkbox has the sheet-selector-switch class. It shouldn't have that, since .sheet-selector-switch somehow controls the display of the .sheet-pc-hide class. If you're using .sheet-selector switch to style the checkboxes, make a third class that regulates the styling, but don't mix style and functionality here.
September 06 (6 years ago)
Andreas J.
Forum Champion
Sheet Author
Translator

Thanks Jacob for the reply! I'm sorry I didn't make the Wild Die a clear, as it isn't mentioned as such in the Character sheet settings menu, this line governs the wild die(1E doesn't use wild die,so I didn't even think of stating it more clearly).

  1. The sheet I pulled the settings from didnt use the :not  pseudoelement, so I wasn't aware of it's existence at first, but recall now that I stumbled upon it sometime later but did something wrong so I ended up staying with what (at that time) worked.
  2. I don't exactly understand how the .sheet-selector-switch, but it's used when hiding sections, pc-hide is one, the options menu is another, so it seems more like a secondary condition for those hide-options. In the original Gumshoe Sheet selector-switch was used 59 times in the css, and HTML (mine) vs. (original).

I'll rewrite things to use :not and see how things turn out, and I'll take a second look at the selector-switch and see if I get any new understanding from it. If I can't wrap my head around it, I'm tempted to ask Nathanael W.(author of the Gumshoe code) directly about selector-switch.

September 10 (6 years ago)
Andreas J.
Forum Champion
Sheet Author
Translator

Update: It works, thanks Jacob!

It seems removing the inheritance piece, and using the :not(:checked) for .sheet-pc-hide fixed the issue, now the sheet tabs and wilddie works separately again. I also removed the selector-switch without problem from the same section, but it still seems to serve a purpose in other places so I'll have to investigate it further. 


September 10 (6 years ago)
Jakob
Sheet Author
API Scripter

Cool, glad I could help!