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 {
760 line-height: inherit;
763 .theme-overlay .theme-author a {
764 text-decoration: none;
767 .theme-overlay .theme-description {
775 .theme-overlay .theme-tags {
776 border-top: 3px solid #eee;
784 .theme-overlay .theme-tags span {
790 .theme-overlay .parent-theme {
792 border: 1px solid #eee;
793 border-left: 4px solid #00a0d2;
797 padding: 10px 10px 10px 20px;
800 .theme-overlay .parent-theme strong {
806 * Displays detailed view inline when a user has no switch capabilities
808 .single-theme .theme-overlay .theme-backdrop,
809 .single-theme .theme-overlay .theme-header,
810 .single-theme .theme {
814 .single-theme .theme-overlay .theme-wrap {
825 .single-theme .theme-overlay .theme-about {
826 padding: 30px 30px 70px;
830 .single-theme .theme-overlay .theme-actions {
835 * Basic Responsive structure...
837 * Shuffles theme columns around based on screen width
840 @media only screen and (min-width: 2000px) {
841 #wpwrap .theme-browser .theme {
846 #wpwrap .theme-browser .theme:nth-child(3n),
847 #wpwrap .theme-browser .theme:nth-child(4n) {
851 #wpwrap .theme-browser .theme:nth-child(5n) {
856 @media only screen and (min-width: 1680px) {
857 .theme-overlay .theme-wrap {
863 /* Maximum screenshot width reaches 440px */
864 @media only screen and (min-width: 1640px) {
865 .theme-browser .theme {
869 .theme-browser .theme .theme-screenshot:after {
870 padding-top: 75%; /* using a 4/3 aspect ratio */
873 .theme-browser .theme:nth-child(3n) {
877 .theme-browser .theme:nth-child(4n) {
881 /* Maximum screenshot width reaches 440px */
882 @media only screen and (max-width: 1120px) {
883 .theme-browser .theme {
888 .theme-browser .theme:nth-child(even) {
892 .theme-browser .theme:nth-child(odd) {
897 /* Admin menu is folded */
898 @media only screen and (max-width: 900px) {
899 .theme-overlay .theme-wrap {
904 @media only screen and (max-width: 780px) {
905 body.folded .theme-overlay .theme-wrap,
906 .theme-overlay .theme-wrap {
907 top: 0; /* The adminmenu isn't fixed on mobile, so this can use the full viewport height */
911 padding: 70px 20px 20px;
913 z-index: 100000; /* should overlap #wpadminbar. */
917 .theme-browser .theme.active .theme-name span {
918 /* Hide the "Active: " label on smaller screens. */
922 .theme-overlay .theme-screenshots {
926 .theme-overlay .theme-info {
929 .single-theme .theme-wrap {
933 .theme-browser .theme .theme-actions {
934 padding: 5px 10px 4px 10px;
937 .theme-overlay.small-screenshot .theme-screenshots {
943 .theme-overlay.small-screenshot .theme-info {
948 .theme:not(.active):hover .theme-actions,
949 .theme:not(.active):focus .theme-actions,
950 .theme:hover .more-details,
951 .theme:focus .more-details {
955 .theme-browser.rendered .theme:hover .theme-screenshot img,
956 .theme-browser.rendered .theme:focus .theme-screenshot img {
961 @media only screen and (max-width: 480px) {
962 .theme-browser .theme {
967 .theme-browser .theme:nth-child(2n),
968 .theme-browser .theme:nth-child(3n) {
973 @media only screen and (max-width: 650px) {
974 .theme-overlay .theme-update,
975 .theme-overlay .theme-description {
979 .theme-overlay .theme-actions .delete-theme {
985 .theme-overlay .theme-actions .inactive-theme {
989 .theme-overlay .theme-screenshots {
994 .theme-overlay .theme-info {
998 .theme-overlay .theme-author {
999 margin: 5px 0 15px 0;
1002 .theme-overlay .current-label {
1007 .themes-php .wp-filter-search {
1018 .theme-browser .theme.add-new-theme span:after {
1019 font: normal 60px/90px dashicons;
1028 .single-theme .theme-wrap {
1029 margin: 0 -12px 0 -10px;
1032 .single-theme .theme-overlay .theme-about {
1036 .single-theme .current-label {
1039 .single-theme .theme-overlay .theme-actions {
1048 .broken-themes table {
1051 border-spacing: 3px;
1056 /*------------------------------------------------------------------------------
1057 16.2 - Install Themes
1058 ------------------------------------------------------------------------------*/
1060 /* Already installed theme */
1061 .theme-browser .theme .theme-installed {
1062 background: #0073aa;
1064 .theme-browser .theme .theme-installed:before {
1067 .theme-browser .theme.is-installed .theme-actions .button-primary {
1068 display: none !important;
1071 .theme-install-php .wp-filter {
1075 .theme-install-php a.upload,
1076 .theme-install-php a.browse-themes {
1079 .theme-install-php a.browse-themes,
1080 .theme-install-php.show-upload-theme a.upload {
1083 .theme-install-php.show-upload-theme a.browse-themes {
1088 -webkit-box-sizing: border-box;
1089 -moz-box-sizing: border-box;
1090 box-sizing: border-box;
1099 body.show-upload-theme .upload-theme,
1103 .upload-theme .wp-upload-form,
1104 .upload-plugin .wp-upload-form {
1105 background: #fafafa;
1106 border: 1px solid #e5e5e5;
1111 .upload-theme .install-help,
1112 .upload-plugin .install-help {
1120 body.show-upload-theme .upload-theme + .wp-filter,
1121 body.show-upload-theme .upload-theme + .wp-filter + .theme-browser {
1135 body.no-results p.no-themes {
1138 body.show-upload-theme p.no-themes {
1139 display: none !important;
1142 .theme-install-php .add-new-theme {
1143 display: none !important;
1146 @media only screen and (max-width: 1120px) {
1147 .upload-theme .wp-upload-form {
1151 .upload-theme .install-help {
1158 .theme-details .theme-rating {
1162 .theme-details .star-rating {
1166 .theme-details .num-ratings,
1167 .theme-details .no-rating {
1172 .theme-details .no-rating {
1177 /*------------------------------------------------------------------------------
1178 16.3 - Custom Header Screen
1179 ------------------------------------------------------------------------------*/
1181 .appearance_page_custom-header #headimg {
1182 border: 1px solid #DFDFDF;
1187 .appearance_page_custom-header #upload-form p label {
1191 .appearance_page_custom-header .available-headers .default-header {
1193 margin: 0 20px 20px 0;
1196 .appearance_page_custom-header .random-header {
1198 margin: 0 20px 20px 0;
1199 vertical-align: middle;
1202 .appearance_page_custom-header .available-headers label input,
1203 .appearance_page_custom-header .random-header label input {
1207 .appearance_page_custom-header .available-headers label img {
1208 vertical-align: middle;
1212 /*------------------------------------------------------------------------------
1213 16.4 - Custom Background Screen
1214 ------------------------------------------------------------------------------*/
1216 div#custom-background-image {
1218 border: 1px solid #dfdfdf;
1221 div#custom-background-image img {
1226 /*------------------------------------------------------------------------------
1227 23.0 - Full Overlay w/ Sidebar
1228 ------------------------------------------------------------------------------*/
1230 body.full-overlay-active {
1235 background: transparent;
1247 .wp-full-overlay-sidebar {
1248 -webkit-box-sizing: border-box;
1249 -moz-box-sizing: border-box;
1250 box-sizing: border-box;
1264 .wp-full-overlay.collapsed .wp-full-overlay-sidebar {
1268 .wp-full-overlay.collapsed,
1269 .wp-full-overlay.expanded .wp-full-overlay-sidebar {
1270 margin-left: 0 !important;
1273 .wp-full-overlay.expanded {
1277 .wp-full-overlay.collapsed .wp-full-overlay-sidebar {
1278 margin-left: -300px;
1281 .wp-full-overlay-sidebar:after {
1292 .wp-full-overlay-main {
1301 #customize-preview.wp-full-overlay-main {
1302 background: url(../images/spinner.gif) no-repeat center center;
1303 -webkit-background-size: 20px 20px;
1304 background-size: 20px 20px;
1307 #customize-preview.wp-full-overlay-main.iframe-ready {
1311 .wp-full-overlay-sidebar .wp-full-overlay-header {
1321 -webkit-box-shadow: none;
1325 .wp-full-overlay-sidebar .wp-full-overlay-header a.back {
1329 .wp-full-overlay-sidebar .wp-full-overlay-footer {
1331 border-bottom: none;
1333 -webkit-box-shadow: none;
1337 .wp-full-overlay-sidebar .wp-full-overlay-sidebar-content {
1346 /* Close & Navigation Links */
1347 .theme-install-overlay .wp-full-overlay-sidebar .wp-full-overlay-header {
1351 .theme-install-overlay .close-full-overlay,
1352 .theme-install-overlay .previous-theme,
1353 .theme-install-overlay .next-theme {
1361 border-right: 1px solid #ddd;
1364 text-decoration: none;
1365 -webkit-transition: color .1s ease-in-out, background .1s ease-in-out;
1366 transition: color .1s ease-in-out, background .1s ease-in-out;
1369 .theme-install-overlay .close-full-overlay:hover,
1370 .theme-install-overlay .close-full-overlay:focus,
1371 .theme-install-overlay .previous-theme:hover,
1372 .theme-install-overlay .previous-theme:focus,
1373 .theme-install-overlay .next-theme:hover,
1374 .theme-install-overlay .next-theme:focus {
1379 -webkit-box-shadow: none;
1383 .theme-install-overlay .close-full-overlay:before {
1384 font: normal 22px/1 dashicons;
1391 .theme-install-overlay .previous-theme:before {
1392 font: normal 20px/1 dashicons;
1399 .theme-install-overlay .next-theme:before {
1400 font: normal 20px/1 dashicons;
1407 .theme-install-overlay .previous-theme.disabled,
1408 .theme-install-overlay .next-theme.disabled,
1409 .theme-install-overlay .previous-theme.disabled:hover,
1410 .theme-install-overlay .previous-theme.disabled:focus,
1411 .theme-install-overlay .next-theme.disabled:hover,
1412 .theme-install-overlay .next-theme.disabled:focus {
1416 pointer-events: none;
1419 /* Collapse Button */
1420 .wp-core-ui .wp-full-overlay .collapse-sidebar {
1428 background-color: transparent !important;
1429 border: none !important;
1430 -webkit-box-shadow: none !important;
1431 box-shadow: none !important;
1432 -webkit-border-radius: 0 !important;
1433 border-radius: 0 !important;
1436 .wp-core-ui .wp-full-overlay .collapse-sidebar:hover,
1437 .wp-core-ui .wp-full-overlay .collapse-sidebar:focus {
1441 .wp-full-overlay .collapse-sidebar-arrow,
1442 .wp-full-overlay .collapse-sidebar-label {
1443 display: inline-block;
1444 vertical-align: middle;
1448 .wp-full-overlay .collapse-sidebar-arrow {
1451 margin: 0 2px; /* avoid the focus box-shadow to be cut-off */
1452 -webkit-border-radius: 50%;
1457 .wp-full-overlay .collapse-sidebar:hover .collapse-sidebar-arrow,
1458 .wp-full-overlay .collapse-sidebar:focus .collapse-sidebar-arrow {
1461 0 0 2px 1px rgba(30, 140, 190, .8);
1464 0 0 2px 1px rgba(30, 140, 190, .8);
1467 .wp-full-overlay .collapse-sidebar-label {
1471 .wp-full-overlay.collapsed .collapse-sidebar-label {
1475 .wp-full-overlay .collapse-sidebar-arrow:before {
1479 font: normal 20px/1 dashicons;
1482 -webkit-font-smoothing: antialiased;
1483 -moz-osx-font-smoothing: grayscale;
1487 .wp-full-overlay.collapsed .collapse-sidebar-arrow:before,
1488 .rtl .wp-full-overlay .collapse-sidebar-arrow:before {
1489 -webkit-transform: rotate(180.001deg);
1490 -ms-transform: rotate(180.001deg);
1491 transform: rotate(180.001deg); /* Firefox: promoting to its own layer to trigger anti-aliasing */
1494 .rtl .wp-full-overlay.collapsed .collapse-sidebar-arrow:before {
1495 -webkit-transform: none;
1496 -ms-transform: none;
1502 .wp-full-overlay-sidebar,
1503 .wp-full-overlay .collapse-sidebar,
1504 .wp-full-overlay-main {
1505 -webkit-transition-property: left, right, top, bottom, width, margin;
1506 transition-property: left, right, top, bottom, width, margin;
1507 -webkit-transition-duration: 0.2s;
1508 transition-duration: 0.2s;
1511 /*------------------------------------------------------------------------------
1512 24.0 - Customize Loader
1513 ------------------------------------------------------------------------------*/
1515 .no-customize-support .hide-if-no-customize,
1516 .customize-support .hide-if-customize,
1517 .no-customize-support.wp-core-ui .hide-if-no-customize,
1518 .no-customize-support .wp-core-ui .hide-if-no-customize,
1519 .customize-support.wp-core-ui .hide-if-customize,
1520 .customize-support .wp-core-ui .hide-if-customize {
1524 #customize-container {
1537 .customize-active #customize-container {
1541 .customize-loading #customize-container iframe {
1545 .customize-loading #customize-container {
1546 background: #fff url(../images/spinner.gif) no-repeat fixed center center;
1547 -webkit-background-size: 20px 20px;
1548 background-size: 20px 20px;
1551 #customize-container iframe,
1552 .theme-install-overlay iframe {
1556 -webkit-transition: opacity 0.3s;
1557 transition: opacity 0.3s;
1560 #customize-controls {
1564 .theme-install-overlay {
1568 .theme-install-overlay.single-theme {
1572 .install-theme-info {
1574 padding: 10px 20px 60px;
1577 .single-theme .install-theme-info {
1581 .theme-install-overlay .install-theme-info {
1585 .install-theme-info .theme-install {
1590 .install-theme-info .theme-name {
1597 .install-theme-info .theme-screenshot {
1600 border: 1px solid #ccc;
1603 .install-theme-info .theme-details {
1607 .theme-details .theme-version {
1611 .theme-details .theme-description {
1618 .theme-install-overlay .wp-full-overlay-header .theme-install {
1620 margin: 8px 10px 0 0;
1621 /* For when .theme-install is a span rather than a.button-primary (already installed theme) */
1625 .theme-install-overlay .wp-full-overlay-sidebar {
1627 border-right: 1px solid #ddd;
1630 .theme-install-overlay .wp-full-overlay-sidebar-content {
1632 border-top: 1px solid #ddd;
1633 border-bottom: 1px solid #ddd;
1636 .theme-install-overlay .wp-full-overlay-main {
1639 background-color: #fff;
1642 .theme-install-overlay .wp-full-overlay-main:before {
1651 margin: -10px 0 0 -10px;
1652 -webkit-transform: translateZ(0);
1653 transform: translateZ(0);
1654 background: #fff url(../images/spinner.gif) no-repeat center center;
1655 -webkit-background-size: 20px 20px;
1656 background-size: 20px 20px;
1659 .theme-install-overlay.iframe-ready .wp-full-overlay-main:before {
1660 background-image: none;
1664 -------------------------------------------------------------- */
1670 (-webkit-min-device-pixel-ratio: 1.25),
1671 (min-resolution: 120dpi) {
1672 .wp-full-overlay .collapse-sidebar-arrow {
1673 background-image: url(../images/arrows-2x.png);
1674 -webkit-background-size: 15px 123px;
1675 background-size: 15px 123px;
1678 #customize-preview.wp-full-overlay-main,
1679 .customize-loading #customize-container,
1680 .theme-install-overlay .wp-full-overlay-main:before {
1681 background-image: url(../images/spinner-2x.gif);
1685 @media screen and ( max-width: 782px ) {
1686 .available-theme .action-links .delete-theme {
1693 .available-theme .action-links .delete-theme a {
1697 .broken-themes table {
1701 .theme-install-overlay .wp-full-overlay-header .theme-install {
1703 line-height: normal;