[ Index ] |
PHP Cross Reference of WordPress Trunk (Updated Daily) |
[Summary view] [Print] [Text view]
1 /*! This file is auto-generated */ 2 /*------------------------------------------------------------------------------ 3 16.0 - Themes 4 ------------------------------------------------------------------------------*/ 5 6 7 /*------------------------------------------------------------------------------ 8 16.1 - Manage Themes 9 ------------------------------------------------------------------------------*/ 10 11 .themes-php { 12 overflow-y: scroll; 13 } 14 15 body.js .theme-browser.search-loading { 16 display: none; 17 } 18 19 .theme-browser .themes { 20 clear: both; 21 } 22 23 .themes-php:not(.network-admin) .wrap h1 { 24 margin-bottom: 15px; 25 } 26 27 .themes-php .wrap h1 .button { 28 margin-right: 20px; 29 } 30 31 /* Search form */ 32 .themes-php .search-form { 33 display: inline; 34 } 35 36 .themes-php .wp-filter-search { 37 position: relative; 38 top: -2px; 39 right: 20px; 40 margin: 0; 41 width: 280px; 42 } 43 44 /* Position admin messages */ 45 .theme .notice, 46 .theme .notice.is-dismissible { 47 right: 0; 48 margin: 0; 49 position: absolute; 50 left: 0; 51 top: 0; 52 } 53 54 /** 55 * Main theme element 56 * (has flexible margins) 57 */ 58 .theme-browser .theme { 59 cursor: pointer; 60 float: right; 61 margin: 0 0 4% 4%; 62 position: relative; 63 width: 30.6%; 64 border: 1px solid #dcdcde; 65 box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1); 66 box-sizing: border-box; 67 } 68 69 .theme-browser .theme:nth-child(3n) { 70 margin-left: 0; 71 } 72 73 .theme-browser .theme:hover, 74 .theme-browser .theme.focus { 75 cursor: pointer; 76 } 77 78 .theme-browser .theme .theme-name { 79 font-size: 15px; 80 font-weight: 600; 81 height: 18px; 82 margin: 0; 83 padding: 15px; 84 box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.1); 85 overflow: hidden; 86 white-space: nowrap; 87 text-overflow: ellipsis; 88 background: #fff; 89 background: rgba(255, 255, 255, 0.65); 90 } 91 92 /* Activate and Customize buttons, shown on hover and focus */ 93 .theme-browser .theme .theme-actions { 94 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; 95 opacity: 0; 96 transition: opacity 0.1s ease-in-out; 97 height: auto; 98 background: rgba(246, 247, 247, 0.7); 99 border-right: 1px solid rgba(0, 0, 0, 0.05); 100 } 101 102 .theme-browser .theme:hover .theme-actions, 103 .theme-browser .theme.focus .theme-actions { 104 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; 105 opacity: 1; 106 } 107 108 .theme-browser .theme .theme-actions .button-primary { 109 margin-left: 3px; 110 } 111 112 .theme-browser .theme .theme-actions .button { 113 float: none; 114 margin-right: 3px; 115 } 116 117 /** 118 * Theme Screenshot 119 * 120 * Has a fixed aspect ratio of 1.5 to 1 regardless of screenshot size 121 * It is also responsive. 122 */ 123 .theme-browser .theme .theme-screenshot { 124 display: block; 125 overflow: hidden; 126 position: relative; 127 -webkit-backface-visibility: hidden; /* Prevents flicker of the screenshot on hover. */ 128 transition: opacity 0.2s ease-in-out; 129 } 130 131 .theme-browser .theme .theme-screenshot:after { 132 content: ""; 133 display: block; 134 padding-top: 66.66666%; /* using a 3/2 aspect ratio */ 135 } 136 137 .theme-browser .theme .theme-screenshot img { 138 height: auto; 139 position: absolute; 140 right: 0; 141 top: 0; 142 width: 100%; 143 transition: opacity 0.2s ease-in-out; 144 } 145 146 .theme-browser .theme:hover .theme-screenshot, 147 .theme-browser .theme.focus .theme-screenshot { 148 background: #fff; 149 } 150 151 .theme-browser.rendered .theme:hover .theme-screenshot img, 152 .theme-browser.rendered .theme.focus .theme-screenshot img { 153 opacity: 0.4; 154 } 155 156 .theme-browser .theme .more-details { 157 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; 158 opacity: 0; 159 position: absolute; 160 top: 35%; 161 left: 20%; 162 right: 20%; 163 width: 60%; 164 background: #1d2327; 165 background: rgba(0, 0, 0, 0.7); 166 color: #fff; 167 font-size: 15px; 168 text-shadow: 0 1px 0 rgba(0, 0, 0, 0.6); 169 -webkit-font-smoothing: antialiased; 170 font-weight: 600; 171 padding: 15px 12px; 172 text-align: center; 173 border-radius: 3px; 174 border: none; 175 transition: opacity 0.1s ease-in-out; 176 cursor: pointer; 177 } 178 179 .theme-browser .theme .more-details:focus { 180 box-shadow: 0 0 0 2px #2271b1; 181 } 182 183 .theme-browser .theme.focus { 184 border-color: #2271b1; 185 box-shadow: 0 0 0 1px #2271b1; 186 /* Only visible in Windows High Contrast mode */ 187 outline: 2px solid transparent; 188 } 189 190 .theme-browser .theme.focus .more-details { 191 opacity: 1; 192 } 193 194 /* Current theme needs to have its action always on view */ 195 .theme-browser .theme.active.focus .theme-actions { 196 display: block; 197 } 198 199 .theme-browser.rendered .theme:hover .more-details, 200 .theme-browser.rendered .theme.focus .more-details { 201 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; 202 opacity: 1; 203 } 204 205 /** 206 * The currently active theme 207 */ 208 .theme-browser .theme.active .theme-name { 209 background: #1d2327; 210 color: #fff; 211 padding-left: 110px; 212 font-weight: 300; 213 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5); 214 } 215 216 .theme-browser .customize-control .theme.active .theme-name { 217 padding-left: 15px; 218 } 219 220 .theme-browser .theme.active .theme-name span { 221 font-weight: 600; 222 } 223 224 .theme-browser .theme.active .theme-actions { 225 background: rgba(44, 51, 56, 0.7); 226 border-right: none; 227 opacity: 1; 228 } 229 230 .theme-id-container { 231 position: relative; 232 } 233 234 .theme-browser .theme.active .theme-actions, 235 .theme-browser .theme .theme-actions { 236 position: absolute; 237 top: 50%; 238 transform: translateY(-50%); 239 left: 0; 240 padding: 9px 15px; 241 box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.1); 242 } 243 244 .theme-browser .theme.active .theme-actions .button-primary { 245 margin-left: 0; 246 } 247 248 .theme-browser .theme .theme-author { 249 background: #1d2327; 250 color: #f0f0f1; 251 display: none; 252 font-size: 14px; 253 margin: 0 10px; 254 padding: 5px 10px; 255 position: absolute; 256 bottom: 56px; 257 } 258 259 .theme-browser .theme.display-author .theme-author { 260 display: block; 261 } 262 263 .theme-browser .theme.display-author .theme-author a { 264 color: inherit; 265 } 266 267 /** 268 * Add new theme 269 */ 270 .theme-browser .theme.add-new-theme { 271 border: none; 272 box-shadow: none; 273 } 274 275 .theme-browser .theme.add-new-theme a { 276 text-decoration: none; 277 display: block; 278 position: relative; 279 z-index: 1; 280 } 281 282 .theme-browser .theme.add-new-theme a:after { 283 display: block; 284 content: ""; 285 background: transparent; 286 background: rgba(0, 0, 0, 0); 287 position: absolute; 288 top: 0; 289 right: 0; 290 left: 0; 291 bottom: 0; 292 padding: 0; 293 text-shadow: none; 294 border: 5px dashed #dcdcde; 295 border: 5px dashed rgba(0, 0, 0, 0.1); 296 box-sizing: border-box; 297 } 298 299 .theme-browser .theme.add-new-theme span:after { 300 background: #dcdcde; 301 background: rgba(140, 143, 148, 0.1); 302 border-radius: 50%; 303 display: inline-block; 304 content: "\f132"; 305 -webkit-font-smoothing: antialiased; 306 font: normal 74px/115px dashicons; 307 width: 100px; 308 height: 100px; 309 vertical-align: middle; 310 text-align: center; 311 color: #8c8f94; 312 position: absolute; 313 top: 30%; 314 right: 50%; 315 margin-right: -50px; 316 text-indent: -4px; 317 padding: 0; 318 text-shadow: none; 319 z-index: 4; 320 } 321 322 .rtl .theme-browser .theme.add-new-theme span:after { 323 text-indent: 4px; 324 } 325 326 .theme-browser .theme.add-new-theme a:hover .theme-screenshot, 327 .theme-browser .theme.add-new-theme a:focus .theme-screenshot { 328 background: none; 329 } 330 331 .theme-browser .theme.add-new-theme a:hover span:after, 332 .theme-browser .theme.add-new-theme a:focus span:after { 333 background: #fff; 334 color: #2271b1; 335 } 336 337 .theme-browser .theme.add-new-theme a:hover:after, 338 .theme-browser .theme.add-new-theme a:focus:after { 339 border-color: transparent; 340 color: #fff; 341 background: #2271b1; 342 content: ""; 343 } 344 345 .theme-browser .theme.add-new-theme .theme-name { 346 background: none; 347 text-align: center; 348 box-shadow: none; 349 font-weight: 400; 350 position: relative; 351 top: 0; 352 margin-top: -18px; 353 padding-top: 0; 354 padding-bottom: 48px; 355 } 356 357 .theme-browser .theme.add-new-theme a:hover .theme-name, 358 .theme-browser .theme.add-new-theme a:focus .theme-name { 359 color: #fff; 360 z-index: 2; 361 } 362 363 /** 364 * Theme Overlay 365 * Shown when clicking a theme 366 */ 367 .theme-overlay .theme-backdrop { 368 position: absolute; 369 right: -20px; 370 left: 0; 371 top: 0; 372 bottom: 0; 373 background: #f0f0f1; 374 background: rgba(240, 240, 241, 0.9); 375 z-index: 10000; /* Over WP Pointers. */ 376 } 377 378 .theme-overlay .theme-header { 379 position: absolute; 380 top: 0; 381 right: 0; 382 left: 0; 383 height: 48px; 384 border-bottom: 1px solid #dcdcde; 385 } 386 387 .theme-overlay .theme-header button { 388 padding: 0; 389 } 390 391 .theme-overlay .theme-header .close { 392 cursor: pointer; 393 height: 48px; 394 width: 50px; 395 text-align: center; 396 float: left; 397 border: 0; 398 border-right: 1px solid #dcdcde; 399 background-color: transparent; 400 transition: color .1s ease-in-out, background .1s ease-in-out; 401 } 402 403 .theme-overlay .theme-header .close:before { 404 font: normal 22px/50px dashicons !important; 405 color: #787c82; 406 display: inline-block; 407 content: "\f335"; 408 font-weight: 300; 409 } 410 411 /* Left and right navigation */ 412 .theme-overlay .theme-header .right, 413 .theme-overlay .theme-header .left { 414 cursor: pointer; 415 color: #787c82; 416 background-color: transparent; 417 height: 48px; 418 width: 54px; 419 float: right; 420 text-align: center; 421 border: 0; 422 border-left: 1px solid #dcdcde; 423 transition: color .1s ease-in-out, background .1s ease-in-out; 424 } 425 426 .theme-overlay .theme-header .close:focus, 427 .theme-overlay .theme-header .close:hover, 428 .theme-overlay .theme-header .right:focus, 429 .theme-overlay .theme-header .right:hover, 430 .theme-overlay .theme-header .left:focus, 431 .theme-overlay .theme-header .left:hover { 432 background: #dcdcde; 433 border-color: #c3c4c7; 434 color: #000; 435 } 436 437 .theme-overlay .theme-header .close:focus:before, 438 .theme-overlay .theme-header .close:hover:before { 439 color: #000; 440 } 441 442 .theme-overlay .theme-header .close:focus, 443 .theme-overlay .theme-header .right:focus, 444 .theme-overlay .theme-header .left:focus { 445 box-shadow: none; 446 outline: none; 447 } 448 449 .theme-overlay .theme-header .left.disabled, 450 .theme-overlay .theme-header .right.disabled, 451 .theme-overlay .theme-header .left.disabled:hover, 452 .theme-overlay .theme-header .right.disabled:hover { 453 color: #c3c4c7; 454 background: inherit; 455 cursor: inherit; 456 } 457 458 .theme-overlay .theme-header .right:before, 459 .theme-overlay .theme-header .left:before { 460 font: normal 20px/50px dashicons !important; 461 display: inline; 462 font-weight: 300; 463 } 464 465 .theme-overlay .theme-header .left:before { 466 content: "\f345"; 467 } 468 469 .theme-overlay .theme-header .right:before { 470 content: "\f341"; 471 } 472 473 .theme-overlay .theme-wrap { 474 clear: both; 475 position: fixed; 476 top: 9%; 477 right: 190px; 478 left: 30px; 479 bottom: 3%; 480 background: #fff; 481 box-shadow: 0 1px 20px 5px rgba(0, 0, 0, 0.1); 482 z-index: 10000; /* Over WP Pointers. */ 483 box-sizing: border-box; 484 -webkit-overflow-scrolling: touch; 485 } 486 487 body.folded .theme-browser ~ .theme-overlay .theme-wrap { 488 right: 70px; 489 } 490 491 .theme-overlay .theme-about { 492 position: absolute; 493 top: 49px; 494 bottom: 57px; 495 right: 0; 496 left: 0; 497 overflow: auto; 498 padding: 2% 4%; 499 } 500 501 .theme-overlay .theme-actions { 502 position: absolute; 503 text-align: center; 504 bottom: 0; 505 right: 0; 506 left: 0; 507 padding: 10px 25px 5px; 508 background: #f6f7f7; 509 z-index: 30; 510 box-sizing: border-box; 511 border-top: 1px solid #f0f0f1; 512 display: flex; 513 justify-content: center; 514 gap: 5px; 515 } 516 517 .theme-overlay .theme-actions .button { 518 margin-bottom: 5px; 519 } 520 521 /* Hide-if-customize for items we can't add classes to */ 522 .customize-support .theme-overlay .theme-actions a[href="themes.php?page=custom-header"], 523 .customize-support .theme-overlay .theme-actions a[href="themes.php?page=custom-background"] { 524 display: none; 525 } 526 527 .broken-themes a.delete-theme, 528 .theme-overlay .theme-actions .delete-theme { 529 color: #b32d2e; 530 text-decoration: none; 531 border-color: transparent; 532 box-shadow: none; 533 background: transparent; 534 } 535 536 .broken-themes a.delete-theme:hover, 537 .broken-themes a.delete-theme:focus, 538 .theme-overlay .theme-actions .delete-theme:hover, 539 .theme-overlay .theme-actions .delete-theme:focus { 540 background: #b32d2e; 541 color: #fff; 542 border-color: #b32d2e; 543 box-shadow: 0 0 0 1px #b32d2e; 544 } 545 546 .theme-overlay .theme-actions .active-theme, 547 .theme-overlay.active .theme-actions .inactive-theme { 548 display: none; 549 } 550 551 .theme-overlay .theme-actions .inactive-theme, 552 .theme-overlay.active .theme-actions .active-theme { 553 display: block; 554 } 555 556 /** 557 * Theme Screenshots gallery 558 */ 559 .theme-overlay .theme-screenshots { 560 float: right; 561 margin: 0 0 0 30px; 562 width: 55%; 563 max-width: 1200px; /* Recommended theme screenshot width, set here to avoid stretching */ 564 text-align: center; 565 } 566 567 /* First screenshot, shown big */ 568 .theme-overlay .screenshot { 569 border: 1px solid #fff; 570 box-sizing: border-box; 571 overflow: hidden; 572 position: relative; 573 box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); 574 } 575 576 .theme-overlay .screenshot:after { 577 content: ""; 578 display: block; 579 padding-top: 75%; /* using a 4/3 aspect ratio */ 580 } 581 582 .theme-overlay .screenshot img { 583 height: auto; 584 position: absolute; 585 right: 0; 586 top: 0; 587 width: 100%; 588 } 589 /* Handles old 300px screenshots */ 590 .theme-overlay.small-screenshot .theme-screenshots { 591 position: absolute; 592 width: 302px; 593 } 594 .theme-overlay.small-screenshot .theme-info { 595 margin-right: 350px; 596 width: auto; 597 } 598 599 /* Other screenshots, shown small and square */ 600 .theme-overlay .screenshot.thumb { 601 background: #c3c4c7; 602 border: 1px solid #f0f0f1; 603 float: none; 604 display: inline-block; 605 margin: 10px 5px 0; 606 width: 140px; 607 height: 80px; 608 cursor: pointer; 609 } 610 611 .theme-overlay .screenshot.thumb:after { 612 content: ""; 613 display: block; 614 padding-top: 100%; /* using a 1/1 aspect ratio */ 615 } 616 617 .theme-overlay .screenshot.thumb img { 618 cursor: pointer; 619 height: auto; 620 position: absolute; 621 right: 0; 622 top: 0; 623 width: 100%; 624 height: auto; 625 } 626 627 .theme-overlay .screenshot.selected { 628 background: transparent; 629 border: 2px solid #72aee6; 630 } 631 632 .theme-overlay .screenshot.selected img { 633 opacity: 0.8; 634 } 635 636 /* No screenshot placeholder */ 637 .theme-browser .theme .theme-screenshot.blank, 638 .theme-overlay .screenshot.blank { 639 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYGWO8d+/efwYkoKioiMRjYGBC4WHhUK6A8T8QIJt8//59ZC493AAAQssKpBK4F5AAAAAASUVORK5CYII=); 640 } 641 642 /** 643 * Theme heading information 644 */ 645 .theme-overlay .theme-info { 646 width: 40%; 647 float: right; 648 } 649 650 .theme-overlay .current-label { 651 background: #2c3338; 652 color: #fff; 653 font-size: 11px; 654 display: inline-block; 655 padding: 2px 8px; 656 border-radius: 2px; 657 margin: 0 0 -10px; 658 -webkit-user-select: none; 659 user-select: none; 660 } 661 662 .theme-overlay .theme-name { 663 color: #1d2327; 664 font-size: 32px; 665 font-weight: 100; 666 margin: 10px 0 0; 667 line-height: 1.3; 668 word-wrap: break-word; 669 overflow-wrap: break-word; 670 } 671 672 .theme-overlay .theme-version { 673 color: #646970; 674 font-size: 13px; 675 font-weight: 400; 676 float: none; 677 display: inline-block; 678 margin-right: 10px; 679 } 680 681 .theme-overlay .theme-author { 682 margin: 15px 0 25px; 683 color: #646970; 684 font-size: 16px; 685 font-weight: 400; 686 line-height: inherit; 687 } 688 689 .theme-overlay .toggle-auto-update { 690 /* Better align spin icon and text. */ 691 display: inline-flex; 692 align-items: center; 693 /* Prevents content after the auto-update toggler from jumping down and up. */ 694 min-height: 20px; /* Same height as the spinning dashicon. */ 695 vertical-align: top; 696 } 697 698 .theme-overlay .theme-autoupdate .toggle-auto-update { 699 text-decoration: none; 700 } 701 702 .theme-overlay .theme-autoupdate .toggle-auto-update .label { 703 text-decoration: underline; 704 } 705 706 .theme-overlay .theme-description { 707 color: #50575e; 708 font-size: 15px; 709 font-weight: 400; 710 line-height: 1.5; 711 margin: 30px 0 0; 712 } 713 714 .theme-overlay .theme-tags { 715 border-top: 3px solid #f0f0f1; 716 color: #646970; 717 font-size: 13px; 718 font-weight: 400; 719 margin: 30px 0 0; 720 padding-top: 20px; 721 } 722 723 .theme-overlay .theme-tags span { 724 color: #3c434a; 725 font-weight: 600; 726 margin-left: 5px; 727 } 728 729 .theme-overlay .parent-theme { 730 background: #fff; 731 border: 1px solid #f0f0f1; 732 border-right: 4px solid #72aee6; 733 font-size: 14px; 734 font-weight: 400; 735 margin-top: 30px; 736 padding: 10px 20px 10px 10px; 737 } 738 739 .theme-overlay .parent-theme strong { 740 font-weight: 600; 741 } 742 743 /** 744 * Single Theme Mode 745 * Displays detailed view inline when a user has no switch capabilities 746 */ 747 .single-theme .theme-overlay .theme-backdrop, 748 .single-theme .theme-overlay .theme-header, 749 .single-theme .theme { 750 display: none; 751 } 752 753 .single-theme .theme-overlay .theme-wrap { 754 clear: both; 755 min-height: 330px; 756 position: relative; 757 right: auto; 758 left: auto; 759 top: auto; 760 bottom: auto; 761 z-index: 10; 762 } 763 764 .single-theme .theme-overlay .theme-about { 765 padding: 30px 30px 70px; 766 position: static; 767 } 768 769 .single-theme .theme-overlay .theme-actions { 770 position: absolute; 771 } 772 773 /** 774 * Basic Responsive structure... 775 * 776 * Shuffles theme columns around based on screen width 777 */ 778 779 @media only screen and (min-width: 2000px) { 780 #wpwrap .theme-browser .theme { 781 width: 17.6%; 782 margin: 0 0 3% 3%; 783 } 784 785 #wpwrap .theme-browser .theme:nth-child(3n), 786 #wpwrap .theme-browser .theme:nth-child(4n) { 787 margin-left: 3%; 788 } 789 790 #wpwrap .theme-browser .theme:nth-child(5n) { 791 margin-left: 0; 792 } 793 } 794 795 @media only screen and (min-width: 1680px) { 796 .theme-overlay .theme-wrap { 797 width: 1450px; 798 margin: 0 auto; 799 } 800 } 801 802 /* Maximum screenshot width reaches 440px */ 803 @media only screen and (min-width: 1640px) { 804 .theme-browser .theme { 805 width: 22.7%; 806 margin: 0 0 3% 3%; 807 } 808 .theme-browser .theme .theme-screenshot:after { 809 padding-top: 75%; /* using a 4/3 aspect ratio */ 810 } 811 812 .theme-browser .theme:nth-child(3n) { 813 margin-left: 3%; 814 } 815 816 .theme-browser .theme:nth-child(4n) { 817 margin-left: 0; 818 } 819 } 820 /* Maximum screenshot width reaches 440px */ 821 @media only screen and (max-width: 1120px) { 822 .theme-browser .theme { 823 width: 47.5%; 824 margin-left: 0; 825 } 826 827 .theme-browser .theme:nth-child(even) { 828 margin-left: 0; 829 } 830 831 .theme-browser .theme:nth-child(odd) { 832 margin-left: 5%; 833 } 834 } 835 836 /* Admin menu is folded */ 837 @media only screen and (max-width: 960px) { 838 .theme-overlay .theme-wrap { 839 right: 65px; 840 } 841 } 842 843 @media only screen and (max-width: 782px) { 844 body.folded .theme-overlay .theme-wrap, 845 .theme-overlay .theme-wrap { 846 top: 0; /* The adminmenu isn't fixed on mobile, so this can use the full viewport height */ 847 left: 0; 848 bottom: 0; 849 right: 0; 850 padding: 70px 20px 20px; 851 border: none; 852 z-index: 100000; /* should overlap #wpadminbar. */ 853 position: fixed; 854 } 855 856 .theme-browser .theme.active .theme-name span { 857 /* Hide the "Active: " label on smaller screens. */ 858 display: none; 859 } 860 861 .theme-overlay .theme-screenshots { 862 width: 40%; 863 } 864 865 .theme-overlay .theme-info { 866 width: 50%; 867 } 868 .single-theme .theme-wrap { 869 padding: 10px; 870 } 871 872 .theme-browser .theme .theme-actions { 873 padding: 5px 10px 4px; 874 } 875 876 .theme-overlay.small-screenshot .theme-screenshots { 877 position: static; 878 float: none; 879 max-width: 302px; 880 } 881 882 .theme-overlay.small-screenshot .theme-info { 883 margin-right: 0; 884 width: auto; 885 } 886 887 .theme:not(.active):hover .theme-actions, 888 .theme:not(.active):focus .theme-actions, 889 .theme:hover .more-details, 890 .theme.focus .more-details { 891 display: none; 892 } 893 894 .theme-browser.rendered .theme:hover .theme-screenshot img, 895 .theme-browser.rendered .theme.focus .theme-screenshot img { 896 opacity: 1.0; 897 } 898 } 899 900 @media only screen and (max-width: 480px) { 901 .theme-browser .theme { 902 width: 100%; 903 margin-left: 0; 904 } 905 906 .theme-browser .theme:nth-child(2n), 907 .theme-browser .theme:nth-child(3n) { 908 margin-left: 0; 909 } 910 911 .theme-overlay .theme-about { 912 bottom: 105px; 913 } 914 915 .theme-overlay .theme-actions { 916 padding-right: 4%; 917 padding-left: 4%; 918 } 919 } 920 921 @media only screen and (max-width: 650px) { 922 .theme-overlay .theme-description { 923 margin-right: 0; 924 } 925 926 .theme-overlay .theme-actions .delete-theme { 927 position: relative; 928 left: auto; 929 bottom: auto; 930 } 931 932 .theme-overlay .theme-actions .inactive-theme { 933 display: inline; 934 } 935 936 .theme-overlay .theme-screenshots { 937 width: 100%; 938 float: none; 939 } 940 941 .theme-overlay .theme-info { 942 width: 100%; 943 } 944 945 .theme-overlay .theme-author { 946 margin: 5px 0 15px; 947 } 948 949 .theme-overlay .current-label { 950 margin-top: 10px; 951 font-size: 13px; 952 } 953 954 .themes-php .wp-filter-search { 955 float: none; 956 clear: both; 957 right: 0; 958 left: 0; 959 margin: -5px 0 20px; 960 width: 100%; 961 max-width: 280px; 962 } 963 964 .theme-browser .theme.add-new-theme span:after { 965 font: normal 60px/90px dashicons; 966 width: 80px; 967 height: 80px; 968 top: 30%; 969 right: 50%; 970 text-indent: 0; 971 margin-right: -40px; 972 } 973 974 .single-theme .theme-wrap { 975 margin: 0 -10px 0 -12px; 976 padding: 10px; 977 } 978 .single-theme .theme-overlay .theme-about { 979 padding: 10px; 980 overflow: visible; 981 } 982 .single-theme .current-label { 983 display: none; 984 } 985 .single-theme .theme-overlay .theme-actions { 986 position: static; 987 } 988 } 989 990 .broken-themes { 991 clear: both; 992 } 993 994 .broken-themes table { 995 text-align: right; 996 width: 50%; 997 border-spacing: 3px; 998 padding: 3px; 999 } 1000 1001 1002 /*------------------------------------------------------------------------------ 1003 16.2 - Install Themes 1004 ------------------------------------------------------------------------------*/ 1005 1006 .update-php .wrap { 1007 max-width: 40rem; 1008 } 1009 1010 /* Already installed theme */ 1011 .theme-browser .theme .theme-installed { 1012 background: #2271b1; 1013 } 1014 1015 .theme-browser .theme .notice-success p:before { 1016 color: #68de7c; 1017 content: "\f147"; 1018 display: inline-block; 1019 font: normal 20px/1 'dashicons'; 1020 -webkit-font-smoothing: antialiased; 1021 -moz-osx-font-smoothing: grayscale; 1022 vertical-align: top; 1023 } 1024 1025 .theme-install.updated-message:before { 1026 content: ""; 1027 } 1028 1029 .theme-install-php .wp-filter { 1030 padding-right: 20px; 1031 } 1032 1033 .theme-install-php a.upload, 1034 .theme-install-php a.browse-themes { 1035 cursor: pointer; 1036 } 1037 1038 .upload-view-toggle .browse, 1039 .plugin-install-tab-upload .upload-view-toggle .upload { 1040 display: none; 1041 } 1042 1043 .plugin-install-tab-upload .upload-view-toggle .browse { 1044 display: inline; 1045 } 1046 1047 .upload-theme, 1048 .upload-plugin { 1049 box-sizing: border-box; 1050 display: none; 1051 margin: 0; 1052 padding: 50px 0; 1053 width: 100%; 1054 overflow: hidden; 1055 position: relative; 1056 top: 10px; 1057 text-align: center; 1058 } 1059 1060 .show-upload-view .upload-theme, 1061 .show-upload-view .upload-plugin, 1062 .show-upload-view .upload-plugin-wrap, 1063 .plugin-install-tab-upload .upload-plugin { 1064 display: block; 1065 } 1066 1067 .upload-theme .wp-upload-form, 1068 .upload-plugin .wp-upload-form { 1069 background: #f6f7f7; 1070 border: 1px solid #c3c4c7; 1071 padding: 30px; 1072 margin: 30px auto; 1073 display: inline-flex; 1074 justify-content: space-between; 1075 align-items: center; 1076 } 1077 1078 .upload-theme .wp-upload-form input[type="file"], 1079 .upload-plugin .wp-upload-form input[type="file"] { 1080 margin-left: 10px; 1081 } 1082 1083 .upload-theme .install-help, 1084 .upload-plugin .install-help { 1085 color: #50575e; /* #f1f1f1 background */ 1086 font-size: 18px; 1087 font-style: normal; 1088 margin: 0; 1089 padding: 0; 1090 text-align: center; 1091 } 1092 1093 p.no-themes, 1094 p.no-themes-local { 1095 clear: both; 1096 color: #646970; 1097 font-size: 18px; 1098 font-style: normal; 1099 margin: 0; 1100 padding: 100px 0; 1101 text-align: center; 1102 display: none; 1103 } 1104 1105 .no-results p.no-themes { 1106 display: block; 1107 } 1108 1109 .theme-install-php .add-new-theme { 1110 display: none !important; 1111 } 1112 1113 @media only screen and (max-width: 1120px) { 1114 .upload-theme .wp-upload-form { 1115 margin: 20px 0; 1116 max-width: 100%; 1117 } 1118 .upload-theme .install-help { 1119 font-size: 15px; 1120 padding: 20px 0 0; 1121 } 1122 } 1123 1124 .theme-details .theme-rating { 1125 line-height: 1.9; 1126 } 1127 1128 .theme-details .star-rating { 1129 display: inline; 1130 } 1131 1132 .theme-details .num-ratings, 1133 .theme-details .no-rating { 1134 font-size: 11px; 1135 color: #646970; 1136 } 1137 1138 .theme-details .no-rating { 1139 display: block; 1140 line-height: 1.9; 1141 } 1142 1143 .update-from-upload-comparison { 1144 border-top: 1px solid #dcdcde; 1145 border-bottom: 1px solid #dcdcde; 1146 text-align: right; 1147 margin: 1rem 0 1.4rem; 1148 border-collapse: collapse; 1149 width: 100%; 1150 } 1151 1152 .update-from-upload-comparison tr:last-child td { 1153 height: 1.4rem; 1154 vertical-align: top; 1155 } 1156 1157 .update-from-upload-comparison tr:first-child th { 1158 font-weight: bold; 1159 height: 1.4rem; 1160 vertical-align: bottom; 1161 } 1162 1163 .update-from-upload-comparison td.name-label { 1164 text-align: left; 1165 } 1166 1167 .update-from-upload-comparison td, 1168 .update-from-upload-comparison th { 1169 padding: 0.4rem 1.4rem; 1170 } 1171 1172 .update-from-upload-comparison td.warning { 1173 color: #d63638; 1174 } 1175 1176 .update-from-upload-actions { 1177 margin-top: 1.4rem; 1178 } 1179 1180 /*------------------------------------------------------------------------------ 1181 16.3 - Custom Header Screen 1182 ------------------------------------------------------------------------------*/ 1183 1184 .appearance_page_custom-header #headimg { 1185 border: 1px solid #dcdcde; 1186 overflow: hidden; 1187 width: 100%; 1188 } 1189 1190 .appearance_page_custom-header #upload-form p label { 1191 font-size: 12px; 1192 } 1193 1194 .appearance_page_custom-header .available-headers .default-header { 1195 float: right; 1196 margin: 0 0 20px 20px; 1197 } 1198 1199 .appearance_page_custom-header .random-header { 1200 clear: both; 1201 margin: 0 0 20px 20px; 1202 vertical-align: middle; 1203 } 1204 1205 .appearance_page_custom-header .available-headers label input, 1206 .appearance_page_custom-header .random-header label input { 1207 margin-left: 10px; 1208 } 1209 1210 .appearance_page_custom-header .available-headers label img { 1211 vertical-align: middle; 1212 } 1213 1214 1215 /*------------------------------------------------------------------------------ 1216 16.4 - Custom Background Screen 1217 ------------------------------------------------------------------------------*/ 1218 1219 div#custom-background-image { 1220 min-height: 100px; 1221 border: 1px solid #dcdcde; 1222 } 1223 1224 div#custom-background-image img { 1225 max-width: 400px; 1226 max-height: 300px; 1227 } 1228 1229 .background-position-control input[type="radio"]:checked ~ .button { 1230 background: #f0f0f1; 1231 border-color: #8c8f94; 1232 box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5); 1233 z-index: 1; 1234 } 1235 1236 .background-position-control input[type="radio"]:focus ~ .button { 1237 border-color: #4f94d4; 1238 box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5), 0 0 3px rgba(34, 113, 177, 0.8); 1239 color: #1d2327; 1240 } 1241 1242 .background-position-control .background-position-center-icon, 1243 .background-position-control .background-position-center-icon:before { 1244 display: inline-block; 1245 line-height: 1; 1246 text-align: center; 1247 transition: background-color .1s ease-in; 1248 } 1249 1250 .background-position-control .background-position-center-icon { 1251 height: 20px; 1252 margin-top: 13px; 1253 vertical-align: top; 1254 width: 20px; 1255 } 1256 1257 .background-position-control .background-position-center-icon:before { 1258 background-color: #50575e; 1259 border-radius: 50%; 1260 content: ""; 1261 height: 12px; 1262 width: 12px; 1263 } 1264 1265 .background-position-control .button:hover .background-position-center-icon:before, 1266 .background-position-control input[type="radio"]:focus ~ .button .background-position-center-icon:before { 1267 background-color: #1d2327; 1268 } 1269 1270 .background-position-control .button-group { 1271 display: block; 1272 } 1273 1274 .background-position-control .button-group .button { 1275 border-radius: 0; 1276 box-shadow: none; 1277 /* Following properties are overridden by buttons responsive styles (see: wp-includes/css/buttons.css). */ 1278 height: 40px !important; 1279 line-height: 2.9 !important; 1280 margin: 0 0 0 -1px !important; 1281 padding: 0 10px 1px !important; 1282 position: relative; 1283 } 1284 1285 .background-position-control .button-group .button:active, 1286 .background-position-control .button-group .button:hover, 1287 .background-position-control .button-group .button:focus { 1288 z-index: 1; 1289 } 1290 1291 .background-position-control .button-group:last-child .button { 1292 box-shadow: 0 1px 0 #c3c4c7; 1293 } 1294 1295 .background-position-control .button-group > label { 1296 margin: 0 !important; 1297 } 1298 1299 .background-position-control .button-group:first-child > label:first-child .button { 1300 border-radius: 0 3px 0 0; 1301 } 1302 1303 .background-position-control .button-group:first-child > label:first-child .dashicons { 1304 transform: rotate( -45deg ); 1305 } 1306 1307 .background-position-control .button-group:first-child > label:last-child .button { 1308 border-radius: 3px 0 0 0; 1309 } 1310 1311 .background-position-control .button-group:first-child > label:last-child .dashicons { 1312 transform: rotate( 45deg ); 1313 } 1314 1315 .background-position-control .button-group:last-child > label:first-child .button { 1316 border-radius: 0 0 3px 0; 1317 } 1318 1319 .background-position-control .button-group:last-child > label:first-child .dashicons { 1320 transform: rotate( 45deg ); 1321 } 1322 1323 .background-position-control .button-group:last-child > label:last-child .button { 1324 border-radius: 0 0 0 3px; 1325 } 1326 1327 .background-position-control .button-group:last-child > label:last-child .dashicons { 1328 transform: rotate( -45deg ); 1329 } 1330 1331 .background-position-control .button-group .dashicons { 1332 margin-top: 9px; 1333 } 1334 1335 .background-position-control .button-group + .button-group { 1336 margin-top: -1px; 1337 } 1338 1339 /*------------------------------------------------------------------------------ 1340 23.0 - Full Overlay w/ Sidebar 1341 ------------------------------------------------------------------------------*/ 1342 1343 body.full-overlay-active { 1344 overflow: hidden; 1345 /* Hide all the content, the Customizer overlay is then made visible to be the only available content. */ 1346 visibility: hidden; 1347 } 1348 1349 .wp-full-overlay { 1350 background: transparent; 1351 z-index: 500000; 1352 position: fixed; 1353 overflow: visible; 1354 top: 0; 1355 bottom: 0; 1356 right: 0; 1357 left: 0; 1358 height: 100%; 1359 min-width: 0; 1360 } 1361 1362 .wp-full-overlay-sidebar { 1363 box-sizing: border-box; 1364 position: fixed; 1365 min-width: 300px; 1366 max-width: 600px; 1367 width: 18%; 1368 height: 100%; 1369 top: 0; 1370 bottom: 0; 1371 right: 0; 1372 padding: 0; 1373 margin: 0; 1374 z-index: 10; 1375 background: #f0f0f1; 1376 border-left: none; 1377 } 1378 1379 .wp-full-overlay.collapsed .wp-full-overlay-sidebar { 1380 overflow: visible; 1381 } 1382 1383 .wp-full-overlay.collapsed, 1384 .wp-full-overlay.expanded .wp-full-overlay-sidebar { 1385 margin-right: 0 !important; 1386 } 1387 1388 .wp-full-overlay.expanded { 1389 margin-right: 300px; 1390 } 1391 1392 .wp-full-overlay.collapsed .wp-full-overlay-sidebar { 1393 margin-right: -300px; 1394 } 1395 1396 @media screen and (min-width: 1667px) { 1397 .wp-full-overlay.expanded { 1398 margin-right: 18%; 1399 } 1400 1401 .wp-full-overlay.collapsed .wp-full-overlay-sidebar { 1402 margin-right: -18%; 1403 } 1404 } 1405 1406 @media screen and (min-width: 3333px) { 1407 .wp-full-overlay.expanded { 1408 margin-right: 600px; 1409 } 1410 1411 .wp-full-overlay.collapsed .wp-full-overlay-sidebar { 1412 margin-right: -600px; 1413 } 1414 } 1415 1416 .wp-full-overlay-sidebar:after { 1417 content: ""; 1418 display: block; 1419 position: absolute; 1420 top: 0; 1421 bottom: 0; 1422 left: 0; 1423 width: 3px; 1424 z-index: 1000; 1425 } 1426 1427 .wp-full-overlay-main { 1428 position: absolute; 1429 right: 0; 1430 left: 0; 1431 top: 0; 1432 bottom: 0; 1433 height: 100%; 1434 } 1435 1436 .wp-full-overlay-sidebar .wp-full-overlay-header { 1437 position: absolute; 1438 right: 0; 1439 left: 0; 1440 height: 45px; 1441 padding: 0 15px; 1442 line-height: 3.2; 1443 z-index: 10; 1444 margin: 0; 1445 border-top: none; 1446 box-shadow: none; 1447 } 1448 1449 .wp-full-overlay-sidebar .wp-full-overlay-header a.back { 1450 margin-top: 9px; 1451 } 1452 1453 .wp-full-overlay-sidebar .wp-full-overlay-footer { 1454 bottom: 0; 1455 border-bottom: none; 1456 border-top: none; 1457 box-shadow: none; 1458 } 1459 1460 .wp-full-overlay-sidebar .wp-full-overlay-sidebar-content { 1461 position: absolute; 1462 top: 45px; 1463 bottom: 45px; 1464 right: 0; 1465 left: 0; 1466 overflow: auto; 1467 } 1468 1469 /* Close & Navigation Links */ 1470 .theme-install-overlay .wp-full-overlay-sidebar .wp-full-overlay-header { 1471 padding: 0; 1472 } 1473 1474 .theme-install-overlay .close-full-overlay, 1475 .theme-install-overlay .previous-theme, 1476 .theme-install-overlay .next-theme { 1477 display: block; 1478 position: relative; 1479 float: right; 1480 width: 45px; 1481 height: 45px; 1482 background: #f0f0f1; 1483 border-left: 1px solid #dcdcde; 1484 color: #3c434a; 1485 cursor: pointer; 1486 text-decoration: none; 1487 transition: color .1s ease-in-out, background .1s ease-in-out; 1488 } 1489 1490 .theme-install-overlay .close-full-overlay:hover, 1491 .theme-install-overlay .close-full-overlay:focus, 1492 .theme-install-overlay .previous-theme:hover, 1493 .theme-install-overlay .previous-theme:focus, 1494 .theme-install-overlay .next-theme:hover, 1495 .theme-install-overlay .next-theme:focus { 1496 background: #dcdcde; 1497 border-color: #c3c4c7; 1498 color: #000; 1499 outline: none; 1500 box-shadow: none; 1501 } 1502 1503 .theme-install-overlay .close-full-overlay:before { 1504 font: normal 22px/1 dashicons; 1505 content: "\f335"; 1506 position: relative; 1507 top: 7px; 1508 right: 13px; 1509 } 1510 1511 .theme-install-overlay .previous-theme:before { 1512 font: normal 20px/1 dashicons; 1513 content: "\f345"; 1514 position: relative; 1515 top: 6px; 1516 right: 14px; 1517 } 1518 1519 .theme-install-overlay .next-theme:before { 1520 font: normal 20px/1 dashicons; 1521 content: "\f341"; 1522 position: relative; 1523 top: 6px; 1524 right: 13px; 1525 } 1526 1527 .theme-install-overlay .previous-theme.disabled, 1528 .theme-install-overlay .next-theme.disabled, 1529 .theme-install-overlay .previous-theme.disabled:hover, 1530 .theme-install-overlay .previous-theme.disabled:focus, 1531 .theme-install-overlay .next-theme.disabled:hover, 1532 .theme-install-overlay .next-theme.disabled:focus { 1533 color: #c3c4c7; 1534 background: #f0f0f1; 1535 cursor: default; 1536 pointer-events: none; 1537 } 1538 1539 .theme-install-overlay .close-full-overlay, 1540 .theme-install-overlay .previous-theme, 1541 .theme-install-overlay .next-theme { 1542 border-right: 0; 1543 border-top: 0; 1544 border-bottom: 0; 1545 } 1546 1547 .theme-install-overlay .close-full-overlay:before, 1548 .theme-install-overlay .previous-theme:before, 1549 .theme-install-overlay .next-theme:before { 1550 top: 2px; 1551 right: 0; 1552 } 1553 1554 /* Collapse Button */ 1555 .wp-core-ui .wp-full-overlay .collapse-sidebar { 1556 position: fixed; 1557 bottom: 0; 1558 right: 0; 1559 padding: 9px 10px 9px 0; 1560 height: 45px; 1561 color: #646970; 1562 outline: 0; 1563 line-height: 1; 1564 background-color: transparent !important; 1565 border: none !important; 1566 box-shadow: none !important; 1567 border-radius: 0 !important; 1568 } 1569 1570 .wp-core-ui .wp-full-overlay .collapse-sidebar:hover, 1571 .wp-core-ui .wp-full-overlay .collapse-sidebar:focus { 1572 color: #2271b1; 1573 } 1574 1575 .wp-full-overlay .collapse-sidebar-arrow, 1576 .wp-full-overlay .collapse-sidebar-label { 1577 display: inline-block; 1578 vertical-align: middle; 1579 line-height: 1.6; 1580 } 1581 1582 .wp-full-overlay .collapse-sidebar-arrow { 1583 width: 20px; 1584 height: 20px; 1585 margin: 0 2px; /* avoid the focus box-shadow to be cut-off */ 1586 border-radius: 50%; 1587 overflow: hidden; 1588 } 1589 1590 .wp-full-overlay .collapse-sidebar:hover .collapse-sidebar-arrow, 1591 .wp-full-overlay .collapse-sidebar:focus .collapse-sidebar-arrow { 1592 box-shadow: 0 0 0 2px #2271b1; 1593 /* Only visible in Windows High Contrast mode */ 1594 outline: 2px solid transparent; 1595 } 1596 1597 .wp-full-overlay .collapse-sidebar-label { 1598 margin-right: 3px; 1599 } 1600 1601 .wp-full-overlay.collapsed .collapse-sidebar-label { 1602 display: none; 1603 } 1604 1605 .wp-full-overlay .collapse-sidebar-arrow:before { 1606 display: block; 1607 content: "\f148"; 1608 background: #f0f0f1; 1609 font: normal 20px/1 dashicons; 1610 speak: never; 1611 padding: 0; 1612 -webkit-font-smoothing: antialiased; 1613 -moz-osx-font-smoothing: grayscale; 1614 } 1615 1616 .wp-core-ui .wp-full-overlay.collapsed .collapse-sidebar { 1617 padding: 9px 10px; 1618 } 1619 1620 /* rtl:ignore */ 1621 .wp-full-overlay.collapsed .collapse-sidebar-arrow:before, 1622 .rtl .wp-full-overlay .collapse-sidebar-arrow:before { 1623 transform: rotate(180.001deg); /* Firefox: promoting to its own layer to trigger anti-aliasing */ 1624 } 1625 1626 .rtl .wp-full-overlay.collapsed .collapse-sidebar-arrow:before { 1627 transform: none; 1628 } 1629 1630 /* Animations */ 1631 .wp-full-overlay, 1632 .wp-full-overlay-sidebar, 1633 .wp-full-overlay .collapse-sidebar, 1634 .wp-full-overlay-main { 1635 transition-property: right, left, top, bottom, width, margin; 1636 transition-duration: 0.2s; 1637 } 1638 1639 /* Device/preview size toggles */ 1640 1641 .wp-full-overlay { 1642 background: #1d2327; 1643 } 1644 1645 .wp-full-overlay-main { 1646 background-color: #f0f0f1; 1647 } 1648 1649 .expanded .wp-full-overlay-footer { 1650 position: fixed; 1651 bottom: 0; 1652 right: 0; 1653 min-width: 299px; 1654 max-width: 599px; 1655 width: 18%; 1656 width: calc( 18% - 1px ); 1657 height: 45px; 1658 border-top: 1px solid #dcdcde; 1659 background: #f0f0f1; 1660 } 1661 1662 .wp-full-overlay-footer .devices-wrapper { 1663 float: left; 1664 } 1665 1666 .wp-full-overlay-footer .devices { 1667 position: relative; 1668 background: #f0f0f1; 1669 box-shadow: 20px 0 10px -5px #f0f0f1; 1670 } 1671 1672 .wp-full-overlay-footer .devices button { 1673 cursor: pointer; 1674 background: transparent; 1675 border: none; 1676 height: 45px; 1677 padding: 0 3px; 1678 margin: 0 -4px 0 0; 1679 box-shadow: none; 1680 border-top: 1px solid transparent; 1681 border-bottom: 4px solid transparent; 1682 transition: 1683 .15s color ease-in-out, 1684 .15s background-color ease-in-out, 1685 .15s border-color ease-in-out; 1686 } 1687 1688 .wp-full-overlay-footer .devices button:focus { 1689 box-shadow: none; 1690 outline: none; 1691 } 1692 1693 .wp-full-overlay-footer .devices button:before { 1694 display: inline-block; 1695 -webkit-font-smoothing: antialiased; 1696 font: normal 20px/30px "dashicons"; 1697 vertical-align: top; 1698 margin: 3px 0; 1699 padding: 4px 8px; 1700 color: #646970; 1701 } 1702 1703 .wp-full-overlay-footer .devices button.active { 1704 border-bottom-color: #1d2327; 1705 } 1706 1707 .wp-full-overlay-footer .devices button:hover, 1708 .wp-full-overlay-footer .devices button:focus { 1709 background-color: #fff; 1710 } 1711 1712 .wp-full-overlay-footer .devices button:focus, 1713 .wp-full-overlay-footer .devices button.active:hover { 1714 border-bottom-color: #2271b1; 1715 } 1716 1717 .wp-full-overlay-footer .devices button.active:before { 1718 color: #1d2327; 1719 } 1720 1721 .wp-full-overlay-footer .devices button:hover:before, 1722 .wp-full-overlay-footer .devices button:focus:before { 1723 color: #2271b1; 1724 } 1725 1726 .wp-full-overlay-footer .devices .preview-desktop:before { 1727 content: "\f472"; 1728 } 1729 1730 .wp-full-overlay-footer .devices .preview-tablet:before { 1731 content: "\f471"; 1732 } 1733 1734 .wp-full-overlay-footer .devices .preview-mobile:before { 1735 content: "\f470"; 1736 } 1737 1738 @media screen and (max-width: 1024px) { 1739 .wp-full-overlay-footer .devices { 1740 display: none; 1741 } 1742 } 1743 1744 .collapsed .wp-full-overlay-footer .devices button:before { 1745 display: none; 1746 } 1747 1748 .preview-mobile .wp-full-overlay-main { 1749 margin: auto -160px auto 0; 1750 width: 320px; 1751 height: 480px; 1752 max-height: 100%; 1753 max-width: 100%; 1754 right: 50%; 1755 } 1756 1757 .preview-tablet .wp-full-overlay-main { 1758 margin: auto -360px auto 0; 1759 width: 720px; /* Size is loosely based on a typical "tablet" device size. Intentionally ambiguous - this does not represent any particular device precisely. */ 1760 height: 1080px; 1761 max-height: 100%; 1762 max-width: 100%; 1763 right: 50%; 1764 } 1765 1766 1767 /*------------------------------------------------------------------------------ 1768 24.0 - Customize Loader 1769 ------------------------------------------------------------------------------*/ 1770 1771 .no-customize-support .hide-if-no-customize, 1772 .customize-support .hide-if-customize, 1773 .no-customize-support.wp-core-ui .hide-if-no-customize, 1774 .no-customize-support .wp-core-ui .hide-if-no-customize, 1775 .customize-support.wp-core-ui .hide-if-customize, 1776 .customize-support .wp-core-ui .hide-if-customize { 1777 display: none; 1778 } 1779 1780 #customize-container, 1781 #customize-controls .notice.notification-overlay { 1782 background: #f0f0f1; 1783 z-index: 500000; 1784 position: fixed; 1785 overflow: visible; 1786 top: 0; 1787 bottom: 0; 1788 right: 0; 1789 left: 0; 1790 height: 100%; 1791 } 1792 #customize-container { 1793 display: none; 1794 } 1795 1796 /* Make the Customizer and Theme installer overlays the only available content. */ 1797 #customize-container, 1798 .theme-install-overlay { 1799 visibility: visible; 1800 } 1801 1802 .customize-loading #customize-container iframe { 1803 opacity: 0; 1804 } 1805 1806 #customize-container iframe, 1807 .theme-install-overlay iframe { 1808 height: 100%; 1809 width: 100%; 1810 z-index: 20; 1811 transition: opacity 0.3s; 1812 } 1813 1814 #customize-controls { 1815 margin-top: 0; 1816 } 1817 1818 .theme-install-overlay { 1819 display: none; 1820 } 1821 1822 .theme-install-overlay.single-theme { 1823 display: block; 1824 } 1825 1826 .install-theme-info { 1827 display: none; 1828 padding: 10px 20px 60px; 1829 } 1830 1831 .single-theme .install-theme-info { 1832 padding-top: 15px; 1833 } 1834 1835 .theme-install-overlay .install-theme-info { 1836 display: block; 1837 } 1838 1839 .install-theme-info .theme-install { 1840 float: left; 1841 margin-top: 18px; 1842 } 1843 1844 .install-theme-info .theme-name { 1845 font-size: 16px; 1846 line-height: 1.5; 1847 margin-bottom: 0; 1848 margin-top: 0; 1849 } 1850 1851 .install-theme-info .theme-screenshot { 1852 margin: 15px 0; 1853 width: 258px; 1854 border: 1px solid #c3c4c7; 1855 position: relative; 1856 overflow: hidden; 1857 } 1858 1859 .install-theme-info .theme-screenshot > img { 1860 width: 100%; 1861 height: auto; 1862 position: absolute; 1863 right: 0; 1864 top: 0; 1865 } 1866 1867 .install-theme-info .theme-screenshot:after { 1868 content: ""; 1869 display: block; 1870 padding-top: 66.66666666%; 1871 } 1872 1873 .install-theme-info .theme-details { 1874 overflow: hidden; 1875 } 1876 1877 .theme-details .theme-version { 1878 margin: 15px 0; 1879 } 1880 1881 .theme-details .theme-description { 1882 float: right; 1883 color: #646970; 1884 line-height: 1.6; 1885 max-width: 100%; 1886 } 1887 1888 .theme-install-overlay .wp-full-overlay-header .button { 1889 float: left; 1890 margin: 8px 0 0 10px; 1891 } 1892 1893 .theme-install-overlay .wp-full-overlay-sidebar { 1894 background: #f0f0f1; 1895 border-left: 1px solid #dcdcde; 1896 } 1897 1898 .theme-install-overlay .wp-full-overlay-sidebar-content { 1899 background: #fff; 1900 border-top: 1px solid #dcdcde; 1901 border-bottom: 1px solid #dcdcde; 1902 } 1903 1904 .theme-install-overlay .wp-full-overlay-main { 1905 position: absolute; 1906 z-index: 0; 1907 background-color: #f0f0f1; 1908 } 1909 1910 .customize-loading #customize-container { 1911 background-color: #f0f0f1; 1912 } 1913 1914 #customize-preview.wp-full-overlay-main:before, 1915 .customize-loading #customize-container:before, 1916 #customize-controls .notice.notification-overlay.notification-loading:before, 1917 .theme-install-overlay .wp-full-overlay-main:before { 1918 content: ""; 1919 display: block; 1920 width: 20px; 1921 height: 20px; 1922 position: absolute; 1923 right: 50%; 1924 top: 50%; 1925 z-index: -1; 1926 margin: -10px -10px 0 0; 1927 transform: translateZ(0); 1928 background: transparent url(../images/spinner.gif) no-repeat center center; 1929 background-size: 20px 20px; 1930 } 1931 1932 #customize-preview.wp-full-overlay-main.iframe-ready:before, 1933 .theme-install-overlay.iframe-ready .wp-full-overlay-main:before { 1934 background-image: none; 1935 } 1936 1937 /* =Media Queries 1938 -------------------------------------------------------------- */ 1939 1940 /** 1941 * HiDPI Displays 1942 */ 1943 @media print, 1944 (min-resolution: 120dpi) { 1945 .wp-full-overlay .collapse-sidebar-arrow { 1946 background-image: url(../images/arrows-2x.png); 1947 background-size: 15px 123px; 1948 } 1949 1950 #customize-preview.wp-full-overlay-main:before, 1951 .customize-loading #customize-container:before, 1952 #customize-controls .notice.notification-overlay.notification-loading:before, 1953 .theme-install-overlay .wp-full-overlay-main:before { 1954 background-image: url(../images/spinner-2x.gif); 1955 } 1956 } 1957 1958 @media screen and (max-width: 782px) { 1959 .available-theme .action-links .delete-theme { 1960 float: none; 1961 margin: 0; 1962 padding: 0; 1963 clear: both; 1964 } 1965 1966 .available-theme .action-links .delete-theme a { 1967 padding: 0; 1968 } 1969 1970 .broken-themes table { 1971 width: 100%; 1972 } 1973 1974 .theme-install-overlay .wp-full-overlay-header .button { 1975 font-size: 13px; 1976 line-height: 2.15384615; 1977 min-height: 30px; 1978 } 1979 1980 .theme-browser .theme .theme-actions .button { 1981 margin-bottom: 0; 1982 } 1983 1984 .theme-browser .theme.active .theme-actions, 1985 .theme-browser .theme .theme-actions { 1986 padding-top: 4px; 1987 padding-bottom: 4px; 1988 } 1989 1990 .upload-theme .wp-upload-form, 1991 .upload-plugin .wp-upload-form { 1992 display: block; 1993 } 1994 } 1995 1996 @media aural { 1997 .theme .notice:before, 1998 .theme-info .updating-message:before, 1999 .theme-info .updated-message:before, 2000 .theme-install.updating-message:before { 2001 speak: never; 2002 } 2003 }
title
Description
Body
title
Description
Body
title
Description
Body
title
Body
Generated : Thu Mar 28 08:20:01 2024 | Cross-referenced by PHPXref |