54 cursor: pointer; |
54 cursor: pointer; |
55 float: left; |
55 float: left; |
56 margin: 0 4% 4% 0; |
56 margin: 0 4% 4% 0; |
57 position: relative; |
57 position: relative; |
58 width: 30.6%; |
58 width: 30.6%; |
59 border: 1px solid #ddd; |
59 border: 1px solid #dcdcde; |
60 box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1); |
60 box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1); |
61 box-sizing: border-box; |
61 box-sizing: border-box; |
62 } |
62 } |
63 |
63 |
64 .theme-browser .theme:nth-child(3n) { |
64 .theme-browser .theme:nth-child(3n) { |
65 margin-right: 0; |
65 margin-right: 0; |
66 } |
66 } |
67 |
67 |
68 .theme-browser .theme:hover, |
68 .theme-browser .theme:hover, |
69 .theme-browser .theme:focus { |
69 .theme-browser .theme.focus { |
70 cursor: pointer; |
70 cursor: pointer; |
71 } |
71 } |
72 |
72 |
73 .theme-browser .theme .theme-name { |
73 .theme-browser .theme .theme-name { |
74 font-size: 15px; |
74 font-size: 15px; |
88 .theme-browser .theme .theme-actions { |
88 .theme-browser .theme .theme-actions { |
89 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; |
89 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; |
90 opacity: 0; |
90 opacity: 0; |
91 transition: opacity 0.1s ease-in-out; |
91 transition: opacity 0.1s ease-in-out; |
92 height: auto; |
92 height: auto; |
93 background: rgba(244, 244, 244, 0.7); |
93 background: rgba(246, 247, 247, 0.7); |
94 border-left: 1px solid rgba(0, 0, 0, 0.05); |
94 border-left: 1px solid rgba(0, 0, 0, 0.05); |
95 } |
95 } |
96 |
96 |
97 .theme-browser .theme:hover .theme-actions, |
97 .theme-browser .theme:hover .theme-actions, |
98 .theme-browser .theme.focus .theme-actions, |
98 .theme-browser .theme.focus .theme-actions { |
99 .theme-browser .theme:focus .theme-actions { |
|
100 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; |
99 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; |
101 opacity: 1; |
100 opacity: 1; |
102 } |
101 } |
103 |
102 |
104 .theme-browser .theme .theme-actions .button-primary { |
103 .theme-browser .theme .theme-actions .button-primary { |
138 width: 100%; |
137 width: 100%; |
139 transition: opacity 0.2s ease-in-out; |
138 transition: opacity 0.2s ease-in-out; |
140 } |
139 } |
141 |
140 |
142 .theme-browser .theme:hover .theme-screenshot, |
141 .theme-browser .theme:hover .theme-screenshot, |
143 .theme-browser .theme:focus .theme-screenshot { |
142 .theme-browser .theme.focus .theme-screenshot { |
144 background: #fff; |
143 background: #fff; |
145 } |
144 } |
146 |
145 |
147 .theme-browser.rendered .theme:hover .theme-screenshot img, |
146 .theme-browser.rendered .theme:hover .theme-screenshot img, |
148 .theme-browser.rendered .theme:focus .theme-screenshot img { |
147 .theme-browser.rendered .theme.focus .theme-screenshot img { |
149 opacity: 0.4; |
148 opacity: 0.4; |
150 } |
149 } |
151 |
150 |
152 .theme-browser .theme .more-details { |
151 .theme-browser .theme .more-details { |
153 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; |
152 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; |
154 opacity: 0; |
153 opacity: 0; |
155 position: absolute; |
154 position: absolute; |
156 top: 35%; |
155 top: 35%; |
157 right: 20%; |
156 right: 20%; |
158 left: 20%; |
157 left: 20%; |
159 background: #23282d; |
158 width: 60%; |
|
159 background: #1d2327; |
160 background: rgba(0, 0, 0, 0.7); |
160 background: rgba(0, 0, 0, 0.7); |
161 color: #fff; |
161 color: #fff; |
162 font-size: 15px; |
162 font-size: 15px; |
163 text-shadow: 0 1px 0 rgba(0, 0, 0, 0.6); |
163 text-shadow: 0 1px 0 rgba(0, 0, 0, 0.6); |
164 -webkit-font-smoothing: antialiased; |
164 -webkit-font-smoothing: antialiased; |
165 font-weight: 600; |
165 font-weight: 600; |
166 padding: 15px 12px; |
166 padding: 15px 12px; |
167 text-align: center; |
167 text-align: center; |
168 border-radius: 3px; |
168 border-radius: 3px; |
|
169 border: none; |
169 transition: opacity 0.1s ease-in-out; |
170 transition: opacity 0.1s ease-in-out; |
170 } |
171 } |
171 |
172 |
172 .theme-browser .theme:focus { |
173 .theme-browser .theme .more-details:focus { |
173 border-color: #5b9dd9; |
174 box-shadow: 0 0 0 1px #fff, 0 0 0 3px #2271b1; |
174 box-shadow: 0 0 2px rgba(30, 140, 190, 0.8); |
175 } |
175 } |
176 |
176 |
177 .theme-browser .theme.focus { |
177 .theme-browser .theme:focus .more-details { |
178 border-color: #4f94d4; |
|
179 box-shadow: 0 0 2px rgba(79, 148, 212, 0.8); |
|
180 } |
|
181 |
|
182 .theme-browser .theme.focus .more-details { |
178 opacity: 1; |
183 opacity: 1; |
179 } |
184 } |
180 |
185 |
181 /* Current theme needs to have its action always on view */ |
186 /* Current theme needs to have its action always on view */ |
182 .theme-browser .theme.active:focus .theme-actions { |
187 .theme-browser .theme.active.focus .theme-actions { |
183 display: block; |
188 display: block; |
184 } |
189 } |
185 |
190 |
186 .theme-browser.rendered .theme:hover .more-details, |
191 .theme-browser.rendered .theme:hover .more-details, |
187 .theme-browser.rendered .theme:focus .more-details { |
192 .theme-browser.rendered .theme.focus .more-details { |
188 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; |
193 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; |
189 opacity: 1; |
194 opacity: 1; |
190 } |
195 } |
191 |
196 |
192 /** |
197 /** |
193 * The currently active theme |
198 * The currently active theme |
194 */ |
199 */ |
195 .theme-browser .theme.active .theme-name { |
200 .theme-browser .theme.active .theme-name { |
196 background: #23282d; |
201 background: #1d2327; |
197 color: #fff; |
202 color: #fff; |
198 padding-right: 110px; |
203 padding-right: 110px; |
199 font-weight: 300; |
204 font-weight: 300; |
200 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5); |
205 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5); |
201 } |
206 } |
276 left: 0; |
281 left: 0; |
277 right: 0; |
282 right: 0; |
278 bottom: 0; |
283 bottom: 0; |
279 padding: 0; |
284 padding: 0; |
280 text-shadow: none; |
285 text-shadow: none; |
281 border: 5px dashed #d5d2ca; |
286 border: 5px dashed #dcdcde; |
282 border: 5px dashed rgba(0, 0, 0, 0.1); |
287 border: 5px dashed rgba(0, 0, 0, 0.1); |
283 box-sizing: border-box; |
288 box-sizing: border-box; |
284 } |
289 } |
285 |
290 |
286 .theme-browser .theme.add-new-theme span:after { |
291 .theme-browser .theme.add-new-theme span:after { |
287 background: #e5e5e5; |
292 background: #dcdcde; |
288 background: rgba(153, 153, 153, 0.1); |
293 background: rgba(140, 143, 148, 0.1); |
289 border-radius: 50%; |
294 border-radius: 50%; |
290 display: inline-block; |
295 display: inline-block; |
291 content: "\f132"; |
296 content: "\f132"; |
292 -webkit-font-smoothing: antialiased; |
297 -webkit-font-smoothing: antialiased; |
293 font: normal 74px/115px dashicons; |
298 font: normal 74px/115px dashicons; |
294 width: 100px; |
299 width: 100px; |
295 height: 100px; |
300 height: 100px; |
296 vertical-align: middle; |
301 vertical-align: middle; |
297 text-align: center; |
302 text-align: center; |
298 color: rgb(153, 153, 153); |
303 color: #8c8f94; |
299 position: absolute; |
304 position: absolute; |
300 top: 30%; |
305 top: 30%; |
301 left: 50%; |
306 left: 50%; |
302 margin-left: -50px; |
307 margin-left: -50px; |
303 text-indent: -4px; |
308 text-indent: -4px; |
316 } |
321 } |
317 |
322 |
318 .theme-browser .theme.add-new-theme a:hover span:after, |
323 .theme-browser .theme.add-new-theme a:hover span:after, |
319 .theme-browser .theme.add-new-theme a:focus span:after { |
324 .theme-browser .theme.add-new-theme a:focus span:after { |
320 background: #fff; |
325 background: #fff; |
321 color: #0073aa; |
326 color: #2271b1; |
322 } |
327 } |
323 |
328 |
324 .theme-browser .theme.add-new-theme a:hover:after, |
329 .theme-browser .theme.add-new-theme a:hover:after, |
325 .theme-browser .theme.add-new-theme a:focus:after { |
330 .theme-browser .theme.add-new-theme a:focus:after { |
326 border-color: transparent; |
331 border-color: transparent; |
327 color: #fff; |
332 color: #fff; |
328 background: #0073aa; |
333 background: #2271b1; |
329 content: ""; |
334 content: ""; |
330 } |
335 } |
331 |
336 |
332 .theme-browser .theme.add-new-theme .theme-name { |
337 .theme-browser .theme.add-new-theme .theme-name { |
333 background: none; |
338 background: none; |
380 height: 48px; |
385 height: 48px; |
381 width: 50px; |
386 width: 50px; |
382 text-align: center; |
387 text-align: center; |
383 float: right; |
388 float: right; |
384 border: 0; |
389 border: 0; |
385 border-left: 1px solid #ddd; |
390 border-left: 1px solid #dcdcde; |
386 background-color: transparent; |
391 background-color: transparent; |
387 transition: color .1s ease-in-out, background .1s ease-in-out; |
392 transition: color .1s ease-in-out, background .1s ease-in-out; |
388 } |
393 } |
389 |
394 |
390 .theme-overlay .theme-header .close:before { |
395 .theme-overlay .theme-header .close:before { |
391 font: normal 22px/50px dashicons !important; |
396 font: normal 22px/50px dashicons !important; |
392 color: #72777c; |
397 color: #787c82; |
393 display: inline-block; |
398 display: inline-block; |
394 content: "\f335"; |
399 content: "\f335"; |
395 font-weight: 300; |
400 font-weight: 300; |
396 } |
401 } |
397 |
402 |
398 /* Left and right navigation */ |
403 /* Left and right navigation */ |
399 .theme-overlay .theme-header .right, |
404 .theme-overlay .theme-header .right, |
400 .theme-overlay .theme-header .left { |
405 .theme-overlay .theme-header .left { |
401 cursor: pointer; |
406 cursor: pointer; |
402 color: #72777c; |
407 color: #787c82; |
403 background-color: transparent; |
408 background-color: transparent; |
404 height: 48px; |
409 height: 48px; |
405 width: 54px; |
410 width: 54px; |
406 float: left; |
411 float: left; |
407 text-align: center; |
412 text-align: center; |
408 border: 0; |
413 border: 0; |
409 border-right: 1px solid #ddd; |
414 border-right: 1px solid #dcdcde; |
410 transition: color .1s ease-in-out, background .1s ease-in-out; |
415 transition: color .1s ease-in-out, background .1s ease-in-out; |
411 } |
416 } |
412 |
417 |
413 .theme-overlay .theme-header .close:focus, |
418 .theme-overlay .theme-header .close:focus, |
414 .theme-overlay .theme-header .close:hover, |
419 .theme-overlay .theme-header .close:hover, |
415 .theme-overlay .theme-header .right:focus, |
420 .theme-overlay .theme-header .right:focus, |
416 .theme-overlay .theme-header .right:hover, |
421 .theme-overlay .theme-header .right:hover, |
417 .theme-overlay .theme-header .left:focus, |
422 .theme-overlay .theme-header .left:focus, |
418 .theme-overlay .theme-header .left:hover { |
423 .theme-overlay .theme-header .left:hover { |
419 background: #ddd; |
424 background: #dcdcde; |
420 border-color: #ccc; |
425 border-color: #c3c4c7; |
421 color: #000; |
426 color: #000; |
422 } |
427 } |
423 |
428 |
424 .theme-overlay .theme-header .close:focus:before, |
429 .theme-overlay .theme-header .close:focus:before, |
425 .theme-overlay .theme-header .close:hover:before { |
430 .theme-overlay .theme-header .close:hover:before { |
435 |
440 |
436 .theme-overlay .theme-header .left.disabled, |
441 .theme-overlay .theme-header .left.disabled, |
437 .theme-overlay .theme-header .right.disabled, |
442 .theme-overlay .theme-header .right.disabled, |
438 .theme-overlay .theme-header .left.disabled:hover, |
443 .theme-overlay .theme-header .left.disabled:hover, |
439 .theme-overlay .theme-header .right.disabled:hover { |
444 .theme-overlay .theme-header .right.disabled:hover { |
440 color: #ccc; |
445 color: #c3c4c7; |
441 background: inherit; |
446 background: inherit; |
442 cursor: inherit; |
447 cursor: inherit; |
443 } |
448 } |
444 |
449 |
445 .theme-overlay .theme-header .right:before, |
450 .theme-overlay .theme-header .right:before, |
526 |
531 |
527 .broken-themes a.delete-theme:hover, |
532 .broken-themes a.delete-theme:hover, |
528 .broken-themes a.delete-theme:focus, |
533 .broken-themes a.delete-theme:focus, |
529 .theme-overlay .theme-actions .delete-theme:hover, |
534 .theme-overlay .theme-actions .delete-theme:hover, |
530 .theme-overlay .theme-actions .delete-theme:focus { |
535 .theme-overlay .theme-actions .delete-theme:focus { |
531 background: #d54e21; |
536 background: #d63638; |
532 color: #fff; |
537 color: #fff; |
533 border-color: #d54e21; |
538 border-color: #d63638; |
534 } |
539 } |
535 |
540 |
536 .theme-overlay .theme-actions .active-theme, |
541 .theme-overlay .theme-actions .active-theme, |
537 .theme-overlay.active .theme-actions .inactive-theme { |
542 .theme-overlay.active .theme-actions .inactive-theme { |
538 display: none; |
543 display: none; |
636 width: 40%; |
641 width: 40%; |
637 float: left; |
642 float: left; |
638 } |
643 } |
639 |
644 |
640 .theme-overlay .current-label { |
645 .theme-overlay .current-label { |
641 background: #32373c; |
646 background: #2c3338; |
642 color: #fff; |
647 color: #fff; |
643 font-size: 11px; |
648 font-size: 11px; |
644 display: inline-block; |
649 display: inline-block; |
645 padding: 2px 8px; |
650 padding: 2px 8px; |
646 border-radius: 2px; |
651 border-radius: 2px; |
647 margin: 0 0 -10px; |
652 margin: 0 0 -10px; |
648 -webkit-user-select: none; |
653 -webkit-user-select: none; |
649 -moz-user-select: none; |
|
650 -ms-user-select: none; |
|
651 user-select: none; |
654 user-select: none; |
652 } |
655 } |
653 |
656 |
654 .theme-overlay .theme-name { |
657 .theme-overlay .theme-name { |
655 color: #23282d; |
658 color: #1d2327; |
656 font-size: 32px; |
659 font-size: 32px; |
657 font-weight: 100; |
660 font-weight: 100; |
658 margin: 10px 0 0; |
661 margin: 10px 0 0; |
659 line-height: 1.3; |
662 line-height: 1.3; |
660 word-wrap: break-word; |
663 word-wrap: break-word; |
661 overflow-wrap: break-word; |
664 overflow-wrap: break-word; |
662 } |
665 } |
663 |
666 |
664 .theme-overlay .theme-version { |
667 .theme-overlay .theme-version { |
665 color: #72777c; |
668 color: #646970; |
666 font-size: 13px; |
669 font-size: 13px; |
667 font-weight: 400; |
670 font-weight: 400; |
668 float: none; |
671 float: none; |
669 display: inline-block; |
672 display: inline-block; |
670 margin-left: 10px; |
673 margin-left: 10px; |
671 } |
674 } |
672 |
675 |
673 .theme-overlay .theme-author { |
676 .theme-overlay .theme-author { |
674 margin: 15px 0 25px; |
677 margin: 15px 0 25px; |
675 color: #72777c; |
678 color: #646970; |
676 font-size: 16px; |
679 font-size: 16px; |
677 font-weight: 400; |
680 font-weight: 400; |
678 line-height: inherit; |
681 line-height: inherit; |
679 } |
682 } |
680 |
683 |
694 .theme-overlay .theme-autoupdate .toggle-auto-update .label { |
697 .theme-overlay .theme-autoupdate .toggle-auto-update .label { |
695 text-decoration: underline; |
698 text-decoration: underline; |
696 } |
699 } |
697 |
700 |
698 .theme-overlay .theme-description { |
701 .theme-overlay .theme-description { |
699 color: #555; |
702 color: #50575e; |
700 font-size: 15px; |
703 font-size: 15px; |
701 font-weight: 400; |
704 font-weight: 400; |
702 line-height: 1.5; |
705 line-height: 1.5; |
703 margin: 30px 0 0 0; |
706 margin: 30px 0 0 0; |
704 } |
707 } |
705 |
708 |
706 .theme-overlay .theme-tags { |
709 .theme-overlay .theme-tags { |
707 border-top: 3px solid #eee; |
710 border-top: 3px solid #f0f0f1; |
708 color: #82878c; |
711 color: #646970; |
709 font-size: 13px; |
712 font-size: 13px; |
710 font-weight: 400; |
713 font-weight: 400; |
711 margin: 30px 0 0 0; |
714 margin: 30px 0 0 0; |
712 padding-top: 20px; |
715 padding-top: 20px; |
713 } |
716 } |
714 |
717 |
715 .theme-overlay .theme-tags span { |
718 .theme-overlay .theme-tags span { |
716 color: #444; |
719 color: #3c434a; |
717 font-weight: 600; |
720 font-weight: 600; |
718 margin-right: 5px; |
721 margin-right: 5px; |
719 } |
722 } |
720 |
723 |
721 .theme-overlay .parent-theme { |
724 .theme-overlay .parent-theme { |
722 background: #f7fcfe; |
725 background: #fff; |
723 border: 1px solid #eee; |
726 border: 1px solid #f0f0f1; |
724 border-left: 4px solid #00a0d2; |
727 border-left: 4px solid #72aee6; |
725 font-size: 14px; |
728 font-size: 14px; |
726 font-weight: 400; |
729 font-weight: 400; |
727 margin-top: 30px; |
730 margin-top: 30px; |
728 padding: 10px 10px 10px 20px; |
731 padding: 10px 10px 10px 20px; |
729 } |
732 } |
877 } |
880 } |
878 |
881 |
879 .theme:not(.active):hover .theme-actions, |
882 .theme:not(.active):hover .theme-actions, |
880 .theme:not(.active):focus .theme-actions, |
883 .theme:not(.active):focus .theme-actions, |
881 .theme:hover .more-details, |
884 .theme:hover .more-details, |
882 .theme:focus .more-details { |
885 .theme.focus .more-details { |
883 display: none; |
886 display: none; |
884 } |
887 } |
885 |
888 |
886 .theme-browser.rendered .theme:hover .theme-screenshot img, |
889 .theme-browser.rendered .theme:hover .theme-screenshot img, |
887 .theme-browser.rendered .theme:focus .theme-screenshot img { |
890 .theme-browser.rendered .theme.focus .theme-screenshot img { |
888 opacity: 1.0; |
891 opacity: 1.0; |
889 } |
892 } |
890 } |
893 } |
891 |
894 |
892 @media only screen and (max-width: 480px) { |
895 @media only screen and (max-width: 480px) { |
999 max-width: 40rem; |
1002 max-width: 40rem; |
1000 } |
1003 } |
1001 |
1004 |
1002 /* Already installed theme */ |
1005 /* Already installed theme */ |
1003 .theme-browser .theme .theme-installed { |
1006 .theme-browser .theme .theme-installed { |
1004 background: #0073aa; |
1007 background: #2271b1; |
1005 } |
1008 } |
1006 |
1009 |
1007 .theme-browser .theme .notice-success p:before { |
1010 .theme-browser .theme .notice-success p:before { |
1008 color: #79ba49; |
1011 color: #68de7c; |
1009 content: "\f147"; |
1012 content: "\f147"; |
1010 display: inline-block; |
1013 display: inline-block; |
1011 font: normal 20px/1 'dashicons'; |
1014 font: normal 20px/1 'dashicons'; |
1012 -webkit-font-smoothing: antialiased; |
1015 -webkit-font-smoothing: antialiased; |
1013 -moz-osx-font-smoothing: grayscale; |
1016 -moz-osx-font-smoothing: grayscale; |
1056 display: block; |
1059 display: block; |
1057 } |
1060 } |
1058 |
1061 |
1059 .upload-theme .wp-upload-form, |
1062 .upload-theme .wp-upload-form, |
1060 .upload-plugin .wp-upload-form { |
1063 .upload-plugin .wp-upload-form { |
1061 background: #fafafa; |
1064 background: #f6f7f7; |
1062 border: 1px solid #ccd0d4; |
1065 border: 1px solid #c3c4c7; |
1063 padding: 30px; |
1066 padding: 30px; |
1064 margin: 30px auto; |
1067 margin: 30px auto; |
1065 display: inline-flex; |
1068 display: inline-flex; |
1066 justify-content: space-between; |
1069 justify-content: space-between; |
1067 align-items: center; |
1070 align-items: center; |
1122 } |
1125 } |
1123 |
1126 |
1124 .theme-details .num-ratings, |
1127 .theme-details .num-ratings, |
1125 .theme-details .no-rating { |
1128 .theme-details .no-rating { |
1126 font-size: 11px; |
1129 font-size: 11px; |
1127 color: #72777c; |
1130 color: #646970; |
1128 } |
1131 } |
1129 |
1132 |
1130 .theme-details .no-rating { |
1133 .theme-details .no-rating { |
1131 display: block; |
1134 display: block; |
1132 line-height: 1.9; |
1135 line-height: 1.9; |
1133 } |
1136 } |
1134 |
1137 |
1135 .update-from-upload-comparison { |
1138 .update-from-upload-comparison { |
1136 border-top: 1px solid #ddd; |
1139 border-top: 1px solid #dcdcde; |
1137 border-bottom: 1px solid #ddd; |
1140 border-bottom: 1px solid #dcdcde; |
1138 text-align: left; |
1141 text-align: left; |
1139 margin: 1rem 0 1.4rem; |
1142 margin: 1rem 0 1.4rem; |
1140 border-collapse: collapse; |
1143 border-collapse: collapse; |
1141 width: 100%; |
1144 width: 100%; |
1142 } |
1145 } |
1208 16.4 - Custom Background Screen |
1211 16.4 - Custom Background Screen |
1209 ------------------------------------------------------------------------------*/ |
1212 ------------------------------------------------------------------------------*/ |
1210 |
1213 |
1211 div#custom-background-image { |
1214 div#custom-background-image { |
1212 min-height: 100px; |
1215 min-height: 100px; |
1213 border: 1px solid #ddd; |
1216 border: 1px solid #dcdcde; |
1214 } |
1217 } |
1215 |
1218 |
1216 div#custom-background-image img { |
1219 div#custom-background-image img { |
1217 max-width: 400px; |
1220 max-width: 400px; |
1218 max-height: 300px; |
1221 max-height: 300px; |
1219 } |
1222 } |
1220 |
1223 |
1221 .background-position-control input[type="radio"]:checked ~ .button { |
1224 .background-position-control input[type="radio"]:checked ~ .button { |
1222 background: #eee; |
1225 background: #f0f0f1; |
1223 border-color: #999; |
1226 border-color: #8c8f94; |
1224 box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5); |
1227 box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5); |
1225 z-index: 1; |
1228 z-index: 1; |
1226 } |
1229 } |
1227 |
1230 |
1228 .background-position-control input[type="radio"]:focus ~ .button { |
1231 .background-position-control input[type="radio"]:focus ~ .button { |
1229 border-color: #5b9dd9; |
1232 border-color: #4f94d4; |
1230 box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5), 0 0 3px rgba(0, 115, 170, 0.8); |
1233 box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5), 0 0 3px rgba(34, 113, 177, 0.8); |
1231 color: #23282d; |
1234 color: #1d2327; |
1232 } |
1235 } |
1233 |
1236 |
1234 .background-position-control .background-position-center-icon, |
1237 .background-position-control .background-position-center-icon, |
1235 .background-position-control .background-position-center-icon:before { |
1238 .background-position-control .background-position-center-icon:before { |
1236 display: inline-block; |
1239 display: inline-block; |
1245 vertical-align: top; |
1248 vertical-align: top; |
1246 width: 20px; |
1249 width: 20px; |
1247 } |
1250 } |
1248 |
1251 |
1249 .background-position-control .background-position-center-icon:before { |
1252 .background-position-control .background-position-center-icon:before { |
1250 background-color: #555; |
1253 background-color: #50575e; |
1251 border-radius: 50%; |
1254 border-radius: 50%; |
1252 content: ""; |
1255 content: ""; |
1253 height: 12px; |
1256 height: 12px; |
1254 width: 12px; |
1257 width: 12px; |
1255 } |
1258 } |
1256 |
1259 |
1257 .background-position-control .button:hover .background-position-center-icon:before, |
1260 .background-position-control .button:hover .background-position-center-icon:before, |
1258 .background-position-control input[type="radio"]:focus ~ .button .background-position-center-icon:before { |
1261 .background-position-control input[type="radio"]:focus ~ .button .background-position-center-icon:before { |
1259 background-color: #23282d; |
1262 background-color: #1d2327; |
1260 } |
1263 } |
1261 |
1264 |
1262 .background-position-control .button-group { |
1265 .background-position-control .button-group { |
1263 display: block; |
1266 display: block; |
1264 } |
1267 } |
1483 .theme-install-overlay .close-full-overlay:focus, |
1486 .theme-install-overlay .close-full-overlay:focus, |
1484 .theme-install-overlay .previous-theme:hover, |
1487 .theme-install-overlay .previous-theme:hover, |
1485 .theme-install-overlay .previous-theme:focus, |
1488 .theme-install-overlay .previous-theme:focus, |
1486 .theme-install-overlay .next-theme:hover, |
1489 .theme-install-overlay .next-theme:hover, |
1487 .theme-install-overlay .next-theme:focus { |
1490 .theme-install-overlay .next-theme:focus { |
1488 background: #ddd; |
1491 background: #dcdcde; |
1489 border-color: #ccc; |
1492 border-color: #c3c4c7; |
1490 color: #000; |
1493 color: #000; |
1491 outline: none; |
1494 outline: none; |
1492 box-shadow: none; |
1495 box-shadow: none; |
1493 } |
1496 } |
1494 |
1497 |
1520 .theme-install-overlay .next-theme.disabled, |
1523 .theme-install-overlay .next-theme.disabled, |
1521 .theme-install-overlay .previous-theme.disabled:hover, |
1524 .theme-install-overlay .previous-theme.disabled:hover, |
1522 .theme-install-overlay .previous-theme.disabled:focus, |
1525 .theme-install-overlay .previous-theme.disabled:focus, |
1523 .theme-install-overlay .next-theme.disabled:hover, |
1526 .theme-install-overlay .next-theme.disabled:hover, |
1524 .theme-install-overlay .next-theme.disabled:focus { |
1527 .theme-install-overlay .next-theme.disabled:focus { |
1525 color: #b4b9be; |
1528 color: #c3c4c7; |
1526 background: #eee; |
1529 background: #f0f0f1; |
1527 cursor: default; |
1530 cursor: default; |
1528 pointer-events: none; |
1531 pointer-events: none; |
1529 } |
1532 } |
1530 |
1533 |
1531 .theme-install-overlay .close-full-overlay, |
1534 .theme-install-overlay .close-full-overlay, |
1548 position: fixed; |
1551 position: fixed; |
1549 bottom: 0; |
1552 bottom: 0; |
1550 left: 0; |
1553 left: 0; |
1551 padding: 9px 0 9px 10px; |
1554 padding: 9px 0 9px 10px; |
1552 height: 45px; |
1555 height: 45px; |
1553 color: #656a6f; |
1556 color: #646970; |
1554 outline: 0; |
1557 outline: 0; |
1555 line-height: 1; |
1558 line-height: 1; |
1556 background-color: transparent !important; |
1559 background-color: transparent !important; |
1557 border: none !important; |
1560 border: none !important; |
1558 box-shadow: none !important; |
1561 box-shadow: none !important; |
1559 border-radius: 0 !important; |
1562 border-radius: 0 !important; |
1560 } |
1563 } |
1561 |
1564 |
1562 .wp-core-ui .wp-full-overlay .collapse-sidebar:hover, |
1565 .wp-core-ui .wp-full-overlay .collapse-sidebar:hover, |
1563 .wp-core-ui .wp-full-overlay .collapse-sidebar:focus { |
1566 .wp-core-ui .wp-full-overlay .collapse-sidebar:focus { |
1564 color: #0073aa; |
1567 color: #2271b1; |
1565 } |
1568 } |
1566 |
1569 |
1567 .wp-full-overlay .collapse-sidebar-arrow, |
1570 .wp-full-overlay .collapse-sidebar-arrow, |
1568 .wp-full-overlay .collapse-sidebar-label { |
1571 .wp-full-overlay .collapse-sidebar-label { |
1569 display: inline-block; |
1572 display: inline-block; |
1645 min-width: 299px; |
1648 min-width: 299px; |
1646 max-width: 599px; |
1649 max-width: 599px; |
1647 width: 18%; |
1650 width: 18%; |
1648 width: calc( 18% - 1px ); |
1651 width: calc( 18% - 1px ); |
1649 height: 45px; |
1652 height: 45px; |
1650 border-top: 1px solid #ddd; |
1653 border-top: 1px solid #dcdcde; |
1651 background: #eee; |
1654 background: #f0f0f1; |
1652 } |
1655 } |
1653 |
1656 |
1654 .wp-full-overlay-footer .devices-wrapper { |
1657 .wp-full-overlay-footer .devices-wrapper { |
1655 float: right; |
1658 float: right; |
1656 } |
1659 } |
1657 |
1660 |
1658 .wp-full-overlay-footer .devices { |
1661 .wp-full-overlay-footer .devices { |
1659 position: relative; |
1662 position: relative; |
1660 background: #eee; |
1663 background: #f0f0f1; |
1661 box-shadow: -20px 0 10px -5px #eee; |
1664 box-shadow: -20px 0 10px -5px #f0f0f1; |
1662 } |
1665 } |
1663 |
1666 |
1664 .wp-full-overlay-footer .devices button { |
1667 .wp-full-overlay-footer .devices button { |
1665 cursor: pointer; |
1668 cursor: pointer; |
1666 background: transparent; |
1669 background: transparent; |
1687 -webkit-font-smoothing: antialiased; |
1690 -webkit-font-smoothing: antialiased; |
1688 font: normal 20px/30px "dashicons"; |
1691 font: normal 20px/30px "dashicons"; |
1689 vertical-align: top; |
1692 vertical-align: top; |
1690 margin: 3px 0; |
1693 margin: 3px 0; |
1691 padding: 4px 8px; |
1694 padding: 4px 8px; |
1692 color: #656a6f; |
1695 color: #646970; |
1693 } |
1696 } |
1694 |
1697 |
1695 .wp-full-overlay-footer .devices button.active { |
1698 .wp-full-overlay-footer .devices button.active { |
1696 border-bottom-color: #191e23; |
1699 border-bottom-color: #1d2327; |
1697 } |
1700 } |
1698 |
1701 |
1699 .wp-full-overlay-footer .devices button:hover, |
1702 .wp-full-overlay-footer .devices button:hover, |
1700 .wp-full-overlay-footer .devices button:focus { |
1703 .wp-full-overlay-footer .devices button:focus { |
1701 background-color: #fff; |
1704 background-color: #fff; |
1702 } |
1705 } |
1703 |
1706 |
1704 .wp-full-overlay-footer .devices button:focus, |
1707 .wp-full-overlay-footer .devices button:focus, |
1705 .wp-full-overlay-footer .devices button.active:hover { |
1708 .wp-full-overlay-footer .devices button.active:hover { |
1706 border-bottom-color: #0073aa; |
1709 border-bottom-color: #2271b1; |
1707 } |
1710 } |
1708 |
1711 |
1709 .wp-full-overlay-footer .devices button.active:before { |
1712 .wp-full-overlay-footer .devices button.active:before { |
1710 color: #191e23; |
1713 color: #1d2327; |
1711 } |
1714 } |
1712 |
1715 |
1713 .wp-full-overlay-footer .devices button:hover:before, |
1716 .wp-full-overlay-footer .devices button:hover:before, |
1714 .wp-full-overlay-footer .devices button:focus:before { |
1717 .wp-full-overlay-footer .devices button:focus:before { |
1715 color: #0073aa; |
1718 color: #2271b1; |
1716 } |
1719 } |
1717 |
1720 |
1718 .wp-full-overlay-footer .devices .preview-desktop:before { |
1721 .wp-full-overlay-footer .devices .preview-desktop:before { |
1719 content: "\f472"; |
1722 content: "\f472"; |
1720 } |
1723 } |
1854 margin: 15px 0; |
1857 margin: 15px 0; |
1855 } |
1858 } |
1856 |
1859 |
1857 .theme-details .theme-description { |
1860 .theme-details .theme-description { |
1858 float: left; |
1861 float: left; |
1859 color: #72777c; |
1862 color: #646970; |
1860 line-height: 1.6; |
1863 line-height: 1.6; |
1861 max-width: 100%; |
1864 max-width: 100%; |
1862 } |
1865 } |
1863 |
1866 |
1864 .theme-install-overlay .wp-full-overlay-header .button { |
1867 .theme-install-overlay .wp-full-overlay-header .button { |
1865 float: right; |
1868 float: right; |
1866 margin: 8px 10px 0 0; |
1869 margin: 8px 10px 0 0; |
1867 } |
1870 } |
1868 |
1871 |
1869 .theme-install-overlay .wp-full-overlay-sidebar { |
1872 .theme-install-overlay .wp-full-overlay-sidebar { |
1870 background: #eee; |
1873 background: #f0f0f1; |
1871 border-right: 1px solid #ddd; |
1874 border-right: 1px solid #dcdcde; |
1872 } |
1875 } |
1873 |
1876 |
1874 .theme-install-overlay .wp-full-overlay-sidebar-content { |
1877 .theme-install-overlay .wp-full-overlay-sidebar-content { |
1875 background: #fff; |
1878 background: #fff; |
1876 border-top: 1px solid #ddd; |
1879 border-top: 1px solid #dcdcde; |
1877 border-bottom: 1px solid #ddd; |
1880 border-bottom: 1px solid #dcdcde; |
1878 } |
1881 } |
1879 |
1882 |
1880 .theme-install-overlay .wp-full-overlay-main { |
1883 .theme-install-overlay .wp-full-overlay-main { |
1881 position: absolute; |
1884 position: absolute; |
1882 z-index: 0; |
1885 z-index: 0; |
1883 background-color: #f1f1f1; |
1886 background-color: #f0f0f1; |
1884 } |
1887 } |
1885 |
1888 |
1886 .customize-loading #customize-container { |
1889 .customize-loading #customize-container { |
1887 background-color: #f1f1f1; |
1890 background-color: #f0f0f1; |
1888 } |
1891 } |
1889 |
1892 |
1890 #customize-preview.wp-full-overlay-main:before, |
1893 #customize-preview.wp-full-overlay-main:before, |
1891 .customize-loading #customize-container:before, |
1894 .customize-loading #customize-container:before, |
1892 #customize-controls .notice.notification-overlay.notification-loading:before, |
1895 #customize-controls .notice.notification-overlay.notification-loading:before, |