Make WordPress Core

Changeset 48718


Ignore:
Timestamp:
08/04/2020 01:28:58 PM (4 years ago)
Author:
afercia
Message:

Accessibility: Administration: Address backward compatibility concerns for the sortable postboxes areas after [48340].

Merges [48717] to the 5.5 branch.
Fixes #49288 for 5.5.

Location:
branches/5.5
Files:
5 edited

Legend:

Unmodified
Added
Removed
  • branches/5.5

  • branches/5.5/src/js/_enqueues/admin/postbox.js

    r48650 r48718  
    395395                start: function() {
    396396                    $( 'body' ).addClass( 'is-dragging-metaboxes' );
     397                    // Refresh the cached positions of all the sortable items so that the min-height set while dragging works.
     398                    $( '.meta-box-sortables' ).sortable( 'refreshPositions' );
    397399                },
    398400                stop: function() {
     
    521523         */
    522524        _mark_area : function() {
    523             var visibleSortables = $( '#dashboard-widgets .meta-box-sortables:visible, #post-body .meta-box-sortables:visible' ),
     525            var visible = $( 'div.postbox:visible' ).length,
     526                visibleSortables = $( '#dashboard-widgets .meta-box-sortables:visible, #post-body .meta-box-sortables:visible' ),
    524527                areAllVisibleSortablesEmpty = true;
    525528
     
    527530                var t = $(this);
    528531
    529                 if ( t.children('.postbox:visible').length ) {
     532                if ( visible == 1 || t.children( '.postbox:visible' ).length ) {
    530533                    t.removeClass('empty-container');
    531534                    areAllVisibleSortablesEmpty = false;
     
    543546         *
    544547         * @since 5.5.0
     548         *
     549         * @param {Object}  visibleSortables            The jQuery object representing the visible sortable areas.
     550         * @param {boolean} areAllVisibleSortablesEmpty Whether all the visible sortable areas are "empty".
    545551         *
    546552         * @return {void}
  • branches/5.5/src/wp-admin/css/common.css

    r48671 r48718  
    2828    width: 100%;
    2929    overflow: visible;
     30}
     31
     32/* inner 2 column liquid layout */
     33
     34.inner-sidebar {
     35    float: right;
     36    clear: right;
     37    display: none;
     38    width: 281px;
     39    position: relative;
     40}
     41
     42.columns-2 .inner-sidebar {
     43    margin-right: auto;
     44    width: 286px;
     45    display: block;
     46}
     47
     48.inner-sidebar #side-sortables,
     49.columns-2 .inner-sidebar #side-sortables {
     50    min-height: 300px;
     51    width: 280px;
     52    padding: 0;
     53}
     54
     55.has-right-sidebar .inner-sidebar {
     56    display: block;
     57}
     58
     59.has-right-sidebar #post-body {
     60    float: left;
     61    clear: left;
     62    width: 100%;
     63    margin-right: -2000px;
     64}
     65
     66.has-right-sidebar #post-body-content {
     67    margin-right: 300px;
     68    float: none;
     69    width: auto;
    3070}
    3171
     
    19461986}
    19471987
    1948 .metabox-holder .postbox-container .empty-container {
    1949     outline: 3px dashed #b4b9be;
    1950     height: 250px;
     1988.metabox-holder .postbox-container .meta-box-sortables {
     1989    /* The jQuery UI Sortables need some initial height to work properly. */
     1990    min-height: 1px;
    19511991    position: relative;
    19521992}
  • branches/5.5/src/wp-admin/css/dashboard.css

    r48671 r48718  
    5353    min-height: 100px;
    5454    margin: 0 8px 20px;
     55}
     56
     57#dashboard-widgets .postbox-container .empty-container {
     58    outline: 3px dashed #b4b9be;
     59    height: 250px;
    5560}
    5661
  • branches/5.5/src/wp-admin/css/edit.css

    r48368 r48718  
    149149/* Post Screen */
    150150
    151 /* Only target the sortables in the post screen excluding the ones in the Dashboard. */
    152 #post-body .meta-box-sortables {
    153     /* Required min-height to make the jQuery UI Sortable drop zone work. */
    154     min-height: 1px;
    155 }
    156 
    157 /* Resets height and outline inherited from common.css. */
    158 #post-body.columns-1 #side-sortables.empty-container,
    159 #post-body #normal-sortables.empty-container,
    160 #post-body #advanced-sortables.empty-container {
    161     /* Sortables need some initial height to work correctly. */
    162     height: 1px;
    163     outline: none;
    164 }
    165 
    166151/* Only highlight drop zones when dragging and only in the 2 columns layout. */
    167 .is-dragging-metaboxes #post-body.columns-2 #side-sortables,
    168 .is-dragging-metaboxes #post-body #normal-sortables,
    169 .is-dragging-metaboxes #post-body #advanced-sortables {
     152.is-dragging-metaboxes .metabox-holder .postbox-container .meta-box-sortables {
    170153    outline: 3px dashed #606a73;
    171154    /* Prevent margin on the child from collapsing with margin on the parent. */
     
    15431526    #poststuff #postbox-container-1 .empty-container,
    15441527    #poststuff #postbox-container-1 #side-sortables:empty {
    1545         outline: none;
    15461528        height: 0;
    15471529        min-height: 0;
     
    15511533        min-height: 0;
    15521534        width: auto;
     1535    }
     1536
     1537    /* Increase min-height while dragging for the #side-sortables and any potential sortables area with custom ID. */
     1538    .is-dragging-metaboxes #poststuff #postbox-container-1 .empty-container,
     1539    .is-dragging-metaboxes #poststuff #postbox-container-1 #side-sortables:empty,
     1540    .is-dragging-metaboxes #poststuff #post-body.columns-2 #side-sortables,
     1541    .is-dragging-metaboxes #poststuff #post-body.columns-2 .meta-box-sortables {
     1542        height: auto;
     1543        min-height: 60px;
    15531544    }
    15541545
Note: See TracChangeset for help on using the changeset viewer.