Make WordPress Core

Ticket #49715: 49288.3.diff

File 49288.3.diff, 7.3 KB (added by audrasjb, 4 years ago)

Add table-view-* classes and fix few WPCS issues. Also refreshes the previous patch

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

     
    236236                                                .end();
    237237                                },
    238238                                opacity: 0.65,
     239                                start: function() {
     240                                        $( 'body' ).addClass( 'is-dragging-metaboxes' );
     241                                },
    239242                                stop: function() {
    240243                                        var $el = $( this );
    241244
     245                                        $( 'body' ).removeClass( 'is-dragging-metaboxes' );
     246
    242247                                        if ( $el.find( '#dashboard_browser_nag' ).is( ':visible' ) && 'dashboard_browser_nag' != this.firstChild.id ) {
    243248                                                $el.sortable('cancel');
    244249                                                return;
    245250                                        }
    246 
    247251                                        postboxes.save_order(page);
    248252                                },
    249253                                receive: function(e,ui) {
     
    346350                 * @return {void}
    347351                 */
    348352                _mark_area : function() {
    349                         var visible = $('div.postbox:visible').length, side = $('#post-body #side-sortables');
     353                        var visible = $('div.postbox:visible').length,
     354                                isDashboard = $( '#dashboard-widgets' ).length;
    350355
    351                         $( '#dashboard-widgets .meta-box-sortables:visible' ).each( function() {
     356                        $( '#dashboard-widgets .meta-box-sortables:visible, #post-body .meta-box-sortables:visible' ).each( function() {
    352357                                var t = $(this);
    353358
    354359                                if ( visible == 1 || t.children('.postbox:visible').length ) {
     
    356361                                }
    357362                                else {
    358363                                        t.addClass('empty-container');
    359                                         t.attr('data-emptyString', postBoxL10n.postBoxEmptyString);
     364                                        t.attr( 'data-emptyString', isDashboard ? postBoxL10n.postBoxEmptyString : null );
    360365                                }
    361366                        });
    362 
    363                         if ( side.length ) {
    364                                 if ( side.children('.postbox:visible').length )
    365                                         side.removeClass('empty-container');
    366                                 else if ( $('#postbox-container-1').css('width') == '280px' )
    367                                         side.addClass('empty-container');
    368                         }
    369367                },
    370368
    371369                /**
  • src/wp-admin/css/common.css

     
    2929        overflow: visible !important;
    3030}
    3131
    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;
    70 }
    71 
    7232/* 2 columns main area */
    7333
    7434#col-left {
     
    19821942        position: relative;
    19831943}
    19841944
    1985 .metabox-holder .postbox-container .empty-container:after {
    1986         content: attr(data-emptystring);
    1987         margin: auto;
    1988         position: absolute;
    1989         top: 0;
    1990         left: 0;
    1991         bottom: 0;
    1992         right: 0;
    1993         height: 1em;
    1994         width: 200px;
    1995         text-align: center;
    1996         color: #ccc;
    1997         font-size: 18px;
    1998         display: none;
    1999 }
    2000 
    2001 .metabox-holder.columns-1 .postbox-container .empty-container,
    2002 .columns-2 #postbox-container-3 .empty-container,
    2003 .columns-2 #postbox-container-4 .empty-container,
    2004 .columns-3 #postbox-container-4 .empty-container {
    2005         border: 0 none;
    2006         height: 0;
    2007         min-height: 0;
    2008 }
    2009 
    20101945#post-body-content {
    20111946        width: 100%;
    20121947        min-width: 463px;
  • src/wp-admin/css/dashboard.css

     
    4949
    5050#dashboard-widgets .meta-box-sortables {
    5151        margin: 0 8px;
     52        /* Required min-height to make the jQuery UI Sortable drop zone work. */
    5253        min-height: 100px;
    5354}
    5455
     56.is-dragging-metaboxes #dashboard-widgets .postbox-container .empty-container {
     57        border-color: #606a73;
     58}
     59
     60#dashboard-widgets .postbox-container .empty-container:after {
     61        content: attr(data-emptystring);
     62        margin: auto;
     63        position: absolute;
     64        top: 0;
     65        left: 0;
     66        bottom: 0;
     67        right: 0;
     68        height: 1em;
     69        width: 200px;
     70        text-align: center;
     71        color: #606a73;
     72        font-size: 18px;
     73        display: none;
     74}
     75
     76
    5577/* @todo: this was originally in this section, but likely belongs elsewhere */
    5678#the-comment-list td.comment p.comment-author {
    5779        margin-top: 0;
     
    10951117                width: 100%;
    10961118        }
    10971119
    1098         #wpbody #wpbody-content .metabox-holder.columns-1 .postbox-container .empty-container {
     1120        #wpbody #dashboard-widgets .metabox-holder.columns-1 .postbox-container .empty-container {
    10991121                border: 0 none;
    11001122                height: 0;
    11011123                min-height: 0;
     
    11121134                display: none;
    11131135        }
    11141136
    1115         .metabox-holder .postbox-container .empty-container:after {
     1137        #dashboard-widgets .postbox-container .empty-container:after {
    11161138                display: block;
    11171139        }
    11181140}
     
    11421164                display: none;
    11431165        }
    11441166
    1145         .metabox-holder .postbox-container .empty-container:after {
     1167        #dashboard-widgets .postbox-container .empty-container:after {
    11461168                display: block;
    11471169        }
    11481170}
    11491171
     1172/* Always show the "Drag boxes here" CSS generated content on large screens. */
     1173@media only screen and (min-width: 1801px) {
     1174        #dashboard-widgets .postbox-container .empty-container:after {
     1175                display: block;
     1176        }
     1177}
     1178
    11501179@media screen and (max-width: 870px) {
    11511180        .welcome-panel .welcome-panel-column,
    11521181        .welcome-panel .welcome-panel-column:first-child {
  • src/wp-admin/css/edit.css

     
    147147}
    148148
    149149/* Post Screen */
    150 #post-body #normal-sortables {
    151         min-height: 50px;
     150
     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;
    152155}
    153156
     157/* Resets height and border 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        height: auto;
     162        border: none;
     163}
     164
     165/* Only highlight drop zones when dragging and only in the 2 columns layout. */
     166.is-dragging-metaboxes #post-body.columns-2 .meta-box-sortables {
     167        border: none;
     168        outline: 3px dashed #b4b9be;
     169        /* Prevent margin on the child from collapsing with margin on the parent. */
     170        display: flow-root;
     171        /*
     172         * This min-height is meant to limit jumpiness while dragging. It's equivalent
     173         * to the minimum height of the sortable-placeholder which is given by the height
     174         * of a collapsed post box (36px + 1px top and bottom borders) + the placeholder
     175         * bottom margin (20px) + 2 additional pixels to compensate browsers rounding.
     176         */
     177        min-height: 60px;
     178        margin-bottom: 20px;
     179}
     180
    154181.postbox {
    155182        position: relative;
    156183        min-width: 255px;
     
    14461473        }
    14471474}
    14481475
    1449 /* one column on the attachment editor screen */
     1476/*
     1477 * The edit attachment screen auto-switches to one column layout when the
     1478 * viewport is smaller than 1200 pixels.
     1479 */
    14501480@media only screen and (max-width: 1200px) {
    14511481        .post-type-attachment #poststuff {
    14521482                min-width: 0;
     
    14731503                width: auto;
    14741504        }
    14751505
     1506        .is-dragging-metaboxes.post-type-attachment #post-body .meta-box-sortables {
     1507                outline: none;
     1508                min-height: 0;
     1509                margin-bottom: 0;
     1510        }
     1511
    14761512        /* hide the radio buttons for column prefs */
    14771513        .post-type-attachment .screen-layout,
    14781514        .post-type-attachment .columns-prefs {