170 .theme-browser .theme .more-details { |
160 .theme-browser .theme .more-details { |
171 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; |
161 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; |
172 opacity: 0; |
162 opacity: 0; |
173 position: absolute; |
163 position: absolute; |
174 top: 35%; |
164 top: 35%; |
175 right: 25%; |
165 right: 20%; |
176 left: 25%; |
166 left: 20%; |
177 background: #23282d; |
167 background: #23282d; |
178 background: rgba(0,0,0,0.7); |
168 background: rgba(0,0,0,0.7); |
179 color: #fff; |
169 color: #fff; |
180 font-size: 15px; |
170 font-size: 15px; |
181 text-shadow: 0 1px 0 rgba(0,0,0,0.6); |
171 text-shadow: 0 1px 0 rgba(0,0,0,0.6); |
182 -webkit-font-smoothing: antialiased; |
172 -webkit-font-smoothing: antialiased; |
183 font-weight: 600; |
173 font-weight: 600; |
184 padding: 15px 12px; |
174 padding: 15px 12px; |
185 text-align: center; |
175 text-align: center; |
186 -webkit-border-radius: 3px; |
|
187 border-radius: 3px; |
176 border-radius: 3px; |
188 -webkit-transition: opacity 0.1s ease-in-out; |
|
189 transition: opacity 0.1s ease-in-out; |
177 transition: opacity 0.1s ease-in-out; |
190 } |
178 } |
191 |
179 |
192 .theme-browser .theme:focus { |
180 .theme-browser .theme:focus { |
193 border-color: #5b9dd9; |
181 border-color: #5b9dd9; |
194 -webkit-box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 ); |
|
195 box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 ); |
182 box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 ); |
196 } |
183 } |
197 |
184 |
198 .theme-browser .theme:focus .more-details { |
185 .theme-browser .theme:focus .more-details { |
199 opacity: 1; |
186 opacity: 1; |
209 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; |
196 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; |
210 opacity: 1; |
197 opacity: 1; |
211 } |
198 } |
212 |
199 |
213 /** |
200 /** |
214 * Displays a theme update notice |
|
215 * when an update is available. |
|
216 */ |
|
217 .theme-browser .theme .theme-update, |
|
218 .theme-browser .theme .theme-installed { |
|
219 background: #d54e21; |
|
220 background: rgba(213, 78, 33, 0.95); |
|
221 color: #fff; |
|
222 display: block; |
|
223 font-size: 13px; |
|
224 font-weight: 400; |
|
225 height: 48px; |
|
226 line-height: 48px; |
|
227 padding: 0 10px; |
|
228 position: absolute; |
|
229 top: 0; |
|
230 right: 0; |
|
231 left: 0; |
|
232 border-bottom: 1px solid rgba(0,0,0,0.25); |
|
233 overflow: hidden; |
|
234 } |
|
235 |
|
236 .theme-browser .theme .theme-update:before, |
|
237 .theme-browser .theme .theme-installed:before { |
|
238 content: '\f463'; |
|
239 display: inline-block; |
|
240 font: normal 20px/1 'dashicons'; |
|
241 margin: 0 6px 0 0; |
|
242 opacity: 0.8; |
|
243 position: relative; |
|
244 top: 5px; |
|
245 speak: none; |
|
246 -webkit-font-smoothing: antialiased; |
|
247 } |
|
248 |
|
249 |
|
250 /** |
|
251 * The currently active theme |
201 * The currently active theme |
252 */ |
202 */ |
253 .theme-browser .theme.active .theme-name { |
203 .theme-browser .theme.active .theme-name { |
254 background: #2f2f2f; |
204 background: #23282d; |
255 color: #fff; |
205 color: #fff; |
256 padding-right: 110px; |
206 padding-right: 110px; |
257 font-weight: 300; |
207 font-weight: 300; |
258 -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.5); |
|
259 box-shadow: inset 0 1px 1px rgba(0,0,0,0.5); |
208 box-shadow: inset 0 1px 1px rgba(0,0,0,0.5); |
260 } |
209 } |
261 |
210 |
262 .theme-browser .customize-control .theme.active .theme-name { |
211 .theme-browser .customize-control .theme.active .theme-name { |
263 padding-right: 15px; |
212 padding-right: 15px; |
326 bottom: 0; |
288 bottom: 0; |
327 padding: 0; |
289 padding: 0; |
328 text-shadow: none; |
290 text-shadow: none; |
329 border: 5px dashed #d5d2ca; |
291 border: 5px dashed #d5d2ca; |
330 border: 5px dashed rgba(0, 0, 0, 0.1); |
292 border: 5px dashed rgba(0, 0, 0, 0.1); |
331 -webkit-box-sizing: border-box; |
|
332 -moz-box-sizing: border-box; |
|
333 box-sizing: border-box; |
293 box-sizing: border-box; |
334 } |
294 } |
335 |
295 |
336 .theme-browser .theme.add-new-theme span:after { |
296 .theme-browser .theme.add-new-theme span:after { |
337 background: #e5e5e5; |
297 background: #e5e5e5; |
338 background: rgba(153, 153, 153, 0.1); |
298 background: rgba(153, 153, 153, 0.1); |
339 -webkit-border-radius: 50%; |
|
340 border-radius: 50%; |
299 border-radius: 50%; |
341 display: inline-block; |
300 display: inline-block; |
342 content: '\f132'; |
301 content: "\f132"; |
343 -webkit-font-smoothing: antialiased; |
302 -webkit-font-smoothing: antialiased; |
344 font: normal 74px/115px 'dashicons'; |
303 font: normal 74px/115px dashicons; |
345 width: 100px; |
304 width: 100px; |
346 height: 100px; |
305 height: 100px; |
347 vertical-align: middle; |
306 vertical-align: middle; |
348 text-align: center; |
307 text-align: center; |
349 color: rgb(153, 153, 153); |
308 color: rgb(153, 153, 153); |
434 text-align: center; |
392 text-align: center; |
435 float: right; |
393 float: right; |
436 border: 0; |
394 border: 0; |
437 border-left: 1px solid #ddd; |
395 border-left: 1px solid #ddd; |
438 background-color: transparent; |
396 background-color: transparent; |
439 -webkit-transition: color .1s ease-in-out, background .1s ease-in-out; |
|
440 transition: color .1s ease-in-out, background .1s ease-in-out; |
397 transition: color .1s ease-in-out, background .1s ease-in-out; |
441 } |
398 } |
442 |
399 |
443 .theme-overlay .theme-header .close:before { |
400 .theme-overlay .theme-header .close:before { |
444 font: normal 22px/50px 'dashicons' !important; |
401 font: normal 22px/50px dashicons !important; |
445 color: #777; |
402 color: #72777c; |
446 display: inline-block; |
403 display: inline-block; |
447 content: '\f335'; |
404 content: "\f335"; |
448 font-weight: 300; |
405 font-weight: 300; |
449 } |
406 } |
450 |
407 |
451 /* Left and right navigation */ |
408 /* Left and right navigation */ |
452 .theme-overlay .theme-header .right, |
409 .theme-overlay .theme-header .right, |
453 .theme-overlay .theme-header .left { |
410 .theme-overlay .theme-header .left { |
454 cursor: pointer; |
411 cursor: pointer; |
455 color: #777; |
412 color: #72777c; |
456 background-color: transparent; |
413 background-color: transparent; |
457 height: 48px; |
414 height: 48px; |
458 width: 54px; |
415 width: 54px; |
459 float: left; |
416 float: left; |
460 text-align: center; |
417 text-align: center; |
461 border: 0; |
418 border: 0; |
462 border-right: 1px solid #ddd; |
419 border-right: 1px solid #ddd; |
463 -webkit-transition: color .1s ease-in-out, background .1s ease-in-out; |
|
464 transition: color .1s ease-in-out, background .1s ease-in-out; |
420 transition: color .1s ease-in-out, background .1s ease-in-out; |
465 } |
421 } |
466 |
422 |
467 .theme-overlay .theme-header .close:focus, |
423 .theme-overlay .theme-header .close:focus, |
468 .theme-overlay .theme-header .close:hover, |
424 .theme-overlay .theme-header .close:hover, |
1081 |
989 |
1082 /* Already installed theme */ |
990 /* Already installed theme */ |
1083 .theme-browser .theme .theme-installed { |
991 .theme-browser .theme .theme-installed { |
1084 background: #0073aa; |
992 background: #0073aa; |
1085 } |
993 } |
1086 .theme-browser .theme .theme-installed:before { |
994 .theme-browser .theme .notice-success p:before { |
1087 content: '\f147'; |
995 color: #79ba49; |
1088 } |
996 content: "\f147"; |
1089 .theme-browser .theme.is-installed .theme-actions .button-primary { |
997 display: inline-block; |
1090 display: none !important; |
998 font: normal 20px/1 'dashicons'; |
|
999 -webkit-font-smoothing: antialiased; |
|
1000 -moz-osx-font-smoothing: grayscale; |
|
1001 vertical-align: top; |
|
1002 } |
|
1003 |
|
1004 .theme-install.updated-message:before { |
|
1005 content: ''; |
|
1006 } |
|
1007 |
|
1008 .theme-install-php .wp-filter { |
|
1009 padding-left: 20px; |
1091 } |
1010 } |
1092 |
1011 |
1093 .theme-install-php a.upload, |
1012 .theme-install-php a.upload, |
1094 .theme-install-php a.browse-themes { |
1013 .theme-install-php a.browse-themes { |
1095 cursor: pointer; |
1014 cursor: pointer; |
1096 } |
1015 } |
1097 .theme-install-php a.browse-themes, |
1016 |
1098 .theme-install-php.show-upload-theme a.upload { |
1017 .upload-view-toggle .browse, |
|
1018 .plugin-install-tab-upload .upload-view-toggle .upload { |
1099 display: none; |
1019 display: none; |
1100 } |
1020 } |
1101 .theme-install-php.show-upload-theme a.browse-themes { |
1021 |
|
1022 .plugin-install-tab-upload .upload-view-toggle .browse { |
1102 display: inline; |
1023 display: inline; |
1103 } |
1024 } |
|
1025 |
1104 .upload-theme, |
1026 .upload-theme, |
1105 .upload-plugin { |
1027 .upload-plugin { |
1106 -webkit-box-sizing: border-box; |
|
1107 -moz-box-sizing: border-box; |
|
1108 box-sizing: border-box; |
1028 box-sizing: border-box; |
1109 display: none; |
1029 display: none; |
1110 margin: 0; |
1030 margin: 0; |
1111 padding: 0; |
1031 padding: 50px 0; |
1112 width: 100%; |
1032 width: 100%; |
1113 overflow: hidden; |
1033 overflow: hidden; |
1114 position: relative; |
1034 position: relative; |
1115 top: 10px; |
1035 top: 10px; |
1116 } |
1036 } |
1117 body.show-upload-theme .upload-theme, |
1037 |
1118 .upload-plugin { |
1038 .upload-plugin-wrap { |
|
1039 display: none; |
|
1040 } |
|
1041 |
|
1042 .show-upload-view .upload-theme, |
|
1043 .show-upload-view .upload-plugin, |
|
1044 .show-upload-view .upload-plugin-wrap, |
|
1045 .plugin-install-tab-upload .upload-plugin { |
1119 display: block; |
1046 display: block; |
1120 } |
1047 } |
|
1048 |
1121 .upload-theme .wp-upload-form, |
1049 .upload-theme .wp-upload-form, |
1122 .upload-plugin .wp-upload-form { |
1050 .upload-plugin .wp-upload-form { |
1123 background: #fafafa; |
1051 background: #fafafa; |
1124 border: 1px solid #e5e5e5; |
1052 border: 1px solid #e5e5e5; |
1125 padding: 30px; |
1053 padding: 30px; |
1126 margin: 30px auto; |
1054 margin: 30px auto; |
1127 max-width: 380px; |
1055 max-width: 380px; |
1128 } |
1056 } |
1129 .upload-theme .install-help, |
1057 .upload-theme .install-help, |
1130 .upload-plugin .install-help { |
1058 .upload-plugin .install-help { |
1131 color: #999; |
1059 color: #555d66; /* #f1f1f1 background */ |
1132 font-size: 18px; |
1060 font-size: 18px; |
1133 font-style: normal; |
1061 font-style: normal; |
1134 margin: 0; |
1062 margin: 0; |
1135 padding: 40px 0 0; |
1063 padding: 0; |
1136 text-align: center; |
1064 text-align: center; |
1137 } |
1065 } |
1138 body.show-upload-theme .upload-theme + .wp-filter, |
1066 |
1139 body.show-upload-theme .upload-theme + .wp-filter + .theme-browser { |
1067 p.no-themes, |
1140 display: none; |
1068 p.no-themes-local { |
1141 } |
|
1142 |
|
1143 p.no-themes { |
|
1144 clear: both; |
1069 clear: both; |
1145 color: #666; |
1070 color: #666; |
1146 font-size: 18px; |
1071 font-size: 18px; |
1147 font-style: normal; |
1072 font-style: normal; |
1148 margin: 0; |
1073 margin: 0; |
1149 padding: 0; |
1074 padding: 100px 0; |
1150 text-align: center; |
1075 text-align: center; |
1151 display: none; |
1076 display: none; |
1152 } |
1077 } |
1153 body.no-results p.no-themes { |
1078 |
|
1079 .no-results p.no-themes { |
1154 display: block; |
1080 display: block; |
1155 } |
|
1156 body.show-upload-theme p.no-themes { |
|
1157 display: none !important; |
|
1158 } |
1081 } |
1159 |
1082 |
1160 .theme-install-php .add-new-theme { |
1083 .theme-install-php .add-new-theme { |
1161 display: none !important; |
1084 display: none !important; |
1162 } |
1085 } |
1171 padding: 20px 0 0; |
1094 padding: 20px 0 0; |
1172 text-align: left; |
1095 text-align: left; |
1173 } |
1096 } |
1174 } |
1097 } |
1175 |
1098 |
1176 .rating { |
1099 .theme-details .theme-rating { |
1177 margin: 15px 0 0; |
1100 line-height: 23px; |
1178 } |
1101 } |
1179 .rating span:before { |
1102 |
1180 color: #e6b800; |
1103 .theme-details .star-rating { |
1181 content: "\f154"; |
1104 display: inline; |
1182 display: inline-block; |
1105 } |
1183 -webkit-font-smoothing: antialiased; |
1106 |
1184 font: normal 20px/1 'dashicons'; |
1107 .theme-details .num-ratings, |
1185 vertical-align: top; |
1108 .theme-details .no-rating { |
1186 } |
1109 font-size: 11px; |
1187 /* Half stars */ |
1110 color: #72777c; |
1188 .rating-10 span.one:before, |
1111 } |
1189 .rating-30 span.two:before, |
1112 |
1190 .rating-50 span.three:before, |
1113 .theme-details .no-rating { |
1191 .rating-70 span.four:before, |
|
1192 .rating-90 span.five:before { |
|
1193 content: "\f459"; |
|
1194 } |
|
1195 /* Full stars */ |
|
1196 .rating-20 span.one:before { |
|
1197 content: "\f155"; |
|
1198 } |
|
1199 .rating-30 span.one:before, |
|
1200 .rating-40 span.one:before, |
|
1201 .rating-40 span.two:before { |
|
1202 content: "\f155"; |
|
1203 } |
|
1204 .rating-50 span.one:before, |
|
1205 .rating-50 span.two:before, |
|
1206 .rating-60 span.one:before, |
|
1207 .rating-60 span.two:before, |
|
1208 .rating-60 span.three:before { |
|
1209 content: "\f155"; |
|
1210 } |
|
1211 .rating-70 span.one:before, |
|
1212 .rating-70 span.two:before, |
|
1213 .rating-70 span.three:before, |
|
1214 .rating-80 span.one:before, |
|
1215 .rating-80 span.two:before, |
|
1216 .rating-80 span.three:before, |
|
1217 .rating-80 span.four:before { |
|
1218 content: "\f155"; |
|
1219 } |
|
1220 .rating-90 span.one:before, |
|
1221 .rating-90 span.two:before, |
|
1222 .rating-90 span.three:before, |
|
1223 .rating-90 span.four:before, |
|
1224 .rating-100 span.one:before, |
|
1225 .rating-100 span.two:before, |
|
1226 .rating-100 span.three:before, |
|
1227 .rating-100 span.four:before, |
|
1228 .rating-100 span.five:before { |
|
1229 content: "\f155"; |
|
1230 } |
|
1231 .rating .ratings { |
|
1232 display: block; |
1114 display: block; |
1233 line-height: 20px; |
1115 line-height: 20px; |
1234 color: #999; |
|
1235 } |
1116 } |
1236 |
1117 |
1237 /*------------------------------------------------------------------------------ |
1118 /*------------------------------------------------------------------------------ |
1238 16.3 - Custom Header Screen |
1119 16.3 - Custom Header Screen |
1239 ------------------------------------------------------------------------------*/ |
1120 ------------------------------------------------------------------------------*/ |
1240 |
1121 |
1241 .appearance_page_custom-header #headimg { |
1122 .appearance_page_custom-header #headimg { |
1242 border: 1px solid #DFDFDF; |
1123 border: 1px solid #ddd; |
1243 overflow: hidden; |
1124 overflow: hidden; |
1244 width: 100%; |
1125 width: 100%; |
1245 } |
1126 } |
1246 |
1127 |
1247 .appearance_page_custom-header #upload-form p label { |
1128 .appearance_page_custom-header #upload-form p label { |
1273 16.4 - Custom Background Screen |
1154 16.4 - Custom Background Screen |
1274 ------------------------------------------------------------------------------*/ |
1155 ------------------------------------------------------------------------------*/ |
1275 |
1156 |
1276 div#custom-background-image { |
1157 div#custom-background-image { |
1277 min-height: 100px; |
1158 min-height: 100px; |
1278 border: 1px solid #dfdfdf; |
1159 border: 1px solid #ddd; |
1279 } |
1160 } |
1280 |
1161 |
1281 div#custom-background-image img { |
1162 div#custom-background-image img { |
1282 max-width: 400px; |
1163 max-width: 400px; |
1283 max-height: 300px; |
1164 max-height: 300px; |
1284 } |
1165 } |
1285 |
1166 |
|
1167 .background-position-control input[type="radio"]:checked ~ .button { |
|
1168 background: #eee; |
|
1169 border-color: #999; |
|
1170 box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, .5 ); |
|
1171 z-index: 1; |
|
1172 } |
|
1173 |
|
1174 .background-position-control input[type="radio"]:focus ~ .button { |
|
1175 border-color: #5b9dd9; |
|
1176 box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, .5 ), 0 0 3px rgba( 0, 115, 170, .8 ); |
|
1177 color: #23282d; |
|
1178 } |
|
1179 |
|
1180 .background-position-control .background-position-center-icon, |
|
1181 .background-position-control .background-position-center-icon:before { |
|
1182 display: inline-block; |
|
1183 line-height: 1; |
|
1184 text-align: center; |
|
1185 transition: background-color .1s ease-in 0; |
|
1186 } |
|
1187 |
|
1188 .background-position-control .background-position-center-icon { |
|
1189 height: 20px; |
|
1190 margin-top: 13px; |
|
1191 vertical-align: top; |
|
1192 width: 20px; |
|
1193 } |
|
1194 |
|
1195 .background-position-control .background-position-center-icon:before { |
|
1196 background-color: #555; |
|
1197 border-radius: 50%; |
|
1198 content: ""; |
|
1199 height: 12px; |
|
1200 width: 12px; |
|
1201 } |
|
1202 |
|
1203 .background-position-control .button:hover .background-position-center-icon:before, |
|
1204 .background-position-control input[type="radio"]:focus ~ .button .background-position-center-icon:before { |
|
1205 background-color: #23282d; |
|
1206 } |
|
1207 |
|
1208 .background-position-control .button-group { |
|
1209 display: block; |
|
1210 } |
|
1211 |
|
1212 .background-position-control .button-group .button { |
|
1213 border-radius: 0; |
|
1214 box-shadow: none; |
|
1215 /* Following properties are overridden by buttons responsive styles (see: wp-includes/css/buttons.css). */ |
|
1216 height: 40px !important; |
|
1217 line-height: 37px !important; |
|
1218 margin: 0 -1px 0 0 !important; |
|
1219 padding: 0 10px 1px !important; |
|
1220 position: relative; |
|
1221 } |
|
1222 |
|
1223 .background-position-control .button-group .button:active, |
|
1224 .background-position-control .button-group .button:hover, |
|
1225 .background-position-control .button-group .button:focus { |
|
1226 z-index: 1; |
|
1227 } |
|
1228 |
|
1229 .background-position-control .button-group:last-child .button { |
|
1230 box-shadow: 0 1px 0 #ccc; |
|
1231 } |
|
1232 |
|
1233 .background-position-control .button-group > label { |
|
1234 margin: 0 !important; |
|
1235 } |
|
1236 |
|
1237 .background-position-control .button-group:first-child > label:first-child .button { |
|
1238 border-radius: 3px 0 0; |
|
1239 } |
|
1240 |
|
1241 .background-position-control .button-group:first-child > label:first-child .dashicons { |
|
1242 -webkit-transform: rotate( 45deg ); |
|
1243 transform: rotate( 45deg ); |
|
1244 } |
|
1245 |
|
1246 .background-position-control .button-group:first-child > label:last-child .button { |
|
1247 border-radius: 0 3px 0 0; |
|
1248 } |
|
1249 |
|
1250 .background-position-control .button-group:first-child > label:last-child .dashicons { |
|
1251 -webkit-transform: rotate( -45deg ); |
|
1252 transform: rotate( -45deg ); |
|
1253 } |
|
1254 |
|
1255 .background-position-control .button-group:last-child > label:first-child .button { |
|
1256 border-radius: 0 0 0 3px; |
|
1257 } |
|
1258 |
|
1259 .background-position-control .button-group:last-child > label:first-child .dashicons { |
|
1260 -webkit-transform: rotate( -45deg ); |
|
1261 transform: rotate( -45deg ); |
|
1262 } |
|
1263 |
|
1264 .background-position-control .button-group:last-child > label:last-child .button { |
|
1265 border-radius: 0 0 3px 0; |
|
1266 } |
|
1267 |
|
1268 .background-position-control .button-group:last-child > label:last-child .dashicons { |
|
1269 -webkit-transform: rotate( 45deg ); |
|
1270 transform: rotate( 45deg ); |
|
1271 } |
|
1272 |
|
1273 .background-position-control .button-group .dashicons { |
|
1274 margin-top: 9px; |
|
1275 } |
|
1276 |
|
1277 .background-position-control .button-group + .button-group { |
|
1278 margin-top: -1px; |
|
1279 } |
|
1280 |
1286 /*------------------------------------------------------------------------------ |
1281 /*------------------------------------------------------------------------------ |
1287 23.0 - Full Overlay w/ Sidebar |
1282 23.0 - Full Overlay w/ Sidebar |
1288 ------------------------------------------------------------------------------*/ |
1283 ------------------------------------------------------------------------------*/ |
1289 |
1284 |
1290 body.full-overlay-active { |
1285 body.full-overlay-active { |
1291 overflow: hidden; |
1286 overflow: hidden; |
|
1287 /* Hide all the content, the Customizer overlay is then made visible to be the only available content. */ |
|
1288 visibility: hidden; |
1292 } |
1289 } |
1293 |
1290 |
1294 .wp-full-overlay { |
1291 .wp-full-overlay { |
1295 background: transparent; |
1292 background: transparent; |
1296 z-index: 500000; |
1293 z-index: 500000; |
1474 background: #eee; |
1477 background: #eee; |
1475 cursor: default; |
1478 cursor: default; |
1476 pointer-events: none; |
1479 pointer-events: none; |
1477 } |
1480 } |
1478 |
1481 |
|
1482 .theme-install-overlay .close-full-overlay, |
|
1483 .theme-install-overlay .previous-theme, |
|
1484 .theme-install-overlay .next-theme { |
|
1485 border-left: 0; |
|
1486 border-top: 0; |
|
1487 border-bottom: 0; |
|
1488 } |
|
1489 |
|
1490 .theme-install-overlay .close-full-overlay:before, |
|
1491 .theme-install-overlay .previous-theme:before, |
|
1492 .theme-install-overlay .next-theme:before { |
|
1493 top: 2px; |
|
1494 left: 0; |
|
1495 } |
|
1496 |
1479 /* Collapse Button */ |
1497 /* Collapse Button */ |
1480 .wp-full-overlay a.collapse-sidebar { |
1498 .wp-core-ui .wp-full-overlay .collapse-sidebar { |
1481 position: absolute; |
1499 position: fixed; |
1482 bottom: 12px; |
1500 bottom: 0; |
1483 left: 0; |
1501 left: 0; |
1484 z-index: 50; |
1502 padding: 9px 0 9px 10px; |
|
1503 height: 45px; |
|
1504 color: #656a6f; |
|
1505 outline: 0; |
|
1506 line-height: 1; |
|
1507 background-color: transparent !important; |
|
1508 border: none !important; |
|
1509 box-shadow: none !important; |
|
1510 border-radius: 0 !important; |
|
1511 } |
|
1512 |
|
1513 .wp-core-ui .wp-full-overlay .collapse-sidebar:hover, |
|
1514 .wp-core-ui .wp-full-overlay .collapse-sidebar:focus { |
|
1515 color: #0073aa; |
|
1516 } |
|
1517 |
|
1518 .wp-full-overlay .collapse-sidebar-arrow, |
|
1519 .wp-full-overlay .collapse-sidebar-label { |
|
1520 display: inline-block; |
|
1521 vertical-align: middle; |
|
1522 line-height: 20px; |
|
1523 } |
|
1524 |
|
1525 .wp-full-overlay .collapse-sidebar-arrow { |
|
1526 width: 20px; |
|
1527 height: 20px; |
|
1528 margin: 0 2px; /* avoid the focus box-shadow to be cut-off */ |
|
1529 border-radius: 50%; |
|
1530 overflow: hidden; |
|
1531 } |
|
1532 |
|
1533 .wp-full-overlay .collapse-sidebar:hover .collapse-sidebar-arrow, |
|
1534 .wp-full-overlay .collapse-sidebar:focus .collapse-sidebar-arrow { |
|
1535 box-shadow: |
|
1536 0 0 0 1px #5b9dd9, |
|
1537 0 0 2px 1px rgba(30, 140, 190, .8); |
|
1538 } |
|
1539 |
|
1540 .wp-full-overlay .collapse-sidebar-label { |
|
1541 margin-left: 3px; |
|
1542 } |
|
1543 |
|
1544 .wp-full-overlay.collapsed .collapse-sidebar-label { |
|
1545 display: none; |
|
1546 } |
|
1547 |
|
1548 .wp-full-overlay .collapse-sidebar-arrow:before { |
1485 display: block; |
1549 display: block; |
1486 width: 19px; |
|
1487 height: 19px; |
|
1488 margin-left: 15px; |
|
1489 padding: 0; |
|
1490 -webkit-border-radius: 50%; |
|
1491 border-radius: 50%; |
|
1492 color: #777; |
|
1493 text-decoration: none; |
|
1494 } |
|
1495 |
|
1496 .wp-full-overlay a.collapse-sidebar:hover { |
|
1497 color: #0073aa; |
|
1498 } |
|
1499 |
|
1500 .wp-full-overlay.collapsed .collapse-sidebar { |
|
1501 position: absolute; |
|
1502 left: 100%; |
|
1503 } |
|
1504 |
|
1505 .wp-full-overlay .collapse-sidebar-arrow { |
|
1506 position: static; |
|
1507 margin-top: 0; |
|
1508 margin-left: 0; |
|
1509 display: block; |
|
1510 width: auto; |
|
1511 height: auto; |
|
1512 background: none; |
|
1513 } |
|
1514 |
|
1515 .wp-full-overlay .collapse-sidebar-arrow:before { |
|
1516 -webkit-border-radius: 50%; |
|
1517 border-radius: 50%; |
|
1518 float: left; |
|
1519 content: "\f148"; |
1550 content: "\f148"; |
1520 background: #eee; |
1551 background: #eee; |
1521 font: normal 20px/1 'dashicons'; |
1552 font: normal 20px/1 dashicons; |
1522 speak: none; |
1553 speak: none; |
1523 display: block; |
|
1524 padding: 0; |
1554 padding: 0; |
1525 text-indent: 0; |
|
1526 text-align: center; |
|
1527 position: relative; |
|
1528 -webkit-font-smoothing: antialiased; |
1555 -webkit-font-smoothing: antialiased; |
1529 -moz-osx-font-smoothing: grayscale; |
1556 -moz-osx-font-smoothing: grayscale; |
1530 text-decoration: none !important; |
1557 } |
|
1558 |
|
1559 .wp-core-ui .wp-full-overlay.collapsed .collapse-sidebar { |
|
1560 padding: 9px 10px; |
1531 } |
1561 } |
1532 |
1562 |
1533 /* rtl:ignore */ |
1563 /* rtl:ignore */ |
1534 .wp-full-overlay.collapsed .collapse-sidebar-arrow:before, |
1564 .wp-full-overlay.collapsed .collapse-sidebar-arrow:before, |
1535 .rtl .wp-full-overlay .collapse-sidebar-arrow:before { |
1565 .rtl .wp-full-overlay .collapse-sidebar-arrow:before { |
1536 -webkit-transform: rotate(180deg); |
1566 -webkit-transform: rotate(180.001deg); |
1537 -ms-transform: rotate(180deg); |
1567 transform: rotate(180.001deg); /* Firefox: promoting to its own layer to trigger anti-aliasing */ |
1538 transform: rotate(180deg); |
|
1539 } |
1568 } |
1540 |
1569 |
1541 .rtl .wp-full-overlay.collapsed .collapse-sidebar-arrow:before { |
1570 .rtl .wp-full-overlay.collapsed .collapse-sidebar-arrow:before { |
1542 -webkit-transform: none; |
1571 -webkit-transform: none; |
1543 -ms-transform: none; |
|
1544 transform: none; |
1572 transform: none; |
1545 } |
|
1546 |
|
1547 .wp-full-overlay.collapsed .collapse-sidebar-arrow { |
|
1548 background-position: -1px -109px; |
|
1549 } |
|
1550 |
|
1551 .wp-full-overlay .collapse-sidebar-label { |
|
1552 position: absolute; |
|
1553 left: 100%; |
|
1554 line-height: 20px; |
|
1555 margin-left: 10px; |
|
1556 } |
|
1557 |
|
1558 .wp-full-overlay.collapsed .collapse-sidebar-label { |
|
1559 display: none; |
|
1560 } |
1573 } |
1561 |
1574 |
1562 /* Animations */ |
1575 /* Animations */ |
1563 .wp-full-overlay, |
1576 .wp-full-overlay, |
1564 .wp-full-overlay-sidebar, |
1577 .wp-full-overlay-sidebar, |
1565 .wp-full-overlay .collapse-sidebar, |
1578 .wp-full-overlay .collapse-sidebar, |
1566 .wp-full-overlay-main { |
1579 .wp-full-overlay-main { |
1567 -webkit-transition-property: left, right, top, bottom, width, margin; |
|
1568 transition-property: left, right, top, bottom, width, margin; |
1580 transition-property: left, right, top, bottom, width, margin; |
1569 -webkit-transition-duration: 0.2s; |
|
1570 transition-duration: 0.2s; |
1581 transition-duration: 0.2s; |
1571 } |
1582 } |
|
1583 |
|
1584 /* Device/preview size toggles */ |
|
1585 |
|
1586 .wp-full-overlay { |
|
1587 background: #191e23; |
|
1588 } |
|
1589 |
|
1590 .wp-full-overlay-main { |
|
1591 background-color: #f1f1f1; |
|
1592 } |
|
1593 |
|
1594 .expanded .wp-full-overlay-footer { |
|
1595 position: fixed; |
|
1596 bottom: 0; |
|
1597 left: 0; |
|
1598 min-width: 299px; |
|
1599 max-width: 599px; |
|
1600 width: 18%; |
|
1601 width: calc( 18% - 1px ); |
|
1602 height: 45px; |
|
1603 border-top: 1px solid #ddd; |
|
1604 background: #eee; |
|
1605 } |
|
1606 |
|
1607 .wp-full-overlay-footer .devices-wrapper { |
|
1608 float: right; |
|
1609 } |
|
1610 |
|
1611 .wp-full-overlay-footer .devices { |
|
1612 position: relative; |
|
1613 background: #eee; |
|
1614 box-shadow: -20px 0 10px -5px #eee; |
|
1615 } |
|
1616 |
|
1617 .wp-full-overlay-footer .devices button { |
|
1618 cursor: pointer; |
|
1619 background: transparent; |
|
1620 border: none; |
|
1621 height: 45px; |
|
1622 padding: 0 3px; |
|
1623 margin: 0 0 0 -4px; |
|
1624 box-shadow: none; |
|
1625 border-top: 1px solid transparent; |
|
1626 border-bottom: 4px solid transparent; |
|
1627 transition: .15s color ease-in-out, |
|
1628 .15s background-color ease-in-out, |
|
1629 .15s border-color ease-in-out; |
|
1630 } |
|
1631 |
|
1632 .wp-full-overlay-footer .devices button:focus { |
|
1633 box-shadow: none; |
|
1634 outline: none; |
|
1635 } |
|
1636 |
|
1637 .wp-full-overlay-footer .devices button:before { |
|
1638 display: inline-block; |
|
1639 -webkit-font-smoothing: antialiased; |
|
1640 font: normal 20px/30px "dashicons"; |
|
1641 vertical-align: top; |
|
1642 margin: 3px 0; |
|
1643 padding: 4px 8px; |
|
1644 color: #656a6f; |
|
1645 } |
|
1646 |
|
1647 .wp-full-overlay-footer .devices button.active { |
|
1648 border-bottom-color: #191e23; |
|
1649 } |
|
1650 |
|
1651 .wp-full-overlay-footer .devices button:hover, |
|
1652 .wp-full-overlay-footer .devices button:focus { |
|
1653 background-color: #fff; |
|
1654 } |
|
1655 |
|
1656 .wp-full-overlay-footer .devices button:focus, |
|
1657 .wp-full-overlay-footer .devices button.active:hover { |
|
1658 border-bottom-color: #0073aa; |
|
1659 } |
|
1660 |
|
1661 .wp-full-overlay-footer .devices button.active:before { |
|
1662 color: #191e23; |
|
1663 } |
|
1664 |
|
1665 .wp-full-overlay-footer .devices button:hover:before, |
|
1666 .wp-full-overlay-footer .devices button:focus:before { |
|
1667 color: #0073aa; |
|
1668 } |
|
1669 |
|
1670 .wp-full-overlay-footer .devices .preview-desktop:before { |
|
1671 content: "\f472"; |
|
1672 } |
|
1673 |
|
1674 .wp-full-overlay-footer .devices .preview-tablet:before { |
|
1675 content: "\f471"; |
|
1676 } |
|
1677 |
|
1678 .wp-full-overlay-footer .devices .preview-mobile:before { |
|
1679 content: "\f470"; |
|
1680 } |
|
1681 |
|
1682 @media screen and (max-width:1024px) { |
|
1683 .wp-full-overlay-footer .devices { |
|
1684 display: none; |
|
1685 } |
|
1686 } |
|
1687 |
|
1688 .collapsed .wp-full-overlay-footer .devices button:before { |
|
1689 display: none; |
|
1690 } |
|
1691 |
|
1692 .preview-mobile .wp-full-overlay-main { |
|
1693 margin: auto 0 auto -160px; |
|
1694 width: 320px; |
|
1695 height: 480px; |
|
1696 max-height: 100%; |
|
1697 max-width: 100%; |
|
1698 left: 50%; |
|
1699 } |
|
1700 |
|
1701 .preview-tablet .wp-full-overlay-main { |
|
1702 margin: auto 0 auto -360px; |
|
1703 width: 720px; /* Size is loosely based on a typical "tablet" device size. Intentionally ambiguous - this does not represent any particular device precisely. */ |
|
1704 height: 1080px; |
|
1705 max-height: 100%; |
|
1706 max-width: 100%; |
|
1707 left: 50%; |
|
1708 } |
|
1709 |
1572 |
1710 |
1573 /*------------------------------------------------------------------------------ |
1711 /*------------------------------------------------------------------------------ |
1574 24.0 - Customize Loader |
1712 24.0 - Customize Loader |
1575 ------------------------------------------------------------------------------*/ |
1713 ------------------------------------------------------------------------------*/ |
1576 |
1714 |
1581 .customize-support.wp-core-ui .hide-if-customize, |
1719 .customize-support.wp-core-ui .hide-if-customize, |
1582 .customize-support .wp-core-ui .hide-if-customize { |
1720 .customize-support .wp-core-ui .hide-if-customize { |
1583 display: none; |
1721 display: none; |
1584 } |
1722 } |
1585 |
1723 |
1586 #customize-container { |
1724 #customize-container, |
1587 display: none; |
1725 #customize-controls .notice.notification-overlay { |
1588 background: #fff; |
1726 background: #eee; |
1589 z-index: 500000; |
1727 z-index: 500000; |
1590 position: fixed; |
1728 position: fixed; |
1591 overflow: visible; |
1729 overflow: visible; |
1592 top: 0; |
1730 top: 0; |
1593 bottom: 0; |
1731 bottom: 0; |
1594 left: 0; |
1732 left: 0; |
1595 right: 0; |
1733 right: 0; |
1596 height: 100%; |
1734 height: 100%; |
1597 } |
1735 } |
1598 |
1736 #customize-container { |
1599 .customize-active #customize-container { |
1737 display: none; |
1600 display: block; |
1738 } |
|
1739 |
|
1740 /* Make the Customizer and Theme installer overlays the only available content. */ |
|
1741 #customize-container, |
|
1742 .theme-install-overlay { |
|
1743 visibility: visible; |
1601 } |
1744 } |
1602 |
1745 |
1603 .customize-loading #customize-container iframe { |
1746 .customize-loading #customize-container iframe { |
1604 opacity: 0; |
1747 opacity: 0; |
1605 } |
|
1606 |
|
1607 .customize-loading #customize-container { |
|
1608 background: #fff url(../images/spinner.gif) no-repeat fixed center center; |
|
1609 -webkit-background-size: 20px 20px; |
|
1610 background-size: 20px 20px; |
|
1611 } |
1748 } |
1612 |
1749 |
1613 #customize-container iframe, |
1750 #customize-container iframe, |
1614 .theme-install-overlay iframe { |
1751 .theme-install-overlay iframe { |
1615 height: 100%; |
1752 height: 100%; |
1616 width: 100%; |
1753 width: 100%; |
1617 z-index: 20; |
1754 z-index: 20; |
1618 -webkit-transition: opacity 0.3s; |
|
1619 transition: opacity 0.3s; |
1755 transition: opacity 0.3s; |
1620 } |
|
1621 |
|
1622 #customize-container .collapse-sidebar { |
|
1623 bottom: 16px; |
|
1624 } |
1756 } |
1625 |
1757 |
1626 #customize-controls { |
1758 #customize-controls { |
1627 margin-top: 0; |
1759 margin-top: 0; |
1628 } |
1760 } |
1704 border-top: 1px solid #ddd; |
1830 border-top: 1px solid #ddd; |
1705 border-bottom: 1px solid #ddd; |
1831 border-bottom: 1px solid #ddd; |
1706 } |
1832 } |
1707 |
1833 |
1708 .theme-install-overlay .wp-full-overlay-main { |
1834 .theme-install-overlay .wp-full-overlay-main { |
1709 background: #fff url(../images/spinner.gif) no-repeat center center; |
1835 position: absolute; |
1710 -webkit-background-size: 20px 20px; |
1836 z-index: 0; |
|
1837 background-color: #f1f1f1; |
|
1838 } |
|
1839 |
|
1840 .customize-loading #customize-container { |
|
1841 background-color: #f1f1f1; |
|
1842 } |
|
1843 |
|
1844 #customize-preview.wp-full-overlay-main:before, |
|
1845 .customize-loading #customize-container:before, |
|
1846 #customize-controls .notice.notification-overlay.notification-loading:before, |
|
1847 .theme-install-overlay .wp-full-overlay-main:before { |
|
1848 content: ""; |
|
1849 display: block; |
|
1850 width: 20px; |
|
1851 height: 20px; |
|
1852 position: absolute; |
|
1853 left: 50%; |
|
1854 top: 50%; |
|
1855 z-index: -1; |
|
1856 margin: -10px 0 0 -10px; |
|
1857 -webkit-transform: translateZ(0); |
|
1858 transform: translateZ(0); |
|
1859 background: transparent url(../images/spinner.gif) no-repeat center center; |
1711 background-size: 20px 20px; |
1860 background-size: 20px 20px; |
|
1861 } |
|
1862 |
|
1863 #customize-preview.wp-full-overlay-main.iframe-ready:before, |
|
1864 .theme-install-overlay.iframe-ready .wp-full-overlay-main:before { |
|
1865 background-image: none; |
1712 } |
1866 } |
1713 |
1867 |
1714 /* =Media Queries |
1868 /* =Media Queries |
1715 -------------------------------------------------------------- */ |
1869 -------------------------------------------------------------- */ |
1716 |
1870 |
1720 @media print, |
1874 @media print, |
1721 (-webkit-min-device-pixel-ratio: 1.25), |
1875 (-webkit-min-device-pixel-ratio: 1.25), |
1722 (min-resolution: 120dpi) { |
1876 (min-resolution: 120dpi) { |
1723 .wp-full-overlay .collapse-sidebar-arrow { |
1877 .wp-full-overlay .collapse-sidebar-arrow { |
1724 background-image: url(../images/arrows-2x.png); |
1878 background-image: url(../images/arrows-2x.png); |
1725 -webkit-background-size: 15px 123px; |
|
1726 background-size: 15px 123px; |
1879 background-size: 15px 123px; |
1727 } |
1880 } |
1728 |
1881 |
1729 #customize-preview.wp-full-overlay-main, |
1882 #customize-preview.wp-full-overlay-main:before, |
1730 .customize-loading #customize-container, |
1883 .customize-loading #customize-container:before, |
1731 .theme-install-overlay .wp-full-overlay-main { |
1884 #customize-controls .notice.notification-overlay.notification-loading:before, |
|
1885 .theme-install-overlay .wp-full-overlay-main:before { |
1732 background-image: url(../images/spinner-2x.gif); |
1886 background-image: url(../images/spinner-2x.gif); |
1733 } |
|
1734 |
|
1735 .theme-install-overlay .wp-full-overlay-header .theme-install { |
|
1736 margin-top: 2px; |
|
1737 } |
1887 } |
1738 } |
1888 } |
1739 |
1889 |
1740 @media screen and ( max-width: 782px ) { |
1890 @media screen and ( max-width: 782px ) { |
1741 .available-theme .action-links .delete-theme { |
1891 .available-theme .action-links .delete-theme { |