Checkboxes and autocalc for Fitd system

Hello!  I'm currently in the throws of trying to code my first sheet with very little experience and would like some help. I'm making something similar to a Forged in the Dark system.  Specifically, I want these checkboxes to correspond to an amount of d6's the PC can roll. Ideally this would also correlate to a button that would automatically roll that number of d6 based on boxes ticked.  Below in the original blades in the dark system, each of these pips have additional behaviors. Hitting the third pip automatically checks the first and second, and each of them can be deselected and selected.  Any advice, thoughts, or prayers how I would best go about recreating this for my own sheet would be extremely appreciated. Please keep in mind I am very new to this, and would genuinely appreciate if you explained this to me like I'm five. Thank you in advance. 

Hi Herman, congrats on building your own sheet.&nbsp; It can be very a fulfilling endeavor.&nbsp; This might help; <a href="https://wiki.roll20.net/CSS_Wizardry#Fill_Radio_Buttons_to_the_Left" rel="nofollow">https://wiki.roll20.net/CSS_Wizardry#Fill_Radio_Buttons_to_the_Left</a> Cheers

I'll have to check that out, as I do it from time to time but always use the "older" sheet worker method. To OP, those checkboxes are actually radio buttons, and then the radio checked is the numerical value - your power attribute is very easily assigned. And once you have that, a button to roll the dice is easy (just use something like /roll @{power_atribute}d6)

I'll note that some recent CSS developments have made this even easier to create: HTML &lt;div class="radiocontainer"&gt; &lt;input class="radiobox" type="checkbox" name="attr_strength" value="1"&gt; &lt;input class="radiobox" type="checkbox" name="attr_strength" value="2"&gt; &lt;input class="radiobox" type="checkbox" name="attr_strength" value="3"&gt; &lt;input class="radiobox" type="checkbox" name="attr_strength" value="4"&gt; &lt;input class="radiobox" type="checkbox" name="attr_strength" value="5"&gt; &lt;input class="radiobox" type="checkbox" name="attr_strength" value="6"&gt; &lt;/div&gt; CSS .radiocontainer{ /* style the layout and whatnot of the radio container as you need to */ display: flex; gap: 0.5rem; } .radiobox{ /* appearance none allows us to style radios and checkboxes as if they were divs */ appearance: none; /* Style the radio as you want for it's unchecked state */ &nbsp;&nbsp;border-radius: 50%; border: 1px solid black; width: 10px; height: 10px; display: block; } /* If the radiobox is checked, or if it has a checked radiobox after it, style it as if it was checked */ .radiobox:checked, .radiobox:has(~ .radiobox:checked){ /* Style the check state as you want */ background-color: black; } Note that I used checkboxes to make it easier to unselect all boxes without needing to mess with the ordering and z-indexing stuff. If your fill to left section needs to not allow itself to be completely unselected, then switch these to radios, and they'll work out of the box for that. The CSS is also much simpler with the advent of the :has selector.

I like your comments in the CSS. Far too often when people post CSS, they they don't explain which parts do which part making it very confusing to sort through the code.

I'll have to add this to the wiki. Thanks Scott

Thank you all so much! this has been really helpful!

Another question while I still hopefully have all of you helpful lovely people:&nbsp; Roll templates and roll responses. In the original Bitd, a response pops up asking for how many bonus die you'd like to apply to your roll.&nbsp; I was wondering if there was any way to replicate this with html, googling has not been very helpful.&nbsp; Additionally, there are these very stylized roll templates.&nbsp; I don't think I'd need something this elaborate but something that shows how many successes versus failures in any given mass of d6. T

That sounds like you need a query in your roll, which looks like +?{How Many Extra Dice?|1} The bit before the pipe ( | ) is the label you want to appear, and the bit after is the default value that appears in the query and will be used if the player just clicks enter.