1 /*------------------------------------------------------------------------------
3 ------------------------------------------------------------------------------*/
6 /*------------------------------------------------------------------------------
8 ------------------------------------------------------------------------------*/
10 .theme-browser .themes {
15 .themes-php .wrap h1 {
20 .network-admin.themes-php .wrap h1 {
24 .themes-php .wrap h1 .button {
29 .themes-php .wp-filter-search {
40 /* Position admin messages */
41 .themes-php div.updated,
42 .themes-php div.error,
43 .themes-php div.notice {
48 .themes-php div.updated a {
49 text-decoration: underline;
54 * (has flexible margins)
56 .theme-browser .theme {
62 border: 1px solid #dedede;
63 -webkit-box-shadow: 0 1px 1px -1px rgba(0,0,0,0.1);
64 box-shadow: 0 1px 1px -1px rgba(0,0,0,0.1);
65 -webkit-box-sizing: border-box;
66 -moz-box-sizing: border-box;
67 box-sizing: border-box;
70 .ie8 .theme-browser .theme {
75 .theme-browser .theme:nth-child(3n) {
79 .theme-browser .theme:hover,
80 .theme-browser .theme:focus {
84 .theme-browser .theme .theme-name {
90 -webkit-box-shadow: inset 0 1px 0 rgba(0,0,0,0.1);
91 box-shadow: inset 0 1px 0 rgba(0,0,0,0.1);
94 text-overflow: ellipsis;
96 background: rgba(255,255,255,0.65);
99 /* Activate and Customize buttons, shown on hover and focus */
100 .theme-browser .theme .theme-actions {
101 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
103 -webkit-transition: opacity 0.1s ease-in-out;
104 transition: opacity 0.1s ease-in-out;
109 padding: 9px 10px 0 10px;
110 background: rgba(244, 244, 244, 0.7);
111 border-left: 1px solid rgba(0,0,0,0.05);
114 .theme-browser .theme:hover .theme-actions,
115 .theme-browser .theme.focus .theme-actions,
116 .theme-browser .theme:focus .theme-actions {
117 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
121 .theme-browser .theme .theme-actions .button-primary {
125 .theme-browser .theme .theme-actions .button-secondary {
133 * Has a fixed aspect ratio of 1.5 to 1 regardless of screenshot size
134 * It is also responsive.
136 .theme-browser .theme .theme-screenshot {
140 -webkit-transition: opacity 0.2s ease-in-out;
141 transition: opacity 0.2s ease-in-out;
144 .theme-browser .theme .theme-screenshot:after {
147 padding-top: 66.66666%; /* using a 3/2 aspect ratio */
150 .theme-browser .theme .theme-screenshot img {
156 -webkit-transition: opacity 0.2s ease-in-out;
157 transition: opacity 0.2s ease-in-out;
160 .theme-browser .theme:hover .theme-screenshot,
161 .theme-browser .theme:focus .theme-screenshot {
165 .theme-browser.rendered .theme:hover .theme-screenshot img,
166 .theme-browser.rendered .theme:focus .theme-screenshot img {
170 .theme-browser .theme .more-details {
171 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
178 background: rgba(0,0,0,0.7);
181 text-shadow: 0 1px 0 rgba(0,0,0,0.6);
182 -webkit-font-smoothing: antialiased;
186 -webkit-border-radius: 3px;
188 -webkit-transition: opacity 0.1s ease-in-out;
189 transition: opacity 0.1s ease-in-out;
192 .theme-browser .theme:focus {
193 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 );
198 .theme-browser .theme:focus .more-details {
202 /* Current theme needs to have its action always on view */
203 .theme-browser .theme.active:focus .theme-actions {
207 .theme-browser.rendered .theme:hover .more-details,
208 .theme-browser.rendered .theme:focus .more-details {
209 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
214 * Displays a theme update notice
215 * when an update is available.
217 .theme-browser .theme .theme-update,
218 .theme-browser .theme .theme-installed {
220 background: rgba(213, 78, 33, 0.95);
232 border-bottom: 1px solid rgba(0,0,0,0.25);
236 .theme-browser .theme .theme-update:before,
237 .theme-browser .theme .theme-installed:before {
239 display: inline-block;
240 font: normal 20px/1 'dashicons';
246 -webkit-font-smoothing: antialiased;
251 * The currently active theme
253 .theme-browser .theme.active .theme-name {
256 padding-right: 110px;
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);
262 .theme-browser .customize-control .theme.active .theme-name {
266 .theme-browser .theme.active .theme-name span {
270 .theme-browser .theme.active .theme-actions {
271 background: rgba(49,49,49,0.7);
276 .theme-browser .theme.active .theme-actions .button-primary {
280 .theme-browser .theme .theme-author {
291 .theme-browser .theme.display-author .theme-author {
295 .theme-browser .theme.display-author .theme-author a {
297 text-decoration: none;
303 .theme-browser .theme.add-new-theme {
305 -webkit-box-shadow: none;
309 .theme-browser .theme.add-new-theme a {
311 text-decoration: none;
317 .theme-browser .theme.add-new-theme a:after {
320 background: transparent;
321 background: rgba(0, 0, 0, 0);
329 border: 5px dashed #d5d2ca;
330 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;
336 .theme-browser .theme.add-new-theme span:after {
338 background: rgba(153, 153, 153, 0.1);
339 -webkit-border-radius: 50%;
341 display: inline-block;
343 -webkit-font-smoothing: antialiased;
344 font: normal 74px/115px 'dashicons';
347 vertical-align: middle;
349 color: rgb(153, 153, 153);
360 .rtl .theme-browser .theme.add-new-theme span:after {
364 .theme-browser .theme.add-new-theme a:hover .theme-screenshot,
365 .theme-browser .theme.add-new-theme a:focus .theme-screenshot {
369 .theme-browser .theme.add-new-theme a:hover span:after,
370 .theme-browser .theme.add-new-theme a:focus span:after {
375 .theme-browser .theme.add-new-theme a:hover:after,
376 .theme-browser .theme.add-new-theme a:focus:after {
377 border-color: transparent;
383 .theme-browser .theme.add-new-theme .theme-name {
386 -webkit-box-shadow: none;
393 padding-bottom: 48px;
396 .theme-browser .theme.add-new-theme a:hover .theme-name,
397 .theme-browser .theme.add-new-theme a:focus .theme-name {
404 * Shown when clicking a theme
406 .theme-overlay .theme-backdrop {
413 background: rgba( 238, 238, 238, 0.9 );
414 z-index: 10000; /* Over WP Pointers. */
417 .theme-overlay .theme-header {
423 border-bottom: 1px solid #ddd;
426 .theme-overlay .theme-header button {
430 .theme-overlay .theme-header .close {
437 border-left: 1px solid #ddd;
438 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;
443 .theme-overlay .theme-header .close:before {
444 font: normal 22px/50px 'dashicons' !important;
446 display: inline-block;
451 /* Left and right navigation */
452 .theme-overlay .theme-header .right,
453 .theme-overlay .theme-header .left {
456 background-color: transparent;
462 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;
467 .theme-overlay .theme-header .close:focus,
468 .theme-overlay .theme-header .close:hover,
469 .theme-overlay .theme-header .right:focus,
470 .theme-overlay .theme-header .right:hover,
471 .theme-overlay .theme-header .left:focus,
472 .theme-overlay .theme-header .left:hover {
478 .theme-overlay .theme-header .close:focus:before,
479 .theme-overlay .theme-header .close:hover:before {
483 .theme-overlay .theme-header .close:focus,
484 .theme-overlay .theme-header .right:focus,
485 .theme-overlay .theme-header .left:focus {
486 -webkit-box-shadow: none;
491 .theme-overlay .theme-header .left.disabled,
492 .theme-overlay .theme-header .right.disabled,
493 .theme-overlay .theme-header .left.disabled:hover,
494 .theme-overlay .theme-header .right.disabled:hover {
500 .theme-overlay .theme-header .right:before,
501 .theme-overlay .theme-header .left:before {
502 font: normal 20px/50px 'dashicons' !important;
507 .theme-overlay .theme-header .left:before {
511 .theme-overlay .theme-header .right:before {
515 .theme-overlay .theme-wrap {
523 -webkit-box-shadow: 0 1px 20px 5px rgba(0, 0, 0, 0.1);
524 box-shadow: 0 1px 20px 5px rgba(0, 0, 0, 0.1);
525 z-index: 10000; /* Over WP Pointers. */
526 -webkit-box-sizing: border-box;
527 -moz-box-sizing: border-box;
528 box-sizing: border-box;
529 -webkit-overflow-scrolling: touch;
532 .theme-overlay .theme-wrap:after {
540 body.folded .theme-overlay .theme-wrap {
544 .theme-overlay .theme-about {
553 .theme-overlay .theme-about:after {
561 .theme-overlay .theme-actions {
567 padding: 10px 25px 5px;
570 -webkit-box-sizing: border-box;
571 -moz-box-sizing: border-box;
572 box-sizing: border-box;
573 border-top: 1px solid #eee;
576 .ie8 .theme-overlay .theme-actions {
577 border: 1px solid #eee;
580 .theme-overlay .theme-actions a {
585 /* Hide-if-customize for items we can't add classes to */
586 .customize-support .theme-overlay .theme-actions a[href="themes.php?page=custom-header"],
587 .customize-support .theme-overlay .theme-actions a[href="themes.php?page=custom-background"] {
591 .broken-themes a.delete-theme,
592 .theme-overlay .theme-actions .delete-theme {
594 text-decoration: none;
595 border-color: transparent;
596 -webkit-box-shadow: none;
598 background: transparent;
601 .theme-overlay .theme-actions .delete-theme {
607 .broken-themes a.delete-theme:hover,
608 .broken-themes a.delete-theme:focus,
609 .theme-overlay .theme-actions .delete-theme:hover,
610 .theme-overlay .theme-actions .delete-theme:focus {
613 border-color: #d54e21;
616 .theme-overlay .theme-actions .active-theme,
617 .theme-overlay.active .theme-actions .inactive-theme {
621 .theme-overlay .theme-actions .inactive-theme,
622 .theme-overlay.active .theme-actions .active-theme {
627 * Theme Screenshots gallery
629 .theme-overlay .theme-screenshots {
637 /* First screenshot, shown big */
638 .theme-overlay .screenshot {
639 border: 1px solid #fff;
640 -webkit-box-sizing: border-box;
641 -moz-box-sizing: border-box;
642 box-sizing: border-box;
645 -webkit-box-shadow: 0 0 0 1px rgba(0,0,0,0.2);
646 box-shadow: 0 0 0 1px rgba(0,0,0,0.2);
649 .theme-overlay .screenshot:after {
652 padding-top: 75%; /* using a 4/3 aspect ratio */
655 .theme-overlay .screenshot img {
662 /* Handles old 300px screenshots */
663 .theme-overlay.small-screenshot .theme-screenshots {
667 .theme-overlay.small-screenshot .theme-info {
672 /* Other screenshots, shown small and square */
673 .theme-overlay .screenshot.thumb {
675 border: 1px solid #eee;
677 display: inline-block;
684 .theme-overlay .screenshot.thumb:after {
687 padding-top: 100%; /* using a 1/1 aspect ratio */
690 .theme-overlay .screenshot.thumb img {
700 .theme-overlay .screenshot.selected {
701 background: transparent;
702 border: 2px solid #00a0d2;
705 .theme-overlay .screenshot.selected img {
709 /* No screenshot placeholder */
710 .theme-browser .theme .theme-screenshot.blank,
711 .theme-overlay .screenshot.blank {
712 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYGWO8d+/efwYkoKioiMRjYGBC4WHhUK6A8T8QIJt8//59ZC493AAAQssKpBK4F5AAAAAASUVORK5CYII=);
716 * Theme heading information
718 .theme-overlay .theme-info {
723 .theme-overlay .current-label {
727 display: inline-block;
729 -webkit-border-radius: 2px;
732 -webkit-user-select: none;
733 -moz-user-select: none;
734 -ms-user-select: none;
738 .theme-overlay .theme-name {
746 .theme-overlay .theme-version {
751 display: inline-block;
755 .theme-overlay .theme-author {
762 .theme-overlay .theme-author a {
763 text-decoration: none;
766 .theme-overlay .theme-description {
774 .theme-overlay .theme-tags {
775 border-top: 3px solid #eee;
783 .theme-overlay .theme-tags span {
789 /* Theme Updates info */
790 .theme-overlay .theme-update-message {
792 border: 1px solid #eee;
793 border-left: 4px solid #d54e21;
794 -webkit-border-radius: 3px;
796 padding: 5px 20px 10px;
799 .theme-overlay .theme-update {
802 display: inline-block;
807 .theme-overlay .parent-theme {
809 border: 1px solid #eee;
810 border-left: 4px solid #00a0d2;
814 padding: 10px 10px 10px 20px;
817 .theme-overlay .parent-theme strong {
823 * Displays detailed view inline when a user has no switch capabilities
825 .single-theme .theme-overlay .theme-backdrop,
826 .single-theme .theme-overlay .theme-header,
827 .single-theme .theme {
831 .single-theme .theme-overlay .theme-wrap {
842 .single-theme .theme-overlay .theme-about {
843 padding: 30px 30px 70px;
847 .single-theme .theme-overlay .theme-actions {
852 * Basic Responsive structure...
854 * Shuffles theme columns around based on screen width
857 @media only screen and (min-width: 2000px) {
858 #wpwrap .theme-browser .theme {
863 #wpwrap .theme-browser .theme:nth-child(3n),
864 #wpwrap .theme-browser .theme:nth-child(4n) {
868 #wpwrap .theme-browser .theme:nth-child(5n) {
873 @media only screen and (min-width: 1680px) {
874 .theme-overlay .theme-wrap {
880 /* Maximum screenshot width reaches 440px */
881 @media only screen and (min-width: 1640px) {
882 .theme-browser .theme {
886 .theme-browser .theme .theme-screenshot:after {
887 padding-top: 75%; /* using a 4/3 aspect ratio */
890 .theme-browser .theme:nth-child(3n) {
894 .theme-browser .theme:nth-child(4n) {
898 /* Maximum screenshot width reaches 440px */
899 @media only screen and (max-width: 1120px) {
900 .theme-browser .theme {
905 .theme-browser .theme:nth-child(even) {
909 .theme-browser .theme:nth-child(odd) {
914 /* Admin menu is folded */
915 @media only screen and (max-width: 900px) {
916 .theme-overlay .theme-wrap {
921 @media only screen and (max-width: 780px) {
922 body.folded .theme-overlay .theme-wrap,
923 .theme-overlay .theme-wrap {
924 top: 0; /* The adminmenu isn't fixed on mobile, so this can use the full viewport height */
928 padding: 70px 20px 20px;
930 z-index: 100000; /* should overlap #wpadminbar. */
934 .theme-browser .theme.active .theme-name span {
935 /* Hide the "Active: " label on smaller screens. */
939 .theme-overlay .theme-screenshots {
943 .theme-overlay .theme-info {
946 .single-theme .theme-wrap {
950 .theme-browser .theme .theme-actions {
951 padding: 5px 10px 4px 10px;
954 .theme-overlay.small-screenshot .theme-screenshots {
960 .theme-overlay.small-screenshot .theme-info {
965 .theme:not(.active):hover .theme-actions,
966 .theme:not(.active):focus .theme-actions,
967 .theme:hover .more-details,
968 .theme:focus .more-details {
972 .theme-browser.rendered .theme:hover .theme-screenshot img,
973 .theme-browser.rendered .theme:focus .theme-screenshot img {
978 @media only screen and (max-width: 480px) {
979 .theme-browser .theme {
984 .theme-browser .theme:nth-child(2n),
985 .theme-browser .theme:nth-child(3n) {
990 @media only screen and (max-width: 650px) {
991 .theme-overlay .theme-update,
992 .theme-overlay .theme-description {
996 .theme-overlay .theme-actions .delete-theme {
1002 .theme-overlay .theme-actions .inactive-theme {
1006 .theme-overlay .theme-screenshots {
1011 .theme-overlay .theme-info {
1015 .theme-overlay .theme-author {
1016 margin: 5px 0 15px 0;
1019 .theme-overlay .current-label {
1024 .themes-php .wp-filter-search {
1035 .theme-browser .theme.add-new-theme span:after {
1036 font: normal 60px/90px 'dashicons';
1045 .single-theme .theme-wrap {
1046 margin: 0 -12px 0 -10px;
1049 .single-theme .theme-overlay .theme-about {
1053 .single-theme .current-label {
1056 .single-theme .theme-overlay .theme-actions {
1065 .broken-themes table {
1068 border-spacing: 3px;
1073 /*------------------------------------------------------------------------------
1074 16.2 - Install Themes
1075 ------------------------------------------------------------------------------*/
1077 /* Already installed theme */
1078 .theme-browser .theme .theme-installed {
1079 background: #0073aa;
1081 .theme-browser .theme .theme-installed:before {
1084 .theme-browser .theme.is-installed .theme-actions .button-primary {
1085 display: none !important;
1088 .theme-install-php .wp-filter {
1092 .theme-install-php a.upload,
1093 .theme-install-php a.browse-themes {
1096 .theme-install-php a.browse-themes,
1097 .theme-install-php.show-upload-theme a.upload {
1100 .theme-install-php.show-upload-theme a.browse-themes {
1105 -webkit-box-sizing: border-box;
1106 -moz-box-sizing: border-box;
1107 box-sizing: border-box;
1116 body.show-upload-theme .upload-theme,
1120 .upload-theme .wp-upload-form,
1121 .upload-plugin .wp-upload-form {
1122 background: #fafafa;
1123 border: 1px solid #e5e5e5;
1128 .upload-theme .install-help,
1129 .upload-plugin .install-help {
1137 body.show-upload-theme .upload-theme + .wp-filter,
1138 body.show-upload-theme .upload-theme + .wp-filter + .theme-browser {
1152 body.no-results p.no-themes {
1155 body.show-upload-theme p.no-themes {
1156 display: none !important;
1159 .theme-install-php .add-new-theme {
1160 display: none !important;
1163 @media only screen and (max-width: 1120px) {
1164 .upload-theme .wp-upload-form {
1168 .upload-theme .install-help {
1175 .theme-details .star-rating {
1179 .theme-details .star-rating span:before {
1182 display: inline-block;
1183 -webkit-font-smoothing: antialiased;
1184 font: normal 20px/1 'dashicons';
1185 vertical-align: top;
1189 .star-rating.rating-10 span.one:before,
1190 .star-rating.rating-30 span.two:before,
1191 .star-rating.rating-50 span.three:before,
1192 .star-rating.rating-70 span.four:before,
1193 .star-rating.rating-90 span.five:before {
1198 .star-rating.rating-20 span.one:before,
1199 .star-rating.rating-30 span.one:before,
1200 .star-rating.rating-40 span.one:before,
1201 .star-rating.rating-40 span.two:before,
1202 .star-rating.rating-50 span.one:before,
1203 .star-rating.rating-50 span.two:before,
1204 .star-rating.rating-60 span.one:before,
1205 .star-rating.rating-60 span.two:before,
1206 .star-rating.rating-60 span.three:before,
1207 .star-rating.rating-70 span.one:before,
1208 .star-rating.rating-70 span.two:before,
1209 .star-rating.rating-70 span.three:before,
1210 .star-rating.rating-80 span.one:before,
1211 .star-rating.rating-80 span.two:before,
1212 .star-rating.rating-80 span.three:before,
1213 .star-rating.rating-80 span.four:before,
1214 .star-rating.rating-90 span.one:before,
1215 .star-rating.rating-90 span.two:before,
1216 .star-rating.rating-90 span.three:before,
1217 .star-rating.rating-90 span.four:before,
1218 .star-rating.rating-100 > span:before {
1222 .theme-details .star-rating .ratings {
1228 /*------------------------------------------------------------------------------
1229 16.3 - Custom Header Screen
1230 ------------------------------------------------------------------------------*/
1232 .appearance_page_custom-header #headimg {
1233 border: 1px solid #DFDFDF;
1238 .appearance_page_custom-header #upload-form p label {
1242 .appearance_page_custom-header .available-headers .default-header {
1244 margin: 0 20px 20px 0;
1247 .appearance_page_custom-header .random-header {
1249 margin: 0 20px 20px 0;
1250 vertical-align: middle;
1253 .appearance_page_custom-header .available-headers label input,
1254 .appearance_page_custom-header .random-header label input {
1258 .appearance_page_custom-header .available-headers label img {
1259 vertical-align: middle;
1263 /*------------------------------------------------------------------------------
1264 16.4 - Custom Background Screen
1265 ------------------------------------------------------------------------------*/
1267 div#custom-background-image {
1269 border: 1px solid #dfdfdf;
1272 div#custom-background-image img {
1277 /*------------------------------------------------------------------------------
1278 23.0 - Full Overlay w/ Sidebar
1279 ------------------------------------------------------------------------------*/
1281 body.full-overlay-active {
1286 background: transparent;
1298 .wp-full-overlay-sidebar {
1299 -webkit-box-sizing: border-box;
1300 -moz-box-sizing: border-box;
1301 box-sizing: border-box;
1315 .wp-full-overlay.collapsed .wp-full-overlay-sidebar {
1319 .wp-full-overlay.collapsed,
1320 .wp-full-overlay.expanded .wp-full-overlay-sidebar {
1321 margin-left: 0 !important;
1324 .wp-full-overlay.expanded {
1328 .wp-full-overlay.collapsed .wp-full-overlay-sidebar {
1329 margin-left: -300px;
1332 .wp-full-overlay-sidebar:after {
1343 .wp-full-overlay-main {
1352 #customize-preview.wp-full-overlay-main {
1353 background: url(../images/spinner.gif) no-repeat center center;
1354 -webkit-background-size: 20px 20px;
1355 background-size: 20px 20px;
1358 #customize-preview.wp-full-overlay-main.iframe-ready {
1362 .wp-full-overlay-sidebar .wp-full-overlay-header {
1372 -webkit-box-shadow: none;
1376 .wp-full-overlay-sidebar .wp-full-overlay-header a.back {
1380 .wp-full-overlay-sidebar .wp-full-overlay-footer {
1382 border-bottom: none;
1384 -webkit-box-shadow: none;
1388 .wp-full-overlay-sidebar .wp-full-overlay-sidebar-content {
1397 /* Close & Navigation Links */
1398 .theme-install-overlay .wp-full-overlay-sidebar .wp-full-overlay-header {
1402 .theme-install-overlay .close-full-overlay,
1403 .theme-install-overlay .previous-theme,
1404 .theme-install-overlay .next-theme {
1412 border-right: 1px solid #ddd;
1415 text-decoration: none;
1416 -webkit-transition: color .1s ease-in-out, background .1s ease-in-out;
1417 transition: color .1s ease-in-out, background .1s ease-in-out;
1420 .theme-install-overlay .close-full-overlay:hover,
1421 .theme-install-overlay .close-full-overlay:focus,
1422 .theme-install-overlay .previous-theme:hover,
1423 .theme-install-overlay .previous-theme:focus,
1424 .theme-install-overlay .next-theme:hover,
1425 .theme-install-overlay .next-theme:focus {
1430 -webkit-box-shadow: none;
1434 .theme-install-overlay .close-full-overlay:before {
1435 font: normal 22px/1 dashicons;
1442 .theme-install-overlay .previous-theme:before {
1443 font: normal 20px/1 dashicons;
1450 .theme-install-overlay .next-theme:before {
1451 font: normal 20px/1 dashicons;
1458 .theme-install-overlay .previous-theme.disabled,
1459 .theme-install-overlay .next-theme.disabled,
1460 .theme-install-overlay .previous-theme.disabled:hover,
1461 .theme-install-overlay .previous-theme.disabled:focus,
1462 .theme-install-overlay .next-theme.disabled:hover,
1463 .theme-install-overlay .next-theme.disabled:focus {
1467 pointer-events: none;
1470 /* Collapse Button */
1471 .wp-core-ui .wp-full-overlay .collapse-sidebar {
1479 background-color: transparent !important;
1480 border: none !important;
1481 -webkit-box-shadow: none !important;
1482 box-shadow: none !important;
1483 -webkit-border-radius: 0 !important;
1484 border-radius: 0 !important;
1487 .wp-core-ui .wp-full-overlay .collapse-sidebar:hover,
1488 .wp-core-ui .wp-full-overlay .collapse-sidebar:focus {
1492 .wp-full-overlay .collapse-sidebar-arrow,
1493 .wp-full-overlay .collapse-sidebar-label {
1494 display: inline-block;
1495 vertical-align: middle;
1499 .wp-full-overlay .collapse-sidebar-arrow {
1502 margin: 0 2px; /* avoid the focus box-shadow to be cut-off */
1503 -webkit-border-radius: 50%;
1508 .wp-full-overlay .collapse-sidebar:hover .collapse-sidebar-arrow,
1509 .wp-full-overlay .collapse-sidebar:focus .collapse-sidebar-arrow {
1512 0 0 2px 1px rgba(30, 140, 190, .8);
1515 0 0 2px 1px rgba(30, 140, 190, .8);
1518 .wp-full-overlay .collapse-sidebar-label {
1522 .wp-full-overlay.collapsed .collapse-sidebar-label {
1526 .wp-full-overlay .collapse-sidebar-arrow:before {
1530 font: normal 20px/1 'dashicons';
1533 -webkit-font-smoothing: antialiased;
1534 -moz-osx-font-smoothing: grayscale;
1538 .wp-full-overlay.collapsed .collapse-sidebar-arrow:before,
1539 .rtl .wp-full-overlay .collapse-sidebar-arrow:before {
1540 -webkit-transform: rotate(180.001deg);
1541 -ms-transform: rotate(180.001deg);
1542 transform: rotate(180.001deg); /* Firefox: promoting to its own layer to trigger anti-aliasing */
1545 .rtl .wp-full-overlay.collapsed .collapse-sidebar-arrow:before {
1546 -webkit-transform: none;
1547 -ms-transform: none;
1553 .wp-full-overlay-sidebar,
1554 .wp-full-overlay .collapse-sidebar,
1555 .wp-full-overlay-main {
1556 -webkit-transition-property: left, right, top, bottom, width, margin;
1557 transition-property: left, right, top, bottom, width, margin;
1558 -webkit-transition-duration: 0.2s;
1559 transition-duration: 0.2s;
1562 /*------------------------------------------------------------------------------
1563 24.0 - Customize Loader
1564 ------------------------------------------------------------------------------*/
1566 .no-customize-support .hide-if-no-customize,
1567 .customize-support .hide-if-customize,
1568 .no-customize-support.wp-core-ui .hide-if-no-customize,
1569 .no-customize-support .wp-core-ui .hide-if-no-customize,
1570 .customize-support.wp-core-ui .hide-if-customize,
1571 .customize-support .wp-core-ui .hide-if-customize {
1575 #customize-container {
1588 .customize-active #customize-container {
1592 .customize-loading #customize-container iframe {
1596 .customize-loading #customize-container {
1597 background: #fff url(../images/spinner.gif) no-repeat fixed center center;
1598 -webkit-background-size: 20px 20px;
1599 background-size: 20px 20px;
1602 #customize-container iframe,
1603 .theme-install-overlay iframe {
1607 -webkit-transition: opacity 0.3s;
1608 transition: opacity 0.3s;
1611 #customize-controls {
1615 .theme-install-overlay {
1619 .theme-install-overlay.single-theme {
1623 .install-theme-info {
1625 padding: 10px 20px 60px;
1628 .single-theme .install-theme-info {
1632 .theme-install-overlay .install-theme-info {
1636 .install-theme-info .theme-install {
1641 .install-theme-info .theme-name {
1648 .install-theme-info .theme-screenshot {
1651 border: 1px solid #ccc;
1654 .install-theme-info .theme-details {
1658 .theme-details .theme-version {
1663 .theme-details .theme-description {
1670 .theme-install-overlay .wp-full-overlay-header .theme-install {
1672 margin: 8px 10px 0 0;
1673 /* For when .theme-install is a span rather than a.button-primary (already installed theme) */
1677 .theme-install-overlay .wp-full-overlay-sidebar {
1679 border-right: 1px solid #ddd;
1682 .theme-install-overlay .wp-full-overlay-sidebar-content {
1684 border-top: 1px solid #ddd;
1685 border-bottom: 1px solid #ddd;
1688 .theme-install-overlay .wp-full-overlay-main {
1689 background: #fff url(../images/spinner.gif) no-repeat center center;
1690 -webkit-background-size: 20px 20px;
1691 background-size: 20px 20px;
1695 -------------------------------------------------------------- */
1701 (-webkit-min-device-pixel-ratio: 1.25),
1702 (min-resolution: 120dpi) {
1703 .wp-full-overlay .collapse-sidebar-arrow {
1704 background-image: url(../images/arrows-2x.png);
1705 -webkit-background-size: 15px 123px;
1706 background-size: 15px 123px;
1709 #customize-preview.wp-full-overlay-main,
1710 .customize-loading #customize-container,
1711 .theme-install-overlay .wp-full-overlay-main {
1712 background-image: url(../images/spinner-2x.gif);
1715 .theme-install-overlay .wp-full-overlay-header .theme-install {
1720 @media screen and ( max-width: 782px ) {
1721 .available-theme .action-links .delete-theme {
1728 .available-theme .action-links .delete-theme a {
1732 .broken-themes table {
1736 .theme-install-overlay .wp-full-overlay-header .theme-install {
1738 line-height: normal;