Active state colour set in swatch reverts to default when tested on phone

[Barbara]

Colour I have set for active state (pink) in my customised swatch, which shows behind icon in selected radio buttons or checkboxes reverts to the default blue in the original jquery mobile swatch when tested on phone

How do I fix this?

[maxkatz]

jQuery Mobile overwrites it with its global active theme: http://jquerymobile.com/demos/1.2.0/d...

Search for [Global "Active" state] section.

[Barbara]

Ok so I set the background color in css like so

.ui-btn-active {
background: none !important;
background-color: #edc6bf !important;
}

But this is already set in my swatch anyway so it makes no difference in test mode. But still when I create an apk and install on my phone the color is still blue.

Shouldn't test mode also revert to blue if jquery mobile is overriding the theme?

Maybe I am not understanding something here.

[Maryna Brodina]

Hello! Could you clarify how we can reproduce it. When I open your app I see this screen after login

Where should I go next?

[Barbara]

Sorry broke the js, it's working again now.

You should see the pink background on the login page if you select remember me.

This works in test but not on my Galaxy SII when I install the apk

[Maryna Brodina]

I reproduced it on Androin 4.0.3, but it's not reproducible on Android 2.3.3 and 2.3.6. Seems that there is something related with Android version. We'll try to figure out and I update.

[Barbara]

This seems to be working now.

[Barbara]

I take that back, it's not working - sorry.

[Maryna Brodina]

Hello! We'll take a look at this issue.

[Maryna Brodina]

The problem is in Android 4 bug with resources names encoding (please take a look here https://issues.apache.org/jira/browse...). The workaround is to create custom css with next content:

.ui-content .ui-checkbox-on .ui-icon,
.ui-content .ui-radio-on .ui-icon {
background-color: #e6968e !important;
}

BUT - it will set pink background for checkboxes and radioboxes for whole app