Radio Buttons on Tablet

  • 1
  • Question
  • Updated 6 months ago
  • Answered
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!
Photo of Sue Baldwin

Sue Baldwin

  • 148 Points 100 badge 2x thumb

Posted 6 months ago

  • 1
Photo of Khamla Phimmachack

Khamla Phimmachack, Official Rep

  • 1,536 Points 1k badge 2x thumb
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.
Photo of Sue Baldwin

Sue Baldwin

  • 148 Points 100 badge 2x thumb
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 :)
Photo of Khamla Phimmachack

Khamla Phimmachack, Official Rep

  • 1,536 Points 1k badge 2x thumb
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