WordPress.org
Get WordPress

Make WordPress Core

Ticket #26550: 26550.patch

File 26550.patch, 20.0 KB (added by afercia, 10 years ago)

  • src/wp-admin/css/media.css

     
    460460        margin-bottom: 16px;
    461461        padding: 0 16px;
    462462        border-left: 4px solid #dd3d36;
    463         -webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
    464         box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
    465         background-color: #fff; 
     463        -webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
     464        box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
     465        background-color: #fff;
    466466}
    467467
    468468.upload-php .mode-grid .hide-sidebar .media-sidebar {
    … …  
    485485}
    486486
    487487.upload-php .mode-grid .media-sidebar .media-uploader-status .upload-dismiss-errors {
    488         font-size: 0;
    489         top: 0;
    490         right: -6px;
     488        top: -10px;
     489        right: -14px;
     490        padding: 10px;
    491491}
    492492
    493493.upload-php .mode-grid .media-sidebar .media-uploader-status .upload-dismiss-errors:before {
    494494        content: "\f153";
     495        display: block;
    495496        font: normal 16px/1 dashicons;
    496497        color: #bbb;
    497498}
    … …  
    636637        font-size: 22px;
    637638}
    638639
    639 .upload-php .media-modal-close .media-modal-icon {
    640         margin: 14px;
    641         width: 22px;
    642 }
    643 
    644640.upload-php .media-modal-close,
    645641.edit-attachment-frame .edit-media-header .left,
    646642.edit-attachment-frame .edit-media-header .right {
    … …  
    693689        border-color: #ccc;
    694690        color: #000;
    695691        outline: none;
     692        -webkit-box-shadow: none;
     693        box-shadow: none;
    696694}
    697695
    698696.upload-php .media-modal-close:focus .media-modal-icon:before,

  • src/wp-includes/css/buttons.css

     
    100100        outline: none;
    101101}
    102102
     103.ie8 .wp-core-ui .button-link:focus {
     104        outline: #5b9dd9 solid 1px;
     105}
     106
    103107.wp-core-ui .button.hidden {
    104108        display: none;
    105109}
    … …  
    136140        vertical-align: baseline;
    137141}
    138142
     143.wp-core-ui .button-link {
     144        border: 0;
     145        background: none;
     146        outline: none;
     147        cursor: pointer;
     148}
     149
    139150.wp-core-ui .button.hover,
    140151.wp-core-ui .button:hover,
    141152.wp-core-ui .button-secondary:hover,
    … …  
    149160
    150161.wp-core-ui .button.focus,
    151162.wp-core-ui .button:focus,
    152 .wp-core-ui .button-secondary:focus {
     163.wp-core-ui .button-secondary:focus,
     164.wp-core-ui .button-link:focus {
    153165        -webkit-box-shadow:
    154166                0 0 0 1px #5b9dd9,
    155167                0 0 2px 1px rgba(30, 140, 190, .8);

  • src/wp-includes/css/media-views.css

     
    153153
    154154.media-modal-close {
    155155        position: absolute;
    156         text-decoration: none;
    157         top: 10px;
    158         right: 10px;
    159         width: 30px;
    160         height: 30px;
     156        top: 0;
     157        right: 0;
     158        width: 50px;
     159        height: 50px;
     160        padding: 0;
    161161        z-index: 1000;
    162162        -webkit-transition: color .1s ease-in-out, background .1s ease-in-out;
    163163        transition: color .1s ease-in-out, background .1s ease-in-out;
    … …  
    169169}
    170170
    171171.media-modal-close span.media-modal-icon {
    172         display: block;
    173         margin-top: 5px;
    174         width: 30px;
    175         height: 15px;
    176172        background-image: none;
    177         text-align: center;
    178173}
    179174
    180175.media-modal-close .media-modal-icon:before {
    … …  
    209204        -webkit-font-smoothing: subpixel-antialiased;
    210205}
    211206
    212 .media-modal-icon {
     207/* higher specificity */
     208.wp-core-ui .media-modal-icon {
    213209        background-image: url(../images/uploader-icons.png);
    214210        background-repeat: no-repeat;
    215211}
    … …  
    935931        position: absolute;
    936932}
    937933
    938 .wp-core-ui .attachment .close {
     934.wp-core-ui .attachment-close {
    939935        display: block;
    940936        position: absolute;
    941937        top: 5px;
    … …  
    943939        height: 22px;
    944940        width: 22px;
    945941        padding: 0;
    946         font-size: 20px;
    947         line-height: 20px;
    948         text-align: center;
    949         text-decoration: none;
    950         color: #464646;
    951942        background-color: #fff;
    952943        background-position: -96px 4px;
    953         border-width: 0;
    954944        -webkit-border-radius: 3px;
    955945        border-radius: 3px;
    956946        -webkit-box-shadow: 0 0 0 1px rgba( 0, 0, 0, 0.3 );
    957947        box-shadow: 0 0 0 1px rgba( 0, 0, 0, 0.3 );
    958         -webkit-transition-duration: none;
    959         transition-duration: none;
    960         -webkit-transition-property: none;
    961         transition-property: none;
    962948}
    963949
    964 .wp-core-ui .attachment a.close:hover,
    965 .wp-core-ui .attachment a.close:focus {
    966         -webkit-box-shadow: 0 0 0 1px rgba( 0, 0, 0, 0.6 );
    967         box-shadow: 0 0 0 1px rgba( 0, 0, 0, 0.6 );
     950.wp-core-ui .attachment-close:hover,
     951.wp-core-ui .attachment-close:focus {
    968952        background-position: -36px 4px;
    969 
    970953}
    971954
    972955.wp-core-ui .attachment .check {
    … …  
    973956        display: none;
    974957        height: 24px;
    975958        width: 24px;
     959        padding: 0;
    976960        position: absolute;
    977961        z-index: 10;
    978962        top: 0;
    … …  
    983967        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba( 0, 0, 0, 0.15 );
    984968}
    985969
    986 .wp-core-ui .attachment .check div {
     970.wp-core-ui .attachment .check .media-modal-icon {
     971        display: block;
    987972        background-position: -1px 0;
    988973        height: 15px;
    989974        width: 15px;
    … …  
    990975        margin: 5px;
    991976}
    992977
    993 .wp-core-ui .attachment .check:hover div {
     978.wp-core-ui .attachment .check:hover .media-modal-icon {
    994979        background-position: -40px 0;
    995980}
    996981
    … …  
    1010995                0 0 0 2px #1e8cbe;
    1011996}
    1012997
    1013 .wp-core-ui .attachment.details .check div,
    1014 .wp-core-ui .media-frame.mode-grid .attachment.selected .check div {
     998.wp-core-ui .attachment.details .check .media-modal-icon,
     999.wp-core-ui .media-frame.mode-grid .attachment.selected .check .media-modal-icon {
    10151000        background-position: -21px 0;
    10161001}
    10171002
    1018 .wp-core-ui .attachment.details .check:hover div,
    1019 .wp-core-ui .attachment.selected .check:focus div,
    1020 .wp-core-ui .media-frame.mode-grid .attachment.selected .check:hover div {
     1003.wp-core-ui .attachment.details .check:hover .media-modal-icon,
     1004.wp-core-ui .attachment.selected .check:focus .media-modal-icon,
     1005.wp-core-ui .media-frame.mode-grid .attachment.selected .check:hover .media-modal-icon {
    10211006        background-position: -60px 0;
    10221007}
    10231008
    … …  
    12141199        position: absolute;
    12151200        top: 0;
    12161201        right: 0;
     1202        padding: 10px;
    12171203}
    12181204
     1205.media-sidebar .media-uploader-status .upload-dismiss-errors:before {
     1206        content: "\f153";
     1207        display: block;
     1208        font: normal 16px/1 dashicons;
     1209        color: #bbb;
     1210}
     1211
     1212.media-sidebar .media-uploader-status .upload-dismiss-errors:focus:before,
     1213.media-sidebar .media-uploader-status .upload-dismiss-errors:hover:before {
     1214        color: #c00;
     1215}
     1216
    12191217.upload-errors .upload-error {
    12201218        padding: 12px;
    1221         margin-bottom: 12px; 
    1222         background: #fff; 
    1223         border-left: 4px solid #dd3d36; 
    1224         -webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1); 
    1225         box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1); 
     1219        margin-bottom: 12px;
     1220        background: #fff;
     1221        border-left: 4px solid #dd3d36;
     1222        -webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
     1223        box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
    12261224}
    12271225
    12281226.upload-errors .upload-error-filename {
    … …  
    13911389        font-weight: bold;
    13921390}
    13931391
    1394 .media-selection .selection-info a {
    1395         display: block;
     1392.media-selection .button-link {
    13961393        float: left;
    13971394        padding: 1px 8px;
    13981395        margin: 1px 8px 1px -8px;
    13991396        line-height: 16px;
    1400         text-decoration: none;
    14011397        border-right: 1px solid #dfdfdf;
    14021398        color: #21759B;
    14031399}
    14041400
    1405 .media-selection .selection-info a:hover {
     1401.media-selection .button-link:hover,
     1402.media-selection .button-link:focus {
    14061403        background: #21759B;
    14071404        color: #fff;
    14081405        border-color: transparent;
    14091406}
    14101407
    1411 .media-selection .selection-info a:last-child {
     1408.media-selection .button-link:last-child {
    14121409        border-right: 0;
    14131410        margin-right: 0;
    14141411}
    14151412
    1416 .media-selection .selection-info .clear-selection {
     1413.selection-info .clear-selection {
    14171414        color: red;
    14181415}
    14191416
    1420 .media-selection .selection-info .clear-selection:hover {
     1417.selection-info .clear-selection:hover,
     1418.selection-info .clear-selection:focus {
    14211419        background: red;
     1420        color: #fff;
    14221421}
    14231422
    14241423.media-selection .selection-view {
    … …  
    16431642.media-modal .delete-attachment,
    16441643.media-modal .trash-attachment,
    16451644.media-modal .untrash-attachment {
     1645        display: inline;
     1646        padding: 0;
    16461647        color: #bc0b0b;
    16471648}
    16481649
    16491650.media-modal .delete-attachment:hover,
     1651.media-modal .delete-attachment:focus,
    16501652.media-modal .trash-attachment:hover,
    1651 .media-modal .untrash-attachment:hover {
     1653.media-modal .trash-attachment:focus,
     1654.media-modal .untrash-attachment:hover,
     1655.media-modal .untrash-attachment:focus {
    16521656        color: red;
    16531657}
    16541658
    … …  
    18811885}
    18821886
    18831887.image-details .advanced-toggle {
     1888        padding: 0;
    18841889        color: #666;
    1885         text-decoration: none;
    1886         display: block;
     1890        text-transform: uppercase;
    18871891}
    18881892
    18891893.image-details .advanced-toggle:after {

  • src/wp-includes/js/media-views.js

     
    26252625                'change [data-setting] input':    'updateSetting',
    26262626                'change [data-setting] select':   'updateSetting',
    26272627                'change [data-setting] textarea': 'updateSetting',
    2628                 'click .close':                   'removeFromLibrary',
     2628                'click .attachment-close':        'removeFromLibrary',
    26292629                'click .check':                   'checkClickHandler',
    2630                 'click a':                        'preventDefault',
    2631                 'keydown .close':                 'removeFromLibrary',
    26322630                'keydown':                        'toggleSelectionHandler'
    26332631        },
    26342632
    … …  
    27562754        toggleSelectionHandler: function( event ) {
    27572755                var method;
    27582756
    2759                 // Don't do anything inside inputs.
    2760                 if ( 'INPUT' === event.target.nodeName ) {
     2757                // Don't do anything inside inputs and on the attachment check and remove buttons.
     2758                if ( 'INPUT' === event.target.nodeName || 'BUTTON' === event.target.nodeName ) {
    27612759                        return;
    27622760                }
    27632761
    … …  
    29432941                this.$el.toggleClass( 'details', details === this.model );
    29442942        },
    29452943        /**
    2946          * @param {Object} event
    2947          */
    2948         preventDefault: function( event ) {
    2949                 event.preventDefault();
    2950         },
    2951         /**
    29522944         * @param {string} size
    29532945         * @returns {Object}
    29542946         */
    … …  
    31983190
    31993191        initialFocus: function() {
    32003192                if ( ! wp.media.isTouchDevice ) {
    3201                         this.$( ':input' ).eq( 0 ).focus();
     3193                        /*
     3194                        Previously focused the first ':input' (the readonly URL text field).
     3195                        Since the first ':input' is now a button (delete/trash), when pressing
     3196                        Spacebar on an attachment Firefox fires deleteAttachment/trashAttachment
     3197                        as soon as focus is moved. Explicitly target the first text field for now.
     3198                        @todo change initial focus logic, also for accessibility.
     3199                        */
     3200                        this.$( 'input[type=text]' ).eq( 0 ).focus();
    32023201                }
    32033202        },
    32043203        /**

  • src/wp-includes/js/media/views/attachment.js

     
    3333                'change [data-setting] input':    'updateSetting',
    3434                'change [data-setting] select':   'updateSetting',
    3535                'change [data-setting] textarea': 'updateSetting',
    36                 'click .close':                   'removeFromLibrary',
     36                'click .attachment-close':        'removeFromLibrary',
    3737                'click .check':                   'checkClickHandler',
    38                 'click a':                        'preventDefault',
    39                 'keydown .close':                 'removeFromLibrary',
    4038                'keydown':                        'toggleSelectionHandler'
    4139        },
    4240
    … …  
    164162        toggleSelectionHandler: function( event ) {
    165163                var method;
    166164
    167                 // Don't do anything inside inputs.
    168                 if ( 'INPUT' === event.target.nodeName ) {
     165                // Don't do anything inside inputs and on the attachment check and remove buttons.
     166                if ( 'INPUT' === event.target.nodeName || 'BUTTON' === event.target.nodeName ) {
    169167                        return;
    170168                }
    171169
    … …  
    351349                this.$el.toggleClass( 'details', details === this.model );
    352350        },
    353351        /**
    354          * @param {Object} event
    355          */
    356         preventDefault: function( event ) {
    357                 event.preventDefault();
    358         },
    359         /**
    360352         * @param {string} size
    361353         * @returns {Object}
    362354         */

  • src/wp-includes/js/media/views/attachment/details.js

     
    5050
    5151        initialFocus: function() {
    5252                if ( ! wp.media.isTouchDevice ) {
    53                         this.$( ':input' ).eq( 0 ).focus();
     53                        /*
     54                        Previously focused the first ':input' (the readonly URL text field).
     55                        Since the first ':input' is now a button (delete/trash), when pressing
     56                        Spacebar on an attachment Firefox fires deleteAttachment/trashAttachment
     57                        as soon as focus is moved. Explicitly target the first text field for now.
     58                        @todo change initial focus logic, also for accessibility.
     59                        */
     60                        this.$( 'input[type=text]' ).eq( 0 ).focus();
    5461                }
    5562        },
    5663        /**

  • src/wp-includes/js/mediaelement/wp-mediaelement.css

     
    106106}
    107107
    108108.media-embed-details .setting p,
    109 .media-embed-details .setting a {
     109.media-embed-details .setting .remove-setting {
    110110        color: #a00;
    111111        font-size: 10px;
    112112        text-transform: uppercase;
    113113}
    114114
     115.media-embed-details .setting .remove-setting {
     116        padding: 0;
     117}
     118
    115119.media-embed-details .setting a:hover {
    116120        color: #f00;
    117121}

  • src/wp-includes/media-template.php

     
    166166
    167167        <script type="text/html" id="tmpl-media-modal">
    168168                <div class="<?php echo $class; ?>">
    169                         <a class="media-modal-close" href="#"><span class="media-modal-icon"><span class="screen-reader-text"><?php _e( 'Close media panel' ); ?></span></span></a>
     169                        <button type="button" class="button-link media-modal-close"><span class="media-modal-icon"><span class="screen-reader-text"><?php _e( 'Close media panel' ); ?></span></span></button>
    170170                        <div class="media-modal-content"></div>
    171171                </div>
    172172                <div class="media-modal-backdrop"></div>
    … …  
    261261
    262262        <script type="text/html" id="tmpl-uploader-status">
    263263                <h3><?php _e( 'Uploading' ); ?></h3>
    264                 <a class="upload-dismiss-errors" href="#"><?php _e('Dismiss Errors'); ?></a>
     264                <button type="button" class="button-link upload-dismiss-errors"><span class="screen-reader-text"><?php _e( 'Dismiss Errors' ); ?></span></button>
    265265
    266266                <div class="media-progress-bar"><div></div></div>
    267267                <div class="upload-details">
    … …  
    432432                                <# if ( ! data.uploading && data.can.remove ) { #> |
    433433                                        <?php if ( MEDIA_TRASH ): ?>
    434434                                                <# if ( 'trash' === data.status ) { #>
    435                                                         <a class="untrash-attachment" href="#"><?php _e( 'Untrash' ); ?></a>
     435                                                        <button type="button" class="button-link untrash-attachment"><?php _e( 'Untrash' ); ?></button>
    436436                                                <# } else { #>
    437                                                         <a class="trash-attachment" href="#"><?php _ex( 'Trash', 'verb' ); ?></a>
     437                                                        <button type="button" class="button-link trash-attachment"><?php _ex( 'Trash', 'verb' ); ?></button>
    438438                                                <# } #>
    439439                                        <?php else: ?>
    440                                                 <a class="delete-attachment" href="#"><?php _e( 'Delete Permanently' ); ?></a>
     440                                                <button type="button" class="button-link delete-attachment"><?php _e( 'Delete Permanently' ); ?></button>
    441441                                        <?php endif; ?>
    442442                                <# } #>
    443443                        </div>
    … …  
    468468                                <# } #>
    469469                        </div>
    470470                        <# if ( data.buttons.close ) { #>
    471                                 <a class="close media-modal-icon" href="#" title="<?php esc_attr_e('Remove'); ?>"></a>
     471                                <button type="button" class="button-link attachment-close media-modal-icon"><span class="screen-reader-text"><?php _e( 'Remove' ); ?></span></button>
    472472                        <# } #>
    473473                </div>
    474474                <# if ( data.buttons.check ) { #>
    475                         <a class="check" href="#" title="<?php esc_attr_e('Deselect'); ?>" tabindex="-1"><div class="media-modal-icon"></div></a>
     475                        <button type="button" class="button-link check" tabindex="-1"><span class="media-modal-icon"></span><span class="screen-reader-text"><?php _e( 'Deselect' ); ?></span></button>
    476476                <# } #>
    477477                <#
    478478                var maybeReadOnly = data.can.save || data.allowLocalEdits ? '' : 'readonly';
    … …  
    535535                                <# if ( ! data.uploading && data.can.remove ) { #>
    536536                                        <?php if ( MEDIA_TRASH ): ?>
    537537                                        <# if ( 'trash' === data.status ) { #>
    538                                                 <a class="untrash-attachment" href="#"><?php _e( 'Untrash' ); ?></a>
     538                                                <button type="button" class="button-link untrash-attachment"><?php _e( 'Untrash' ); ?></button>
    539539                                        <# } else { #>
    540                                                 <a class="trash-attachment" href="#"><?php _ex( 'Trash', 'verb' ); ?></a>
     540                                                <button type="button" class="button-link trash-attachment"><?php _ex( 'Trash', 'verb' ); ?></button>
    541541                                        <# } #>
    542542                                        <?php else: ?>
    543                                                 <a class="delete-attachment" href="#"><?php _e( 'Delete Permanently' ); ?></a>
     543                                                <button type="button" class="button-link delete-attachment"><?php _e( 'Delete Permanently' ); ?></button>
    544544                                        <?php endif; ?>
    545545                                <# } #>
    546546
    … …  
    592592                <div class="selection-info">
    593593                        <span class="count"></span>
    594594                        <# if ( data.editable ) { #>
    595                                 <a class="edit-selection" href="#"><?php _e( 'Edit Selection' ); ?></a>
     595                                <button type="button" class="button-link edit-selection"><?php _e( 'Edit Selection' ); ?></button>
    596596                        <# } #>
    597597                        <# if ( data.clearable ) { #>
    598                                 <a class="clear-selection" href="#"><?php _e('Clear'); ?></a>
     598                                <button type="button" class="button-link clear-selection"><?php _e( 'Clear' ); ?></button>
    599599                        <# } #>
    600600                </div>
    601601                <div class="selection-view"></div>
    … …  
    988988                                                <input type="text" class="link-to-custom" data-setting="linkUrl" />
    989989                                        </div>
    990990                                        <div class="advanced-section">
    991                                                 <h3><a class="advanced-toggle" href="#"><?php _e('Advanced Options'); ?></a></h3>
     991                                                <h3><button type="button" class="button-link advanced-toggle"><?php _e( 'Advanced Options' ); ?></button></h3>
    992992                                                <div class="advanced-settings hidden">
    993993                                                        <div class="advanced-image">
    994994                                                                <label class="setting title-text">
    … …  
    10451045                                <label class="setting">
    10461046                                        <span>SRC</span>
    10471047                                        <input type="text" disabled="disabled" data-setting="src" value="{{ data.model.src }}" />
    1048                                         <a class="remove-setting"><?php _e( 'Remove' ); ?></a>
     1048                                        <button type="button" class="button-link remove-setting"><?php _e( 'Remove audio source' ); ?></button>
    10491049                                </label>
    10501050                                <# } #>
    10511051                                <?php
    … …  
    10591059                                <label class="setting">
    10601060                                        <span><?php echo strtoupper( $type ) ?></span>
    10611061                                        <input type="text" disabled="disabled" data-setting="<?php echo $type ?>" value="{{ data.model.<?php echo $type ?> }}" />
    1062                                         <a class="remove-setting"><?php _e( 'Remove' ); ?></a>
     1062                                        <button type="button" class="button-link remove-setting"><?php _e( 'Remove audio source' ); ?></button>
    10631063                                </label>
    10641064                                <# } #>
    10651065                                <?php endforeach ?>
    … …  
    11281128                                <label class="setting">
    11291129                                        <span>SRC</span>
    11301130                                        <input type="text" disabled="disabled" data-setting="src" value="{{ data.model.src }}" />
    1131                                         <a class="remove-setting"><?php _e( 'Remove' ); ?></a>
     1131                                        <button type="button" class="button-link remove-setting"><?php _e( 'Remove video source' ); ?></button>
    11321132                                </label>
    11331133                                <# } #>
    11341134                                <?php foreach ( $video_types as $type ):
    … …  
    11401140                                <label class="setting">
    11411141                                        <span><?php echo strtoupper( $type ) ?></span>
    11421142                                        <input type="text" disabled="disabled" data-setting="<?php echo $type ?>" value="{{ data.model.<?php echo $type ?> }}" />
    1143                                         <a class="remove-setting"><?php _e( 'Remove' ); ?></a>
     1143                                        <button type="button" class="button-link remove-setting"><?php _e( 'Remove video source' ); ?></button>
    11441144                                </label>
    11451145                                <# } #>
    11461146                                <?php endforeach ?>
    … …  
    11611161                                <label class="setting">
    11621162                                        <span><?php _e( 'Poster Image' ); ?></span>
    11631163                                        <input type="text" disabled="disabled" data-setting="poster" value="{{ data.model.poster }}" />
    1164                                         <a class="remove-setting"><?php _e( 'Remove' ); ?></a>
     1164                                        <button type="button" class="button-link remove-setting"><?php _e( 'Remove poster image' ); ?></button>
    11651165                                </label>
    11661166                                <# } #>
    11671167                                <div class="setting preload">
    … …  
    11931193                                                        content += track.outerHTML; #>
    11941194                                                <p>
    11951195                                                        <input class="content-track" type="text" value="{{ track.outerHTML }}" />
    1196                                                         <a class="remove-setting remove-track"><?php _e( 'Remove' ); ?></a>
     1196                                                        <button type="button" class="button-link remove-setting remove-track""><?php _ex( 'Remove video track', 'media' ); ?></button>
    11971197                                                </p>
    11981198                                                <# } ); #>
    11991199                                        <# } else { #>