[ Index ] |
PHP Cross Reference of WordPress Trunk (Updated Daily) |
[Summary view] [Print] [Text view]
1 /*! This file is auto-generated */ 2 /*------------------------------------------------------------------------------ 3 14.0 - Media Screen 4 ------------------------------------------------------------------------------*/ 5 6 .media-item .describe { 7 border-collapse: collapse; 8 width: 100%; 9 border-top: 1px solid #dcdcde; 10 clear: both; 11 cursor: default; 12 } 13 14 .media-item.media-blank .describe { 15 border: 0; 16 } 17 18 .media-item .describe th { 19 vertical-align: top; 20 text-align: right; 21 padding: 5px 10px 10px; 22 width: 140px; 23 } 24 25 .media-item .describe .align th { 26 padding-top: 0; 27 } 28 29 .media-item .media-item-info tr { 30 background-color: transparent; 31 } 32 33 .media-item .describe td { 34 padding: 0 0 8px 8px; 35 vertical-align: top; 36 } 37 38 .media-item thead.media-item-info td { 39 padding: 4px 10px 0; 40 } 41 42 .media-item .media-item-info .A1B1 { 43 padding: 0 10px 0 0; 44 } 45 46 .media-item td.savesend { 47 padding-bottom: 15px; 48 } 49 50 .media-item .thumbnail { 51 max-height: 128px; 52 max-width: 128px; 53 } 54 55 .media-list-subtitle { 56 display: block; 57 } 58 59 .media-list-title { 60 display: block; 61 } 62 63 #wpbody-content #async-upload-wrap a { 64 display: none; 65 } 66 67 .media-upload-form { 68 margin-top: 20px; 69 } 70 71 .media-upload-form td label { 72 margin-left: 6px; 73 margin-right: 2px; 74 } 75 76 .media-upload-form .align .field label { 77 display: inline; 78 padding: 0 23px 0 0; 79 margin: 0 3px 0 1em; 80 font-weight: 600; 81 } 82 83 .media-upload-form tr.image-size label { 84 margin: 0 5px 0 0; 85 font-weight: 600; 86 } 87 88 .media-upload-form th.label label { 89 font-weight: 600; 90 margin: 0.5em; 91 font-size: 13px; 92 } 93 94 .media-upload-form th.label label span { 95 padding: 0 5px; 96 } 97 98 .media-item .describe input[type="text"], 99 .media-item .describe textarea { 100 width: 460px; 101 } 102 103 .media-item .describe p.help { 104 margin: 0; 105 padding: 0 5px 0 0; 106 } 107 108 .describe-toggle-on, 109 .describe-toggle-off { 110 display: block; 111 line-height: 2.76923076; 112 float: left; 113 margin-left: 10px; 114 } 115 116 .media-item .attachment-tools { 117 display: flex; 118 align-items: center; 119 } 120 121 .media-item .edit-attachment { 122 padding: 14px 0; 123 display: block; 124 margin-left: 10px; 125 } 126 127 .media-item .edit-attachment.copy-to-clipboard-container { 128 display: flex; 129 margin-top: 0; 130 } 131 132 .media-item-copy-container .success { 133 line-height: 0; 134 } 135 136 .media-item button .copy-attachment-url { 137 margin-top: 14px; 138 } 139 140 .media-item .copy-to-clipboard-container { 141 margin-top: 7px; 142 } 143 144 .media-item .describe-toggle-off, 145 .media-item.open .describe-toggle-on { 146 display: none; 147 } 148 149 .media-item.open .describe-toggle-off { 150 display: block; 151 } 152 153 .media-upload-form .media-item { 154 min-height: 70px; 155 margin-bottom: 1px; 156 position: relative; 157 width: 100%; 158 background: #fff; 159 } 160 161 .media-upload-form .media-item, 162 .media-upload-form .media-item .error { 163 box-shadow: 0 1px 0 #dcdcde; 164 } 165 166 #media-items:empty { 167 border: 0 none; 168 } 169 170 .media-item .filename { 171 padding: 14px 0; 172 overflow: hidden; 173 margin-right: 6px; 174 } 175 176 .media-item .pinkynail { 177 float: right; 178 margin: 0 0 0 10px; 179 max-height: 70px; 180 max-width: 70px; 181 } 182 183 .media-item .startopen, 184 .media-item .startclosed { 185 display: none; 186 } 187 188 .media-item .progress { 189 display: inline-block; 190 height: 22px; 191 margin: 0 6px 7px; 192 width: 200px; 193 line-height: 2em; 194 padding: 0; 195 overflow: hidden; 196 border-radius: 22px; 197 background: #dcdcde; 198 box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); 199 } 200 201 .media-item .bar { 202 z-index: 9; 203 width: 0; 204 height: 100%; 205 margin-top: -22px; 206 border-radius: 22px; 207 background-color: #2271b1; 208 box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.3); 209 } 210 211 .media-item .progress .percent { 212 z-index: 10; 213 position: relative; 214 width: 200px; 215 padding: 0; 216 color: #fff; 217 text-align: center; 218 line-height: 22px; 219 font-weight: 400; 220 text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); 221 } 222 223 .upload-php .fixed .column-parent { 224 width: 15%; 225 } 226 227 .js .html-uploader #plupload-upload-ui { 228 display: none; 229 } 230 231 .js .html-uploader #html-upload-ui { 232 display: block; 233 } 234 235 #html-upload-ui #async-upload { 236 font-size: 1em; 237 } 238 239 .media-upload-form .media-item.error, 240 .media-upload-form .media-item .error { 241 width: auto; 242 margin: 0 0 1px; 243 } 244 245 .media-upload-form .media-item .error { 246 padding: 10px 14px 10px 0; 247 min-height: 50px; 248 } 249 250 .media-item .error-div button.dismiss { 251 float: left; 252 margin: 0 15px 0 10px; 253 } 254 255 /*------------------------------------------------------------------------------ 256 14.1 - Media Library 257 ------------------------------------------------------------------------------*/ 258 259 .find-box { 260 background-color: #fff; 261 box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3); 262 width: 600px; 263 overflow: hidden; 264 margin-right: -300px; 265 position: fixed; 266 top: 30px; 267 bottom: 30px; 268 right: 50%; 269 z-index: 100105; 270 } 271 272 .find-box-head { 273 background: #fff; 274 border-bottom: 1px solid #dcdcde; 275 height: 36px; 276 font-size: 18px; 277 font-weight: 600; 278 line-height: 2; 279 padding: 0 16px 0 36px; 280 position: absolute; 281 top: 0; 282 right: 0; 283 left: 0; 284 } 285 286 .find-box-inside { 287 overflow: auto; 288 padding: 16px; 289 background-color: #fff; 290 position: absolute; 291 top: 37px; 292 bottom: 45px; 293 overflow-y: scroll; 294 width: 100%; 295 box-sizing: border-box; 296 } 297 298 .find-box-search { 299 padding-bottom: 16px; 300 } 301 302 .find-box-search .spinner { 303 float: none; 304 right: 105px; 305 position: absolute; 306 } 307 308 .find-box-search, 309 #find-posts-response { 310 position: relative; /* RTL fix, #WP28010 */ 311 } 312 313 #find-posts-input, 314 #find-posts-search { 315 float: right; 316 } 317 318 #find-posts-input { 319 width: 140px; 320 height: 28px; 321 margin: 0 0 0 4px; 322 } 323 324 .widefat .found-radio { 325 padding-left: 0; 326 width: 16px; 327 } 328 329 #find-posts-close { 330 width: 36px; 331 height: 36px; 332 border: none; 333 padding: 0; 334 position: absolute; 335 top: 0; 336 left: 0; 337 cursor: pointer; 338 text-align: center; 339 background: none; 340 color: #646970; 341 } 342 343 #find-posts-close:hover, 344 #find-posts-close:focus { 345 color: #135e96; 346 } 347 348 #find-posts-close:focus { 349 box-shadow: 0 0 0 2px #2271b1; 350 /* Only visible in Windows High Contrast mode */ 351 outline: 2px solid transparent; 352 outline-offset: -2px; 353 } 354 355 #find-posts-close:before { 356 font: normal 20px/36px dashicons; 357 vertical-align: top; 358 speak: never; 359 -webkit-font-smoothing: antialiased; 360 -moz-osx-font-smoothing: grayscale; 361 content: "\f158"; 362 } 363 364 .find-box-buttons { 365 padding: 8px 16px; 366 background: #fff; 367 border-top: 1px solid #dcdcde; 368 position: absolute; 369 bottom: 0; 370 right: 0; 371 left: 0; 372 } 373 374 @media screen and (max-width: 782px) { 375 .find-box-inside { 376 bottom: 57px; 377 } 378 } 379 380 @media screen and (max-width: 660px) { 381 382 .find-box { 383 top: 0; 384 bottom: 0; 385 right: 0; 386 left: 0; 387 margin: 0; 388 width: 100%; 389 } 390 391 } 392 393 .ui-find-overlay { 394 position: fixed; 395 top: 0; 396 right: 0; 397 left: 0; 398 bottom: 0; 399 background: #000; 400 opacity: 0.7; 401 filter: alpha(opacity=70); 402 z-index: 100100; 403 } 404 405 .drag-drop #drag-drop-area { 406 border: 4px dashed #c3c4c7; 407 height: 200px; 408 } 409 410 .drag-drop .drag-drop-inside { 411 margin: 60px auto 0; 412 width: 250px; 413 } 414 415 .drag-drop-inside p { 416 font-size: 14px; 417 margin: 5px 0; 418 display: none; 419 } 420 421 .drag-drop .drag-drop-inside p { 422 text-align: center; 423 } 424 425 .drag-drop-inside p.drag-drop-info { 426 font-size: 20px; 427 } 428 429 .drag-drop .drag-drop-inside p, 430 .drag-drop-inside p.drag-drop-buttons { 431 display: block; 432 } 433 434 /* 435 #drag-drop-area:-moz-drag-over { 436 border-color: #83b4d8; 437 } 438 border color while dragging a file over the uploader drop area */ 439 .drag-drop.drag-over #drag-drop-area { 440 border-color: #9ec2e6; 441 } 442 443 #plupload-upload-ui { 444 position: relative; 445 } 446 447 .post-type-attachment .wp-filter select { 448 margin: 0 0 0 6px; 449 } 450 451 /** 452 * Media Library grid view 453 */ 454 455 .media-frame.mode-grid, 456 .media-frame.mode-grid .media-frame-content, 457 .media-frame.mode-grid .attachments-browser:not(.has-load-more) .attachments, 458 .media-frame.mode-grid .attachments-browser.has-load-more .attachments-wrapper, 459 .media-frame.mode-grid .uploader-inline-content { 460 position: static; 461 } 462 463 /* Regions we don't use at all */ 464 .media-frame.mode-grid .media-frame-title, 465 .media-frame.mode-grid .media-frame-router, 466 .media-frame.mode-grid .media-frame-menu { 467 display: none; 468 } 469 470 .media-frame.mode-grid .media-frame-content { 471 background-color: transparent; 472 border: none; 473 } 474 475 .upload-php .mode-grid .media-sidebar { 476 position: relative; 477 width: auto; 478 margin-top: 12px; 479 padding: 0 16px; 480 border-right: 4px solid #d63638; 481 box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1); 482 background-color: #fff; 483 } 484 485 .upload-php .mode-grid .hide-sidebar .media-sidebar { 486 display: none; 487 } 488 489 .upload-php .mode-grid .media-sidebar .media-uploader-status { 490 border-bottom: none; 491 padding-bottom: 0; 492 max-width: 100%; 493 } 494 495 .upload-php .mode-grid .media-sidebar .upload-error { 496 margin: 12px 0; 497 padding: 4px 0 0; 498 border: none; 499 box-shadow: none; 500 background: none; 501 } 502 503 .upload-php .mode-grid .media-sidebar .media-uploader-status.errors h2 { 504 display: none; 505 } 506 507 .media-frame.mode-grid .uploader-inline { 508 position: relative; 509 top: auto; 510 left: auto; 511 right: auto; 512 bottom: auto; 513 padding-top: 0; 514 margin-top: 20px; 515 border: 4px dashed #c3c4c7; 516 } 517 518 .media-frame.mode-select .attachments-browser.fixed:not(.has-load-more) .attachments, 519 .media-frame.mode-select .attachments-browser.has-load-more.fixed .attachments-wrapper { 520 position: relative; 521 top: 94px; /* prevent jumping up when the toolbar becomes fixed */ 522 padding-bottom: 94px; /* offset for above so the bottom doesn't get cut off */ 523 } 524 525 .media-frame.mode-grid .attachment:focus, 526 .media-frame.mode-grid .selected.attachment:focus, 527 .media-frame.mode-grid .attachment.details:focus { 528 box-shadow: inset 0 0 0 2px #2271b1; 529 /* Only visible in Windows High Contrast mode */ 530 outline: 2px solid transparent; 531 outline-offset: -6px; 532 } 533 534 .media-frame.mode-grid .selected.attachment { 535 box-shadow: 536 inset 0 0 0 5px #f0f0f1, 537 inset 0 0 0 7px #c3c4c7; 538 } 539 540 .media-frame.mode-grid .attachment.details { 541 box-shadow: 542 inset 0 0 0 3px #f0f0f1, 543 inset 0 0 0 7px #4f94d4; 544 } 545 546 .media-frame.mode-grid.mode-select .attachment .thumbnail { 547 opacity: 0.65; 548 } 549 550 .media-frame.mode-select .attachment.selected .thumbnail { 551 opacity: 1; 552 } 553 554 .media-frame.mode-grid .media-toolbar { 555 margin-bottom: 15px; 556 height: auto; 557 } 558 559 .media-frame.mode-grid .media-toolbar select { 560 margin: 0 0 0 10px; 561 } 562 563 .media-frame.mode-grid.mode-edit .media-toolbar-secondary > .select-mode-toggle-button { 564 margin: 0 0 0 8px; 565 vertical-align: middle; 566 } 567 568 .media-frame.mode-grid .attachments-browser .bulk-select { 569 display: inline-block; 570 margin: 0 0 0 10px; 571 } 572 573 .media-frame.mode-grid .search { 574 margin-top: 0; 575 } 576 577 .media-frame-content .media-search-input-label { 578 vertical-align: baseline; 579 } 580 581 .attachments-browser .media-toolbar-secondary > .media-button { 582 margin-left: 10px; 583 } 584 585 .media-frame.mode-select .attachments-browser.fixed .media-toolbar { 586 position: fixed; 587 top: 32px; 588 right: auto; 589 left: 20px; 590 margin-top: 0; 591 } 592 593 .media-frame.mode-grid .attachments-browser { 594 padding: 0; 595 } 596 597 .media-frame.mode-grid .attachments-browser .attachments { 598 padding: 2px; 599 } 600 601 .media-frame.mode-grid .attachments-browser .no-media { 602 color: #646970; /* same as no plugins and no themes */ 603 font-size: 18px; 604 font-style: normal; 605 margin: 0; 606 padding: 100px 0 0; 607 text-align: center; 608 } 609 610 /** 611 * Attachment details modal 612 */ 613 614 .edit-attachment-frame { 615 display: block; 616 height: 100%; 617 width: 100%; 618 } 619 620 .edit-attachment-frame .edit-media-header { 621 overflow: hidden; 622 } 623 624 .upload-php .media-modal-close .media-modal-icon:before { 625 content: "\f335"; 626 font-size: 22px; 627 } 628 629 .upload-php .media-modal-close, 630 .edit-attachment-frame .edit-media-header .left, 631 .edit-attachment-frame .edit-media-header .right { 632 cursor: pointer; 633 color: #787c82; 634 background-color: transparent; 635 height: 50px; 636 width: 50px; 637 padding: 0; 638 position: absolute; 639 text-align: center; 640 border: 0; 641 border-right: 1px solid #dcdcde; 642 transition: color .1s ease-in-out, background .1s ease-in-out; 643 } 644 645 .upload-php .media-modal-close { 646 top: 0; 647 left: 0; 648 } 649 650 .edit-attachment-frame .edit-media-header .left { 651 left: 102px; 652 } 653 654 .edit-attachment-frame .edit-media-header .right { 655 left: 51px; 656 } 657 658 .edit-attachment-frame .media-frame-title { 659 right: 0; 660 left: 150px; /* leave space for prev/next/close */ 661 } 662 663 .edit-attachment-frame .edit-media-header .right:before, 664 .edit-attachment-frame .edit-media-header .left:before { 665 font: normal 20px/50px dashicons !important; 666 display: inline; 667 font-weight: 300; 668 } 669 670 .upload-php .media-modal-close:hover, 671 .upload-php .media-modal-close:focus, 672 .edit-attachment-frame .edit-media-header .left:hover, 673 .edit-attachment-frame .edit-media-header .right:hover, 674 .edit-attachment-frame .edit-media-header .left:focus, 675 .edit-attachment-frame .edit-media-header .right:focus { 676 background: #dcdcde; 677 border-color: #c3c4c7; 678 color: #000; 679 outline: none; 680 box-shadow: none; 681 } 682 683 .upload-php .media-modal-close:focus, 684 .edit-attachment-frame .edit-media-header .left:focus, 685 .edit-attachment-frame .edit-media-header .right:focus { 686 /* Only visible in Windows High Contrast mode */ 687 outline: 2px solid transparent; 688 outline-offset: -2px; 689 } 690 691 .upload-php .media-modal-close:focus .media-modal-icon:before, 692 .upload-php .media-modal-close:hover .media-modal-icon:before { 693 color: #000; 694 } 695 696 .edit-attachment-frame .edit-media-header .left:before { 697 content: "\f345"; 698 } 699 700 .edit-attachment-frame .edit-media-header .right:before { 701 content: "\f341"; 702 } 703 704 .edit-attachment-frame .edit-media-header [disabled], 705 .edit-attachment-frame .edit-media-header [disabled]:hover { 706 color: #c3c4c7; 707 background: inherit; 708 cursor: default; 709 } 710 711 .edit-attachment-frame .media-frame-content, 712 .edit-attachment-frame .media-frame-router { 713 right: 0; 714 } 715 716 .edit-attachment-frame .media-frame-content { 717 border-bottom: none; 718 bottom: 0; 719 top: 50px; 720 } 721 722 .edit-attachment-frame .attachment-details { 723 position: absolute; 724 overflow: auto; 725 top: 0; 726 bottom: 0; 727 left: 0; 728 right: 0; 729 box-shadow: inset 0 4px 4px -4px rgba(0, 0, 0, 0.1); 730 } 731 732 .edit-attachment-frame .attachment-media-view { 733 float: right; 734 width: 65%; 735 height: 100%; 736 } 737 738 .edit-attachment-frame .attachment-media-view .thumbnail { 739 box-sizing: border-box; 740 padding: 16px; 741 height: 100%; 742 } 743 744 .edit-attachment-frame .attachment-media-view .details-image { 745 display: block; 746 margin: 0 auto 16px; 747 max-width: 100%; 748 max-height: 90%; 749 max-height: calc( 100% - 42px ); /* leave space for actions underneath */ 750 background-image: linear-gradient(-45deg, #c3c4c7 25%, transparent 25%, transparent 75%, #c3c4c7 75%, #c3c4c7), linear-gradient(-45deg, #c3c4c7 25%, transparent 25%, transparent 75%, #c3c4c7 75%, #c3c4c7); 751 background-position: 100% 0, 10px 10px; 752 background-size: 20px 20px; 753 } 754 755 .edit-attachment-frame .attachment-media-view .details-image.icon { 756 background: none; 757 } 758 759 .edit-attachment-frame .attachment-media-view .attachment-actions { 760 text-align: center; 761 } 762 763 .edit-attachment-frame .wp-media-wrapper { 764 margin-bottom: 12px; 765 } 766 767 .edit-attachment-frame input, 768 .edit-attachment-frame textarea { 769 padding: 4px 8px; 770 line-height: 1.42857143; 771 } 772 773 .edit-attachment-frame .attachment-info { 774 overflow: auto; 775 box-sizing: border-box; 776 margin-bottom: 0; 777 padding: 12px 16px 0; 778 width: 35%; 779 height: 100%; 780 box-shadow: inset 0 4px 4px -4px rgba(0, 0, 0, 0.1); 781 border-bottom: 0; 782 border-right: 1px solid #dcdcde; 783 background: #f6f7f7; 784 } 785 786 .edit-attachment-frame .attachment-info .details, 787 .edit-attachment-frame .attachment-info .settings { 788 position: relative; /* RTL fix, #WP29352 */ 789 overflow: hidden; 790 float: none; 791 margin-bottom: 15px; 792 padding-bottom: 15px; 793 border-bottom: 1px solid #dcdcde; 794 } 795 796 .edit-attachment-frame .attachment-info .filename { 797 font-weight: 400; 798 color: #646970; 799 } 800 801 .edit-attachment-frame .attachment-info .thumbnail { 802 margin-bottom: 12px; 803 } 804 805 .attachment-info .actions { 806 margin-bottom: 16px; 807 } 808 809 .attachment-info .actions a { 810 display: inline; 811 text-decoration: none; 812 } 813 814 .copy-to-clipboard-container { 815 display: flex; 816 align-items: center; 817 margin-top: 8px; 818 clear: both; 819 } 820 821 .copy-to-clipboard-container .copy-attachment-url { 822 white-space: normal; 823 } 824 825 .copy-to-clipboard-container .success { 826 color: #007017; 827 margin-right: 8px; 828 } 829 830 /*------------------------------------------------------------------------------ 831 14.2 - Image Editor 832 ------------------------------------------------------------------------------*/ 833 .wp_attachment_details .attachment-alt-text { 834 margin-bottom: 5px; 835 } 836 837 .wp_attachment_details #attachment_alt { 838 max-width: 500px; 839 height: 3.28571428em; 840 } 841 842 .wp_attachment_details .attachment-alt-text-description { 843 margin-top: 5px; 844 } 845 846 .wp_attachment_details label[for="content"] { 847 font-size: 13px; 848 line-height: 1.5; 849 margin: 1em 0; 850 } 851 852 .wp_attachment_details #attachment_caption { 853 height: 4em; 854 } 855 856 .describe .image-editor { 857 vertical-align: top; 858 } 859 860 .imgedit-wrap { 861 position: relative; 862 padding-top: 10px; 863 } 864 865 .image-editor p, 866 .image-editor fieldset { 867 margin: 8px 0; 868 } 869 870 .image-editor legend { 871 margin-bottom: 5px; 872 } 873 874 .describe .imgedit-wrap .image-editor { 875 padding: 0 5px; 876 } 877 878 .wp_attachment_holder div.updated { 879 margin-top: 0; 880 } 881 882 .wp_attachment_holder .imgedit-wrap > div { 883 height: auto; 884 } 885 886 .imgedit-panel-content { 887 display: flex; 888 flex-wrap: wrap; 889 gap: 20px; 890 margin-bottom: 20px; 891 } 892 893 .imgedit-settings { 894 max-width: 240px; /* Prevent reflow when help info is expanded. */ 895 } 896 897 .imgedit-group-controls > * { 898 display: none; 899 } 900 901 .imgedit-panel-active .imgedit-group-controls > * { 902 display: block; 903 } 904 905 .wp_attachment_holder .imgedit-wrap .image-editor { 906 float: left; 907 width: 250px; 908 } 909 910 .image-editor input { 911 margin-top: 0; 912 vertical-align: middle; 913 } 914 915 .imgedit-wait { 916 position: absolute; 917 top: 0; 918 bottom: 0; 919 width: 100%; 920 background: #fff; 921 opacity: 0.7; 922 filter: alpha(opacity=70); 923 display: none; 924 } 925 926 .imgedit-wait:before { 927 content: ""; 928 display: block; 929 width: 20px; 930 height: 20px; 931 position: absolute; 932 right: 50%; 933 top: 50%; 934 margin: -10px -10px 0 0; 935 background: transparent url(../images/spinner.gif) no-repeat center; 936 background-size: 20px 20px; 937 transform: translateZ(0); 938 } 939 940 .no-float { 941 float: none; 942 } 943 944 .media-disabled, 945 .image-editor .disabled { 946 /* WCAG 1.4.3 Text or images of text that are part of an inactive user 947 interface component ... have no contrast requirement. */ 948 color: #a7aaad; 949 } 950 951 .A1B1 { 952 overflow: hidden; 953 } 954 955 .wp_attachment_image .button, 956 .A1B1 .button { 957 float: right; 958 } 959 960 .no-js .wp_attachment_image .button { 961 display: none; 962 } 963 964 .wp_attachment_image .spinner, 965 .A1B1 .spinner { 966 float: right; 967 } 968 969 .imgedit-menu .note-no-rotate { 970 clear: both; 971 margin: 0; 972 padding: 1em 0 0; 973 } 974 975 .image-editor .imgedit-menu .button { 976 display: inline-block; 977 width: auto; 978 min-height: 28px; 979 font-size: 13px; 980 line-height: 2; 981 padding: 0 10px; 982 } 983 984 .imgedit-menu .button:after, 985 .imgedit-menu .button:before { 986 font: normal 16px/1 dashicons; 987 margin-left: 8px; 988 speak: never; 989 vertical-align: middle; 990 position: relative; 991 top: -2px; 992 -webkit-font-smoothing: antialiased; 993 -moz-osx-font-smoothing: grayscale; 994 } 995 996 .imgedit-menu .imgedit-rotate.button:after { 997 content: '\f140'; 998 margin-right: 2px; 999 margin-left: 0; 1000 } 1001 1002 .imgedit-menu .imgedit-rotate.button[aria-expanded="true"]:after { 1003 content: '\f142'; 1004 } 1005 1006 .imgedit-menu .button.disabled { 1007 color: #a7aaad; 1008 border-color: #dcdcde; 1009 background: #f6f7f7; 1010 box-shadow: none; 1011 text-shadow: 0 1px 0 #fff; 1012 cursor: default; 1013 transform: none; 1014 } 1015 1016 .imgedit-crop:before { 1017 content: "\f165"; 1018 } 1019 1020 .imgedit-scale:before { 1021 content: "\f211"; 1022 } 1023 1024 .imgedit-rotate:before { 1025 content: "\f167"; 1026 } 1027 1028 .imgedit-undo:before { 1029 content: "\f171"; 1030 } 1031 1032 .imgedit-redo:before { 1033 content: "\f172"; 1034 } 1035 1036 .imgedit-crop-wrap { 1037 position: relative; 1038 } 1039 1040 .imgedit-crop-wrap img { 1041 background-image: linear-gradient(-45deg, #c3c4c7 25%, transparent 25%, transparent 75%, #c3c4c7 75%, #c3c4c7), linear-gradient(-45deg, #c3c4c7 25%, transparent 25%, transparent 75%, #c3c4c7 75%, #c3c4c7); 1042 background-position: 100% 0, 10px 10px; 1043 background-size: 20px 20px; 1044 } 1045 1046 .imgedit-crop-wrap { 1047 padding: 20px; 1048 background-image: linear-gradient(-45deg, #c3c4c7 25%, transparent 25%, transparent 75%, #c3c4c7 75%, #c3c4c7), linear-gradient(-45deg, #c3c4c7 25%, transparent 25%, transparent 75%, #c3c4c7 75%, #c3c4c7); 1049 background-position: 100% 0, 10px 10px; 1050 background-size: 20px 20px; 1051 } 1052 1053 1054 .imgedit-crop { 1055 margin: 0 0 0 8px; 1056 } 1057 1058 .imgedit-rotate { 1059 margin: 0 3px 0 8px; 1060 } 1061 1062 .imgedit-undo { 1063 margin: 0 3px; 1064 } 1065 1066 .imgedit-redo { 1067 margin: 0 3px 0 8px; 1068 } 1069 1070 .imgedit-thumbnail-preview-group { 1071 display: flex; 1072 flex-wrap: wrap; 1073 column-gap: 10px; 1074 } 1075 1076 .imgedit-thumbnail-preview { 1077 margin: 10px 0 0 8px; 1078 } 1079 1080 .imgedit-thumbnail-preview-caption { 1081 display: block; 1082 } 1083 1084 #poststuff .imgedit-group-top h2 { 1085 display: inline-block; 1086 margin: 0; 1087 padding: 0; 1088 font-size: 14px; 1089 line-height: 1.4; 1090 } 1091 1092 #poststuff .imgedit-group-top .button-link { 1093 text-decoration: none; 1094 color: #1d2327; 1095 } 1096 1097 .imgedit-applyto .imgedit-label { 1098 display: block; 1099 padding: .5em 0 0; 1100 } 1101 1102 .imgedit-popup-menu, 1103 .imgedit-help { 1104 display: none; 1105 padding-bottom: 8px; 1106 } 1107 1108 .imgedit-panel-tools > .imgedit-menu { 1109 display: flex; 1110 column-gap: 4px; 1111 align-items: flex-start; 1112 flex-wrap: wrap; 1113 } 1114 1115 .imgedit-popup-menu { 1116 width: calc( 100% - 20px ); 1117 position: absolute; 1118 background: #fff; 1119 padding: 10px; 1120 box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3); 1121 } 1122 1123 .image-editor .imgedit-menu .imgedit-popup-menu button { 1124 display: block; 1125 margin: 2px 0; 1126 width: 100%; 1127 white-space: break-spaces; 1128 line-height: 1.5; 1129 padding-top: 3px; 1130 padding-bottom: 2px; 1131 } 1132 1133 .imgedit-rotate-menu-container { 1134 position: relative; 1135 } 1136 1137 .imgedit-help.imgedit-restore { 1138 padding-bottom: 0; 1139 } 1140 1141 /* higher specificity than buttons */ 1142 .image-editor .imgedit-settings .imgedit-help-toggle, 1143 .image-editor .imgedit-settings .imgedit-help-toggle:hover, 1144 .image-editor .imgedit-settings .imgedit-help-toggle:active { 1145 border: 1px solid transparent; 1146 margin: -1px -1px 0 0; 1147 padding: 0; 1148 background: transparent; 1149 color: #2271b1; 1150 font-size: 20px; 1151 line-height: 1; 1152 cursor: pointer; 1153 box-sizing: content-box; 1154 box-shadow: none; 1155 } 1156 1157 .image-editor .imgedit-settings .imgedit-help-toggle:focus { 1158 color: #2271b1; 1159 border-color: #2271b1; 1160 box-shadow: 0 0 0 1px #2271b1; 1161 /* Only visible in Windows High Contrast mode */ 1162 outline: 2px solid transparent; 1163 } 1164 1165 .form-table td.imgedit-response { 1166 padding: 0; 1167 } 1168 1169 .imgedit-submit-btn { 1170 margin-right: 20px; 1171 } 1172 1173 .imgedit-wrap .nowrap { 1174 white-space: nowrap; 1175 font-size: 12px; 1176 line-height: inherit; 1177 } 1178 1179 span.imgedit-scale-warn { 1180 display: flex; 1181 align-items: center; 1182 margin: 4px; 1183 gap: 4px; 1184 color: #b32d2e; 1185 font-style: normal; 1186 visibility: hidden; 1187 vertical-align: middle; 1188 } 1189 1190 .imgedit-save-target { 1191 margin: 8px 0; 1192 } 1193 1194 .imgedit-save-target legend { 1195 font-weight: 600; 1196 } 1197 1198 .imgedit-group { 1199 margin-bottom: 20px; 1200 } 1201 1202 .image-editor .imgedit-original-dimensions { 1203 display: inline-block; 1204 } 1205 1206 .image-editor .imgedit-scale-controls input[type="text"], 1207 .image-editor .imgedit-crop-ratio input[type="text"], 1208 .image-editor .imgedit-crop-sel input[type="text"], 1209 .image-editor .imgedit-scale-controls input[type="number"], 1210 .image-editor .imgedit-crop-ratio input[type="number"], 1211 .image-editor .imgedit-crop-sel input[type="number"] { 1212 width: 80px; 1213 font-size: 14px; 1214 padding: 0 8px; 1215 } 1216 1217 .imgedit-separator { 1218 display: inline-block; 1219 width: 7px; 1220 text-align: center; 1221 font-size: 13px; 1222 color: #3c434a; 1223 } 1224 1225 .image-editor .imgedit-scale-button-wrapper { 1226 margin-top: 0.3077em; 1227 display: block; 1228 } 1229 1230 .image-editor .imgedit-scale-controls .button { 1231 margin-bottom: 0; 1232 } 1233 1234 audio, video { 1235 display: inline-block; 1236 max-width: 100%; 1237 } 1238 1239 .wp-core-ui .mejs-container { 1240 width: 100%; 1241 max-width: 100%; 1242 } 1243 1244 .wp-core-ui .mejs-container * { 1245 box-sizing: border-box; 1246 } 1247 1248 .wp-core-ui .mejs-time { 1249 box-sizing: content-box; 1250 } 1251 1252 /* =Media Queries 1253 -------------------------------------------------------------- */ 1254 1255 /** 1256 * HiDPI Displays 1257 */ 1258 @media print, 1259 (min-resolution: 120dpi) { 1260 .imgedit-wait:before { 1261 background-image: url(../images/spinner-2x.gif); 1262 } 1263 } 1264 1265 @media screen and (max-width: 782px) { 1266 .edit-attachment-frame input, 1267 .edit-attachment-frame textarea { 1268 line-height: 1.5; 1269 } 1270 1271 .wp_attachment_details label[for="content"] { 1272 font-size: 14px; 1273 line-height: 1.5; 1274 } 1275 1276 .wp_attachment_details textarea { 1277 line-height: 1.5; 1278 } 1279 1280 .wp_attachment_details #attachment_alt { 1281 height: 3.375em; 1282 } 1283 1284 .media-upload-form .media-item.error, 1285 .media-upload-form .media-item .error { 1286 font-size: 13px; 1287 line-height: 1.5; 1288 } 1289 1290 .media-upload-form .media-item.error { 1291 padding: 1px 10px; 1292 } 1293 1294 .media-upload-form .media-item .error { 1295 padding: 10px 12px 10px 0; 1296 } 1297 1298 .image-editor .imgedit-scale input[type="text"], 1299 .image-editor .imgedit-crop-ratio input[type="text"], 1300 .image-editor .imgedit-crop-sel input[type="text"] { 1301 font-size: 16px; 1302 padding: 6px 10px; 1303 } 1304 1305 .wp_attachment_holder .imgedit-wrap .imgedit-panel-content, 1306 .wp_attachment_holder .imgedit-wrap .image-editor { 1307 float: none; 1308 width: auto; 1309 max-width: none; 1310 padding-bottom: 16px; 1311 } 1312 1313 .copy-to-clipboard-container .success { 1314 font-size: 14px; 1315 } 1316 1317 /* Restructure image editor on narrow viewports. */ 1318 .imgedit-crop-wrap img{ 1319 width: 100%; 1320 } 1321 1322 .media-modal .imgedit-wrap .imgedit-panel-content, 1323 .media-modal .imgedit-wrap .image-editor { 1324 position: initial !important; 1325 } 1326 1327 .media-modal .imgedit-wrap .image-editor { 1328 box-sizing: border-box; 1329 width: 100% !important; 1330 } 1331 1332 .image-editor .imgedit-scale-button-wrapper { 1333 display: inline-block; 1334 } 1335 } 1336 1337 @media only screen and (max-width: 600px) { 1338 .media-item-wrapper { 1339 grid-template-columns: 1fr; 1340 } 1341 } 1342 1343 /** 1344 * Media queries for media grid. 1345 */ 1346 @media only screen and (max-width: 1120px) { 1347 /* override for media-views.css */ 1348 #wp-media-grid .wp-filter .attachment-filters { 1349 max-width: 100%; 1350 } 1351 } 1352 1353 @media only screen and (max-width: 1000px) { 1354 /* override for forms.css */ 1355 .wp-filter p.search-box { 1356 float: none; 1357 width: 100%; 1358 margin-bottom: 20px; 1359 display: flex; 1360 flex-wrap: nowrap; 1361 column-gap: 0; 1362 } 1363 1364 .wp-filter p.search-box #media-search-input { 1365 width: 100%; 1366 } 1367 1368 } 1369 1370 @media only screen and (max-width: 782px) { 1371 .media-frame.mode-select .attachments-browser.fixed .media-toolbar { 1372 top: 46px; 1373 left: 10px; 1374 } 1375 } 1376 1377 @media only screen and (max-width: 600px) { 1378 .media-frame.mode-select .attachments-browser.fixed .media-toolbar { 1379 top: 0; 1380 } 1381 } 1382 1383 @media only screen and (max-width: 480px) { 1384 .edit-attachment-frame .media-frame-title { 1385 left: 110px; 1386 } 1387 1388 .upload-php .media-modal-close, 1389 .edit-attachment-frame .edit-media-header .left, 1390 .edit-attachment-frame .edit-media-header .right { 1391 width: 40px; 1392 height: 40px; 1393 } 1394 1395 .edit-attachment-frame .edit-media-header .right:before, 1396 .edit-attachment-frame .edit-media-header .left:before { 1397 line-height: 40px !important; 1398 } 1399 1400 .edit-attachment-frame .edit-media-header .left { 1401 left: 82px; 1402 } 1403 1404 .edit-attachment-frame .edit-media-header .right { 1405 left: 41px; 1406 } 1407 1408 .edit-attachment-frame .media-frame-content { 1409 top: 40px; 1410 } 1411 1412 .edit-attachment-frame .attachment-media-view { 1413 float: none; 1414 height: auto; 1415 width: 100%; 1416 } 1417 1418 .edit-attachment-frame .attachment-info { 1419 height: auto; 1420 width: 100%; 1421 } 1422 } 1423 1424 @media only screen and (max-width: 640px), screen and (max-height: 400px) { 1425 .upload-php .mode-grid .media-sidebar{ 1426 max-width: 100%; 1427 } 1428 } 1429 1430 @media only screen and (max-width: 375px) { 1431 .media-item .attachment-tools { 1432 align-items: baseline; 1433 } 1434 .media-item .edit-attachment.copy-to-clipboard-container { 1435 flex-direction: column; 1436 } 1437 1438 .copy-to-clipboard-container .success { 1439 line-height: normal; 1440 margin-top: 10px; 1441 } 1442 }
title
Description
Body
title
Description
Body
title
Description
Body
title
Body
Generated : Thu Nov 21 08:20:01 2024 | Cross-referenced by PHPXref |