BB10 Disabled CheckBox styling #495

Closed
tneil opened this Issue Dec 6, 2012 · 3 comments

Comments

Projects
None yet
2 participants
Member

tneil commented Dec 6, 2012

Need to update the disabled CheckBox styling to match the UX specs for both the light and dark themes.

Wondering where the UX specs are? I've looked at the UI guidelines at http://developer.blackberry.com/devzone/files/design/bb10/UI_Guidelines_BlackBerry_10.pdf but don't see any specifics for disabled look and feel.

It looks like an easy fix by just changing these few lines in the CSS with the right colors:

.bb-bb10-checkbox-outer-disabled-dark
{
border-color: #262626;
background-image: -webkit-gradient(linear, center top, center bottom, from(#E3E3E3), to(#E3E3E3));
}

.bb-bb10-checkbox-outer-disabled-light
{
border-color: #a1a1a1;
background-image: -webkit-gradient(linear, center top, center bottom, from(#E3E3E3), to(#E3E3E3));
}

.bb-bb10-checkbox-inner-disabled-dark
{
border-color: #262626;
background-image: -webkit-gradient(linear, center top, center bottom, from(#262626), to(#262626));
}

.bb-bb10-checkbox-inner-disabled-light
{
border-color: red;
background-image: -webkit-gradient(linear, center top, center bottom, from(#c0c0c0), to(#c0c0c0));
}

I'm basing these off the bb10 jquery mobile theme for the UX guidelines

Here is the new style:

Screen Shot 2013-04-09 at 10 51 12 AM

where checkbox 2 is disabled (light theme)

Member

tneil commented Apr 11, 2013

Cool.. I'll take a look at that CSS... I usually find screens with checkboxes in BB10 in different states and then take screen shots of them. I usually then pull the colors out of them using an eye dropper tool in paint :o)

tneil closed this Jul 17, 2014

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment