CODEWITHSUNDEEP
jquery-mobile
Strawberry Farmer
Strawberry Farmer

Reputation: 892

JQuery mobile theme roller 1.4.3

Ok. So all the version of the Theme roller before 1.4.3 have options to choose a start and end color which creates a gradient on whatever you want.

Does anyone know how to get gradients in to a version 1.4.3 Theme?

version 1.4.3 (Below)
A shot of Body in version 1.4.3

version 1.3.2 (Below)
A shot of Body in version 1.3.2

Is there even any reason to use 1.4.3?

Upvotes: 0

Views: 547

Answers (1)

ezanker
ezanker

Reputation: 24738

Have a look here: http://jquerymobile.com/upgrade-guide/1.4/ at the section titled Custom Theme.

Because gradients are no longer part of the default theme, they can't be set with the ThemeRoller anymore either. You can still use gradients, but you have to manually copy the background-image settings from your current theme into your 1.4 theme CSS file.

.ui-body-a,
.ui-page-theme-a .ui-body-inherit,
html .ui-bar-a .ui-body-inherit,
html .ui-body-a .ui-body-inherit,
html body .ui-group-theme-a .ui-body-inherit,
html .ui-panel-page-container-a {
        background: #333 /*{a-body-background-color}*/;
        border-color: #111 /*{a-body-border}*/;
        color: #fff /*{a-body-color}*/;
        text-shadow: 0 /*{a-body-shadow-x}*/ 1px /*{a-body-shadow-y}*/ 0 /*{a-body-shadow-radius}*/ #111 /*{a-body-shadow-color}*/;
        /* Copied from 1.3 custom theme: */
        background-image: -webkit-gradient(linear, left top, left bottom, from( #444 ), to( #222 )); /* Saf4+, Chrome */
        background-image: -webkit-linear-gradient( #444, #222 ); /* Chrome 10+, Saf5.1+ */
        background-image:    -moz-linear-gradient( #444, #222 ); /* FF3.6 */
        background-image:     -ms-linear-gradient( #444, #222 ); /* IE10 */
        background-image:      -o-linear-gradient( #444, #222 ); /* Opera 11.10+ */
        background-image:         linear-gradient( #444, #222 );    
}

Upvotes: 1

Related Questions