
Hey folks,
I have a sheet with a checkbox that can hide a section that's inside a <div></div>
That works fine.
What I'm hoping for is a way to hide a button with that same checkbox. The button is not in its own div, and it shares its place on the page with 3 other buttons that I do not want to hide.
The idea is that the GM can reveal hidden parts of the sheet to the player when their chr hits the appropriate level. I've done this for ages with the above div trick (code below) but it seems to not work on a button.
Here's the checkbox-
<input type="hidden" class="toggle-show" name="attr_continuumdeets" value="0" />
Here's the div section where it does work-
<div class="sheet-col sheet-continuum">
<h2 class="subsection">Continuum</h2>
...
</div>
Here's the buttons-
<div>
<button type="action" name="act_PersonalData" >Personal</button>
<button type="action" name="act_Social" >Social</button>
<button type="action" name="act_Combat" >Combat</button>
<button class="sheet-continuum" type="action" style="display: none;" name="act_Continuum">Continuum</button>
</div>
Here's the CSS-
/* show the selected tab */
.charsheet .sheet-tabstoggle[value="PersonalData"] ~ div.sheet-PersonalData,
.charsheet .sheet-tabstoggle[value="Social"] ~ div.sheet-Social,
.charsheet .sheet-tabstoggle[value="Combat"] ~ div.sheet-Combat,
.charsheet .sheet-tabstoggle[value="Continuum"] ~ div.sheet-Continuum
{
display: block;
}
I wanna reveal that 4th button when the checkbox above is ticked.
Anyone know what I'm doing wrong? Nothing I try will get the button to show up when the checkbox is ticked.
Thanks