Block Switch

I am customizing an existing character sheet from the github repository.

I want to make an input field readonly using a block switch when the value of another input field is equal to a specific value.

i.e.  Field1 = 0 - Field2 = readonly , Field1 = 1 - Field2 = not readonly

Can anyone describe the process for this as i have only used block switch with checkboxes

Cheers

Ray

. sheet-im_an_input[value='lock'] ~ . sheet-im_another_input {pointer-events: none;}

You can't disable an input via css but you can make them unselectable which accomplishes much of the same effect. 

Edit: that pointer-event method is easier, and should be added to the CSS Wizardry page.

You can't change if an input is readonly or not, but you could use the "swap visible area" trick to switch between showing the <input> or a <span> that is made to look similar.

• https://wiki.roll20.net/CSS_Wizardry#Swap_Visible_Areas
• https://wiki.roll20.net/CSS_Wizardry#Attribute-Backed_.3Cspan.3Es

Thanks guys....I will look at this  :)

After some testing & playing around, I've now created an example on the wiki for Disable click/select, along with a gif: https://wiki.roll20.net/CSS_Wizardry#Disable_Click

Note: Neither pointer-events nor user-select stops users from selecting the element using the TAB-key, and editing them with through that(writing in text/number-inputs, use up/down keys can change select options, space can check/uncheck checkbox/radio inputs, pressing Enter with button activates it).

So while this method is easier, the other method I described are more "absolute", and can more rigorously disable accidental or intentional edits of these stats.