Make WordPress Core

Ticket #28983: admin-bar-wrap-fix.diff

File admin-bar-wrap-fix.diff, 1.9 KB (added by KZeni, 3 years ago)

Updated implementation that was downloaded as a diff from https://github.com/WordPress/wordpress-develop/pull/352/

  • src/wp-includes/css/admin-bar.css

    diff --git a/src/wp-includes/css/admin-bar.css b/src/wp-includes/css/admin-bar.css
    index 4b86ce70e5..a459dd3d8d 100644
    a b html:lang(he-il) .rtl #wpadminbar * { 
    138138        padding: 0 8px 0 7px;
    139139}
    140140
     141#wpadminbar .quicklinks > ul > li,
     142#wpadminbar .quicklinks .ab-item {
     143        max-width: 100px; /* Improve spacing and prevent Site Title from eating WP Logo */
     144}
     145
    141146#wpadminbar .menupop .ab-sub-wrapper,
    142147#wpadminbar .shortlink-input {
    143148        margin: 0;
    html:lang(he-il) .rtl #wpadminbar * { 
    708713        box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    709714}
    710715
     716@media only screen and (min-width: 1061px) {
     717        /* Reset the spacing */
     718        #wpadminbar .quicklinks > ul > li,
     719        #wpadminbar .quicklinks .ab-item {
     720                max-width: initial;
     721                text-overflow: clip;
     722        }
     723}
     724
     725@media screen and (min-width: 782px) {
     726        /* Prevent wrapping of admin bar that has more items than admin bar area (mobile-friendly toolbar doesn't need this) */
     727        #wpadminbar .quicklinks {
     728                justify-content: space-between;
     729        }
     730        #wpadminbar .quicklinks > ul > li {
     731                float: none !important;
     732        }
     733        #wpadminbar .quicklinks > ul > li,
     734        #wpadminbar .quicklinks .ab-item {
     735                white-space: nowrap;
     736                text-overflow: ellipsis;
     737                min-width: 0 !important;
     738        }
     739        #wpadminbar .quicklinks .ab-item {
     740                overflow: hidden;
     741        }
     742        #wpadminbar .quicklinks .ab-item .ab-label,
     743        #wpadminbar .quicklinks .ab-item .display-name {
     744                float: none;
     745                display: inline;
     746        }
     747        #wpadminbar .quicklinks,
     748        #wpadminbar .quicklinks > ul {
     749                display: -ms-flexbox;
     750                display: flex;
     751                flex-wrap: nowrap;
     752                -ms-flex-wrap: nowrap;
     753                min-width: 0 !important;
     754        }
     755        #wpadminbar #wp-admin-bar-top-secondary {
     756                flex-direction: row-reverse;
     757                -ms-flex-direction: row-reverse;
     758        }
     759}
     760
    711761@media screen and (max-width: 782px) {
    712762        /* Toolbar Touchification*/
    713763        html #wpadminbar {