Radio Buttons on Tablet

Hi guys!

I am building a few pages that will be used primarily on a tablet. I have pick-list fields that I am displaying as radio buttons so that it is easier to use on the tablet. However, the buttons themselves are extremely washed out and difficult to determine if an option has been chosen. I have tested this on a number of different devices of different types and makes (ipad, samsung - phones and tablets etc) all with the same result.

My question is - Is there any way to change the look or color of the radio buttons so that selected options are more apparent? I want to be able to do this without CSS.

I appreciate the feedback!

Hi Sue,

Have you tried editing your theme using the Theme composer? https://docs.skuid.com/latest/en/skuid/themes/theme-composer.html
Depending on what component you are using, you may be able to declaratively customize the look of that particular field.

Thanks Khamla!

I do have a custom theme and have used the Theme composer. However, I cannot find anywhere to edit the radio buttons.

I am using a field editor with a pick list field where for the “Field Renderer” option I have chosen radio buttons. Is there a specific place in the theme composer to adjust settings for this? Perhaps I missed it! Please let me know if I did :slight_smile:


Hi Sue,

Unfortunately, there is not a declarative way to change the styling of the radio buttons themselves. The appearance of the buttons actually varies depending on what type of browser you are using. I noticed a difference in my buttons when using Chrome vs. Firefox. Please see this article explaining that without using custom JavaScript libraries or images, the style of radio buttons are determined by the browser. 
https://stackoverflow.com/questions/4253920/how-do-i-change-the-color-of-radio-buttons