WordPress.org

Make WordPress Core

Ticket #26940: 26940.diff

File 26940.diff, 7.3 KB (added by georgestephanis, 7 years ago)
  • src/wp-includes/admin-bar.php

     
    714714        if ( is_admin() )
    715715                return;
    716716
     717        $focus    = 'document.getElementById(\'wp-admin-bar-search\').className += \' focus\';';
     718        $focusout = 'document.getElementById(\'wp-admin-bar-search\').className = document.getElementById(\'wp-admin-bar-search\').className.replace(/\bfocus\b/,\'\').trim();';
     719
    717720        $form  = '<form action="' . esc_url( home_url( '/' ) ) . '" method="get" id="adminbarsearch">';
    718         $form .= '<input class="adminbar-input" name="s" id="adminbar-search" type="text" value="" maxlength="150" />';
     721        $form .= '<input class="adminbar-input" name="s" id="adminbar-search" type="text" value="" maxlength="150" placeholder="' . __('Search') . '" onfocus="' . $focus . '" onfocusout="' . $focusout . '" />';
    719722        $form .= '<input type="submit" class="adminbar-button" value="' . __('Search') . '"/>';
    720723        $form .= '</form>';
    721724
    722725        $wp_admin_bar->add_menu( array(
    723726                'parent' => 'top-secondary',
    724727                'id'     => 'search',
    725                 'title'  => $form,
     728                'title'  => '<span class="screen-reader-text">' . __( 'Search' ) . '</span>',
    726729                'meta'   => array(
    727730                        'class'    => 'admin-bar-search',
    728731                        'tabindex' => -1,
    729732                )
    730733        ) );
     734
     735        $wp_admin_bar->add_menu( array(
     736                'parent' => 'search',
     737                'id'     => 'adminbarsearch',
     738                'title'  => $form
     739        ) );
    731740}
    732741
    733742/**
  • src/wp-includes/css/admin-bar.css

     
    101101}
    102102
    103103/* Prevent a Chrome bug that inadvertantly activates
    104    :hover states on an element that touches the extreme 
     104   :hover states on an element that touches the extreme
    105105   top left corner of the viewport. See #18868 */
    106106#wpadminbar .quicklinks {
    107107        border-left: 1px solid transparent;
     
    182182#wpadminbar .quicklinks .menupop ul li .ab-item,
    183183#wpadminbar .quicklinks .menupop ul li a strong,
    184184#wpadminbar .quicklinks .menupop.hover ul li .ab-item,
     185#wpadminbar .quicklinks .menupop.focus ul li .ab-item,
    185186#wpadminbar.nojs .quicklinks .menupop:hover ul li .ab-item,
    186187#wpadminbar .shortlink-input {
    187188        line-height: 26px;
     
    195196}
    196197
    197198#wpadminbar.nojs li:hover > .ab-sub-wrapper,
    198 #wpadminbar li.hover > .ab-sub-wrapper {
     199#wpadminbar li.hover > .ab-sub-wrapper,
     200#wpadminbar li.focus > .ab-sub-wrapper {
    199201        display: block;
    200202}
    201203
    202204#wpadminbar .menupop li:hover > .ab-sub-wrapper,
    203 #wpadminbar .menupop li.hover > .ab-sub-wrapper {
     205#wpadminbar .menupop li.hover > .ab-sub-wrapper,
     206#wpadminbar .menupop li.focus > .ab-sub-wrapper {
    204207        margin-left: 100%;
    205208        margin-top: -32px;
    206209}
    207210
    208211#wpadminbar .ab-top-secondary .menupop li:hover > .ab-sub-wrapper,
    209 #wpadminbar .ab-top-secondary .menupop li.hover > .ab-sub-wrapper {
     212#wpadminbar .ab-top-secondary .menupop li.hover > .ab-sub-wrapper,
     213#wpadminbar .ab-top-secondary .menupop li.focus > .ab-sub-wrapper {
    210214        margin-left: 0;
    211215        left: inherit;
    212216        right: 100%;
     
    215219#wpadminbar .ab-top-menu > li > .ab-item:focus,
    216220#wpadminbar.nojq .quicklinks .ab-top-menu > li > .ab-item:focus,
    217221#wpadminbar .ab-top-menu > li:hover > .ab-item,
    218 #wpadminbar .ab-top-menu > li.hover > .ab-item {
     222#wpadminbar .ab-top-menu > li.hover > .ab-item,
     223#wpadminbar .ab-top-menu > li.focus > .ab-item {
    219224        background: #333;
    220225        color: #2ea2cc;
    221226}
    222227
    223228#wpadminbar > #wp-toolbar li:hover span.ab-label,
    224229#wpadminbar > #wp-toolbar li.hover span.ab-label,
     230#wpadminbar > #wp-toolbar li.focus span.ab-label,
    225231#wpadminbar > #wp-toolbar a:focus span.ab-label {
    226232        color: #2ea2cc;
    227233}
     
    285291#wpadminbar li .ab-item:focus:before,
    286292#wpadminbar li.hover .ab-icon:before,
    287293#wpadminbar li.hover .ab-item:before,
     294#wpadminbar li.focus .ab-item:before,
    288295#wpadminbar li:hover #adminbarsearch:before {
    289296        color: #2ea2cc;
    290297}
     
    551558/**
    552559 * Search
    553560 */
    554 #wpadminbar #wp-admin-bar-search .ab-item {
    555         padding: 0;
    556         background: transparent;
     561#wpadminbar #wp-admin-bar-search > .ab-item {
     562        padding: 0 5px;
    557563}
    558564
    559 #wpadminbar #adminbarsearch {
    560         position: relative;
    561         height: 32px;
    562         padding: 0 2px;
    563 }
    564 
    565 #wpadminbar #adminbarsearch:before {
    566         position: absolute;
    567         top: 6px;
    568         left: 5px;
    569         z-index: 20;
    570         font: normal 20px/1 'dashicons' !important;
     565#wpadminbar #wp-admin-bar-search > .ab-item:before {
    571566        content: '\f179';
    572         speak: none;
    573         -webkit-font-smoothing: antialiased;
    574         -moz-osx-font-smoothing: grayscale;
     567        font-size: 24px;
     568        margin-right: 0;
    575569}
    576570
    577 #wpadminbar > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input {
    578         position: relative;
    579         z-index: 30;
    580         font: 13px/24px "Open Sans", sans-serif;
    581         height: 24px;
    582         width: 24px;
    583         padding: 0 3px 0 24px;
    584         margin: 0;
    585         color: #ccc;
    586         background-color: rgba( 255, 255, 255, 0 );
    587         border: none;
    588         outline: none;
    589         cursor: pointer;
    590 
    591         -webkit-box-shadow: none;
    592         box-shadow: none;
    593 
    594         -moz-box-sizing: border-box;
    595         -webkit-box-sizing: border-box;
    596         -ms-box-sizing: border-box;
    597         box-sizing: border-box;
    598 
    599         -webkit-transition-duration: 400ms;
    600         -webkit-transition-property: width, background;
    601         -webkit-transition-timing-function: ease;
    602         -moz-transition-duration: 400ms;
    603         -moz-transition-property: width, background;
    604         -moz-transition-timing-function: ease;
    605         -o-transition-duration: 400ms;
    606         -o-transition-property: width, background;
    607         -o-transition-timing-function: ease;
     571#wpadminbar #wp-admin-bar-search .ab-submenu {
     572        padding-bottom: 10px;
    608573}
    609574
    610 #wpadminbar > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input:focus {
    611         z-index: 10;
    612         color: #000;
    613         width: 200px;
    614         background-color: rgba( 255, 255, 255, 0.9 );
    615         cursor: text;
     575#wpadminbar #wp-admin-bar-search .adminbar-input {
     576        height: 14px;
     577        padding: 4px;
    616578        border: 0;
     579        line-height: normal;
     580        font-size: 14px;
    617581}
    618582
    619 #wpadminbar.ie7 > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input {
    620         margin-top: 3px;
    621         width: 120px;
    622 }
    623 
    624 #wpadminbar.ie8 > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input {
    625         margin-top: 4px;
    626         background-color: #464646;
    627 }
    628 
    629 #wpadminbar.ie8 > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input:focus {
    630         background-color: #fff;
    631 }
    632 
    633 #wpadminbar #adminbarsearch .adminbar-input::-webkit-input-placeholder {
    634         color: #999;
    635 }
    636 #wpadminbar #adminbarsearch .adminbar-input:-moz-placeholder {
    637         color: #999;
    638 }
    639 #wpadminbar #adminbarsearch .adminbar-input::-moz-placeholder {
    640         color: #999;
    641 }
    642 #wpadminbar #adminbarsearch .adminbar-input:-ms-input-placeholder {
    643         color: #999;
    644 }
    645 
    646 #wpadminbar #adminbarsearch .adminbar-button {
     583#wpadminbar #wp-admin-bar-search .adminbar-button {
    647584        display: none;
    648585}
    649586
     
    809746        }
    810747
    811748        #wpadminbar .menupop li:hover > .ab-sub-wrapper,
    812         #wpadminbar .menupop li.hover > .ab-sub-wrapper {
     749        #wpadminbar .menupop li.hover > .ab-sub-wrapper,
     750        #wpadminbar .menupop li.focus > .ab-sub-wrapper {
    813751                margin-top: -46px;
    814752        }
    815753
     
    1002940        /* Allow dropdown list items to appear normally */
    1003941        #wpadminbar li:hover ul li,
    1004942        #wpadminbar li.hover ul li,
     943        #wpadminbar li.focus ul li,
    1005944        #wpadminbar li:hover ul li:hover ul li {
    1006945                display: list-item;
    1007946        }