oTree Forum >

Disable red and green bootstrap validation on real-effort-app game page

#1 by n_lacourse

Hello,

I noticed that in oTree's real-effort app when a user submits a puzzle, it will signal in the input box whether it was a correct submission or not by showing either a green outline with a checkmark or a red outline with an exclamation mark. Is there an easy way of disabling this .css? It is tied to bootstraps validation for input tags . I want the rest of the bootstrap styling; I just do not want the color coding. Any help would be appreciated. 

Cheers,

Nicholas

#2 by n_lacourse

I figured out a solution to this for anyone that may be stuck on something similar in the future.

<style>
    .form-control.is-invalid, .form-control.is-valid {
        background-image: none;
        border-color: gray;
    } 
</style>

The background-image attribute are the check marks and exclamation marks when the answer is valid or not. The border color is not the vanilla border, but it offers the same defined look around the box on submit regardless of whether the answer was correct. The purpose of this was to not allow subjects to truly know their performance in the real-effort puzzles until the game concluded, which in many experiments in the most ideal case scenario, especially for one-player experiments.

Cheers,

Nicholas

Write a reply

Set forum username