Skip to content
This repository was archived by the owner on Oct 8, 2021. It is now read-only.

Commit 4e864be

Browse files
jaspermdegrootjaspermdegroot
committed
Deprecated option shadowicon. Add class ui-shadow-icon to a container or an button instead.
1 parent 1324c7a commit 4e864be

File tree

4 files changed

+39
-42
lines changed

4 files changed

+39
-42
lines changed

‎css/themes/default/jquery.mobile.theme.css‎

Lines changed: 29 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -35,30 +35,6 @@ legend,
3535
text-decoration: none;
3636
}
3737

38-
/* Shadow
39-
-----------------------------------------------------------------------------------------------------------*/
40-
41-
.ui-shadow {
42-
-webkit-box-shadow: 0 1px 3px /*{global-box-shadow-size}*/ rgba(0,0,0,.2) /*{global-box-shadow-color}*/;
43-
-moz-box-shadow: 0 1px 3px /*{global-box-shadow-size}*/ rgba(0,0,0,.2) /*{global-box-shadow-color}*/;
44-
box-shadow: 0 1px 3px /*{global-box-shadow-size}*/ rgba(0,0,0,.2) /*{global-box-shadow-color}*/
45-
}
46-
.ui-shadow-inset {
47-
-webkit-box-shadow: inset 0 1px 3px /*{global-box-shadow-size}*/ rgba(0,0,0,.2) /*{global-box-shadow-color}*/;
48-
-moz-box-shadow: inset 0 1px 3px /*{global-box-shadow-size}*/ rgba(0,0,0,.2) /*{global-box-shadow-color}*/;
49-
box-shadow: inset 0 1px 3px 0 1px 3px /*{global-box-shadow-size}*/ rgba(0,0,0,.2) /*{global-box-shadow-color}*/;
50-
}
51-
.ui-shadow-icon:after {
52-
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,.3) /*{global-icon-shadow}*/;
53-
-moz-box-shadow: 0 1px 0 rgba(255,255,255,.3) /*{global-icon-shadow}*/;
54-
box-shadow: 0 1px 0 rgba(255,255,255,.3) /*{global-icon-shadow}*/;
55-
}
56-
.ui-overlay-shadow {
57-
-webkit-box-shadow: 0 0 12px rgba(0,0,0,.6);
58-
-moz-box-shadow: 0 0 12px rgba(0,0,0,.6);
59-
box-shadow: 0 0 12px rgba(0,0,0,.6);
60-
}
61-
6238
/* Corner rounding
6339
-----------------------------------------------------------------------------------------------------------*/
6440

@@ -95,6 +71,25 @@ legend,
9571
background-clip: padding-box;
9672
}
9773

74+
/* Shadow
75+
-----------------------------------------------------------------------------------------------------------*/
76+
77+
.ui-shadow {
78+
-webkit-box-shadow: 0 1px 3px /*{global-box-shadow-size}*/ rgba(0,0,0,.2) /*{global-box-shadow-color}*/;
79+
-moz-box-shadow: 0 1px 3px /*{global-box-shadow-size}*/ rgba(0,0,0,.2) /*{global-box-shadow-color}*/;
80+
box-shadow: 0 1px 3px /*{global-box-shadow-size}*/ rgba(0,0,0,.2) /*{global-box-shadow-color}*/
81+
}
82+
.ui-shadow-inset {
83+
-webkit-box-shadow: inset 0 1px 3px /*{global-box-shadow-size}*/ rgba(0,0,0,.2) /*{global-box-shadow-color}*/;
84+
-moz-box-shadow: inset 0 1px 3px /*{global-box-shadow-size}*/ rgba(0,0,0,.2) /*{global-box-shadow-color}*/;
85+
box-shadow: inset 0 1px 3px 0 1px 3px /*{global-box-shadow-size}*/ rgba(0,0,0,.2) /*{global-box-shadow-color}*/;
86+
}
87+
.ui-overlay-shadow {
88+
-webkit-box-shadow: 0 0 12px rgba(0,0,0,.6);
89+
-moz-box-shadow: 0 0 12px rgba(0,0,0,.6);
90+
box-shadow: 0 0 12px rgba(0,0,0,.6);
91+
}
92+
9893
/* Icons
9994
-----------------------------------------------------------------------------------------------------------*/
10095

@@ -109,7 +104,7 @@ legend,
109104
}
110105

111106
/* Alt icon color */
112-
.ui-btn.ui-icon-alt:after,
107+
.ui-icon-alt.ui-btn:after,
113108
.ui-icon-alt .ui-btn[class*="ui-icon-"]:after,
114109
.ui-icon-alt .ui-input-search:after {
115110
background-color: #fff;
@@ -119,12 +114,20 @@ legend,
119114
}
120115

121116
/* No disc */
122-
.ui-btn.ui-icon-nodisc:after,
117+
.ui-icon-nodisc.ui-btn:after,
123118
.ui-icon-nodisc .ui-btn[class*="ui-icon-"]:after,
124119
.ui-icon-nodisc .ui-input-search:after {
125120
background-color: transparent;
126121
}
127122

123+
/* Icon shadow */
124+
.ui-shadow-icon.ui-btn:after,
125+
.ui-shadow-icon .ui-btn[class*="ui-icon-"]:after {
126+
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,.3) /*{global-icon-shadow}*/;
127+
-moz-box-shadow: 0 1px 0 rgba(255,255,255,.3) /*{global-icon-shadow}*/;
128+
box-shadow: 0 1px 0 rgba(255,255,255,.3) /*{global-icon-shadow}*/;
129+
}
130+
128131
/* Icon sprite */
129132

130133
.ui-icon-plus:after {

‎js/jquery.mobile.buttonMarkup.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ var reverseBoolOptionMap = {
2121
"ui-shadow" : "shadow",
2222
"ui-corner-all" : "corners",
2323
"ui-btn-inline" : "inline",
24-
"ui-shadow-icon" : "iconshadow",
24+
"ui-shadow-icon" : "iconshadow", /* TODO: Remove in 1.5 */
2525
"ui-mini" : "mini"
2626
};
2727

@@ -52,7 +52,7 @@ function optionsToClasses( options, existingClasses ) {
5252
"ui-btn-icon-" + options.iconpos
5353
]);
5454
if ( options.iconshadow ) {
55-
classes.push( "ui-shadow-icon" );
55+
classes.push( "ui-shadow-icon" ); /* TODO: Remove in 1.5 */
5656
}
5757
}
5858

@@ -220,7 +220,7 @@ $.fn.buttonMarkup.defaults = {
220220
inline: false,
221221
shadow: true,
222222
corners: true,
223-
iconshadow: true,
223+
iconshadow: false, /* TODO: Remove in 1.5. Option deprecated in 1.4. */
224224
mini: false
225225
};
226226

@@ -249,7 +249,7 @@ function enhanceWithButtonMarkup( idx, el ) {
249249
inline : getAttrFixed( el, "inline", true ),
250250
shadow : getAttrFixed( el, "shadow", true ),
251251
corners : getAttrFixed( el, "corners", true ),
252-
iconshadow: getAttrFixed( el, "iconshadow", true ),
252+
iconshadow: getAttrFixed( el, "iconshadow", true ), /* TODO: Remove in 1.5 */
253253
mini : getAttrFixed( el, "mini", true )
254254
}), el.className.split( " " ) ).sort();
255255

‎js/widgets/forms/button.js‎

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ $.widget( "mobile.button", $.mobile.widget, {
1414
theme: null,
1515
icon: null,
1616
iconpos: null,
17-
iconshadow: true,
17+
iconshadow: false, /* TODO: Deprecated in 1.4, remove in 1.5. */
1818
corners: true,
1919
shadow: true,
2020
inline: null,
@@ -30,14 +30,10 @@ $.widget( "mobile.button", $.mobile.widget, {
3030
if ( isInput ) {
3131
classes += " ui-input-btn";
3232

33-
// TODO: When we have time to test thoroughly--any classes manually applied to the original element should be carried over to the enhanced element, with an `-enhanced` suffix. See https://github.com/jquery/jquery-mobile/issues/3577
34-
/* if ( $el[0].className.length ) {
35-
classes = $el[0].className;
36-
} */
33+
// TODO: data-class and data-id options. See https://github.com/jquery/jquery-mobile/issues/3577
3734
if ( !!~$el[ 0 ].className.indexOf( "ui-btn-left" ) ) {
3835
classes += " ui-btn-left";
3936
}
40-
4137
if ( !!~$el[ 0 ].className.indexOf( "ui-btn-right" ) ) {
4238
classes += " ui-btn-right";
4339
}
@@ -125,6 +121,7 @@ $.widget( "mobile.button", $.mobile.widget, {
125121
$el.attr( "title", text );
126122
}
127123

124+
/* TODO: Remove in 1.5. */
128125
if ( o.iconshadow ) {
129126
classes += " ui-shadow-icon";
130127
}

‎js/widgets/forms/select.js‎

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ $.widget( "mobile.selectmenu", $.mobile.widget, $.extend( {
1818
inline: false,
1919
corners: true,
2020
shadow: true,
21-
iconshadow: true,
21+
iconshadow: false, /* TODO: Deprecated in 1.4, remove in 1.5. */
2222
overlayTheme: null,
2323
dividerTheme: null,
2424
hidePlaceholderMenuItems: true,
@@ -112,11 +112,8 @@ $.widget( "mobile.selectmenu", $.mobile.widget, $.extend( {
112112
button = this.button
113113
.insertBefore( this.select )
114114
.addClass( "ui-btn" +
115-
( options.icon ?
116-
( " ui-icon-" + options.icon + " ui-btn-icon-" + iconpos + ( options.iconshadow ?
117-
" ui-shadow-icon" :
118-
"" ) ) :
119-
"" ) +
115+
( options.icon ? ( " ui-icon-" + options.icon + " ui-btn-icon-" + iconpos +
116+
( options.iconshadow ? " ui-shadow-icon" : "" ) ) : "" ) + /* TODO: Remove in 1.5. */
120117
( options.theme ? " ui-btn-" + options.theme : "" ) +
121118
( options.corners ? " ui-corner-all" : "" ) +
122119
( options.shadow ? " ui-shadow" : "" ) );

0 commit comments

Comments
 (0)