styling a enyo.Checbox

I'm trying to style the the onyo.Checkbox, to use a different tick instead of the default ugly one :)

But everything I've tried with CSS, has little or no effect, appart from making the tick box vanish completely.

Thre are various artical on stack overflow, and varios fiddles, that seem to work, but I can't seem to get them to work with my enyo project.

for example

http://jsfiddle.net/jtbowden/xP2Ns/

changes the checkbox fine

I've created a sample using enyo, copying the CSS from the above fiddle to

http://jsfiddle.net/altazu/7BUem/

and it does not seem to work.

any hint's aboout what I'm doing wrong would be welcome.

Comments

  • I'd suggest styling onyx.Checkbox instead of enyo.Checkbox as the latter simply wraps the native checkbox control which you won't be able to style. You're on the right track to modify the CSS. Your example is adopting the CSS classes from the jQuery fiddle but you've not included any code to set those classes. Instead, you can rely on the CSS selectors already establed by onyx and override those for the desired effect. Here's a start:

    http://jsfiddle.net/7BUem/3/
  • Thanks for that, I'll have a play.
Sign In or Register to comment.