WordPress.org
Get WordPress

Make WordPress Core

Changeset 21574


Ignore:
Timestamp:
08/21/2012 10:46:30 PM (12 years ago)
Author:
azaozz
Message:

Improve the layout and accessibility of the admin menu: simplify the HTML structure, move the submenus off the viewport (still visible for screen readers) instead of hiding them with display: none, make it possible to unfold the menu on small/narrow screens, see #21349

Location:
trunk/wp-admin
Files:
9 edited

Legend:

Unmodified
Added
Removed

  • trunk/wp-admin/admin-header.php

    r21435 r21574  
    7777    $admin_body_class .= ' folded';
    7878
     79if ( !get_user_setting('unfold') )
     80    $admin_body_class .= ' auto-fold';
     81
    7982if ( is_admin_bar_showing() )
    8083    $admin_body_class .= ' admin-bar';

  • trunk/wp-admin/css/colors-classic.dev.css

    r21534 r21574  
    491491#adminmenu a:hover,
    492492#adminmenu li.menu-top > a:focus,
    493 #adminmenu ul.wp-submenu a:hover,
     493#adminmenu .wp-submenu a:hover,
    494494#the-comment-list .comment a:hover,
    495495#rightnow a:hover,
    … …  
    12811281
    12821282#adminmenu a.menu-top,
    1283 .folded #adminmenu li.menu-top,
    12841283#adminmenu .wp-submenu .wp-submenu-head {
    12851284    border-top-color: #ffffff;
    … …  
    12911290}
    12921291
    1293 #adminmenu li.menu-top:hover > a,
    1294 #adminmenu li.menu-top.focused > a,
    1295 #adminmenu li.menu-top > a:focus {
     1292#adminmenu a.menu-top:hover,
     1293#adminmenu li.opensub > a.menu-top,
     1294#adminmenu li.opensub > a.menu-top,
     1295#adminmenu li > a.menu-top:focus {
    12961296    background-color: #e0f1ff;
     1297    color: #d54e21;
    12971298    text-shadow: 0 1px 0 rgba( 255, 255, 255, 0.4 );
    12981299}
    … …  
    13191320    background-image:      -o-linear-gradient(bottom right, #5589aa, #619bbb);
    13201321    background-image: linear-gradient(to top left, #5589aa, #619bbb);
    1321 
    13221322}
    13231323
    … …  
    13641364}
    13651365
    1366 #adminmenu .wp-submenu ul {
     1366#adminmenu .wp-submenu,
     1367.folded #adminmenu a.wp-has-current-submenu:focus + .wp-submenu,
     1368.folded #adminmenu .wp-has-current-submenu .wp-submenu {
    13671369    background-color: #fff;
    1368 }
    1369 
    1370 #adminmenu .wp-submenu-wrap,
    1371 #adminmenu .wp-submenu ul {
    13721370    border-color: #d0dfe9;
    1373 }
    1374 
    1375 #adminmenu .wp-submenu-wrap,
    1376 .folded #adminmenu .wp-has-current-submenu .wp-submenu-wrap {
    1377     -webkit-box-shadow: 2px 2px 5px rgba( 0, 0, 0, 0.4 );
    1378     box-shadow: 2px 2px 5px rgba( 0, 0, 0, 0.4 );
     1371    -webkit-box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.4);
     1372    box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.4);
    13791373}
    13801374
    13811375#adminmenu .wp-submenu .wp-submenu-head {
    1382     border-right-color: #e8eff4;
    1383     background-color: #EFF8FF;
    1384 }
    1385 
    1386 #adminmenu div.wp-submenu {
    1387     background-color: transparent;
     1376    border-right-color: #dfdfdf;
     1377    background-color: #e4e4e4;
    13881378}
    13891379
    … …  
    13911381#collapse-menu {
    13921382    color: #A0C3D5;
     1383    border-top-color: #f9f9f9;
    13931384}
    13941385
    … …  
    13991390#collapse-button {
    14001391    border-color: #d0dfe9;
    1401     background: #eff8ff; /* Fallback */
     1392    background: #eff8ff;
    14021393    background-image: -webkit-gradient(linear, left bottom, left top, from(#eff8ff), to(#fff));
    14031394    background-image: -webkit-linear-gradient(bottom, #eff8ff, #fff);
    … …  
    14221413/* Auto-folding of the admin menu */
    14231414@media only screen and (max-width: 900px) {
    1424     #adminmenu li.menu-top {
    1425         border-top-color: #ffffff;
    1426         border-bottom-color: #cae6ff;
     1415    .auto-fold #adminmenu li.wp-has-current-submenu,
     1416    .auto-fold #adminmenu li.current.menu-top {
     1417        background-color: #5589AA;
     1418        background-image: -webkit-gradient(linear, left bottom, left top, from(#5589AA), to(#619bbb));
     1419        background-image: -webkit-linear-gradient(bottom, #5589AA, #619bbb);
     1420        background-image: -moz-linear-gradient(bottom, #5589AA, #619bbb);
     1421        background-image: -o-linear-gradient(bottom, #5589AA, #619bbb);
     1422        background-image: linear-gradient(bottom, #5589AA, #619bbb);
    14271423    }
    14281424
    1429     #adminmenu li.wp-has-current-submenu,
    1430     #adminmenu li.current.menu-top {
    1431         background: #5589aa;
    1432         background-image: -webkit-gradient(linear, left bottom, left top, from(#5589aa), to(#619bbb));
    1433         background-image: -webkit-linear-gradient(bottom, #5589aa, #619bbb);
    1434         background-image:    -moz-linear-gradient(bottom, #5589aa, #619bbb);
    1435         background-image:      -o-linear-gradient(bottom, #5589aa, #619bbb);
    1436         background-image: linear-gradient(to top, #5589aa, #619bbb);
    1437     }
    1438 
    1439     #adminmenu li.menu-top li:hover a {
    1440         background-image: none;
    1441     }
    1442 
    1443     #adminmenu li.wp-has-current-submenu,
    1444     #adminmenu li.current.menu-top {
     1425    .auto-fold #adminmenu li.wp-has-current-submenu,
     1426    .auto-fold #adminmenu li.current.menu-top {
    14451427        border-top-color: #5A8FAD;
    14461428        border-bottom-color: #5589AA;
    14471429    }
    14481430
    1449     #adminmenu .wp-has-current-submenu .wp-submenu-wrap {
    1450         -webkit-box-shadow: 2px 2px 5px rgba( 0, 0, 0, 0.4 );
    1451         box-shadow: 2px 2px 5px rgba( 0, 0, 0, 0.4 );
     1431    .auto-fold #adminmenu a.wp-has-current-submenu:focus + .wp-submenu,
     1432    .auto-fold #adminmenu .wp-has-current-submenu .wp-submenu {
     1433        background-color: #fff;
     1434        border-color: #D0DFE9;
     1435        -webkit-box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.4);
     1436        box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.4);
    14521437    }
    14531438
    1454     #collapse-button div {
     1439    .auto-fold #collapse-button div {
    14551440        background-position: 0 -108px;
    14561441    }
    … …  
    24222407}
    24232408
    2424 .rtl #adminmenu .wp-submenu-wrap,
    2425 .rtl.folded #adminmenu .wp-has-current-submenu .wp-submenu-wrap{
     2409.rtl #adminmenu .wp-submenu,
     2410.rtl.folded #adminmenu .wp-has-current-submenu .wp-submenu {
    24262411    -webkit-box-shadow: -2px 2px 5px rgba( 0, 0, 0, 0.4 );
    24272412    box-shadow: -2px 2px 5px rgba( 0, 0, 0, 0.4 );
     2413}
     2414
     2415.rtl #adminmenu .wp-has-current-submenu .wp-submenu {
     2416    -webkit-box-shadow: none;
     2417    box-shadow: none;
    24282418}
    24292419
    … …  
    24392429/* Auto-folding of the admin menu for RTL */
    24402430@media only screen and (max-width: 900px) {
    2441     .rtl #adminmenu .wp-has-current-submenu .wp-submenu-wrap{
     2431    .rtl.auto-fold #adminmenu .wp-has-current-submenu .wp-submenu {
    24422432        -webkit-box-shadow: -2px 2px 5px rgba( 0, 0, 0, 0.4 );
    24432433        box-shadow: -2px 2px 5px rgba( 0, 0, 0, 0.4 );
    24442434    }
    24452435
    2446     .rtl #collapse-button div {
     2436    .rtl.auto-fold #collapse-button div {
    24472437        background-position: 0 -72px;
    24482438    }

  • trunk/wp-admin/css/colors-fresh.dev.css

    r21534 r21574  
    482482#adminmenu a:hover,
    483483#adminmenu li.menu-top > a:focus,
    484 #adminmenu ul.wp-submenu a:hover,
     484#adminmenu .wp-submenu a:hover,
    485485#the-comment-list .comment a:hover,
    486486#rightnow a:hover,
    … …  
    10141014
    10151015#adminmenu a.menu-top,
    1016 .folded #adminmenu li.menu-top,
    10171016#adminmenu .wp-submenu .wp-submenu-head {
    10181017    border-top-color: #f9f9f9;
    … …  
    10241023}
    10251024
    1026 #adminmenu li.menu-top:hover > a,
    1027 #adminmenu li.menu-top.focused > a,
    1028 #adminmenu li.menu-top > a:focus {
     1025#adminmenu li.menu-top:hover,
     1026#adminmenu li.opensub > a.menu-top,
     1027#adminmenu li > a.menu-top:focus {
    10291028    background-color: #e4e4e4;
     1029    color: #d54e21;
    10301030    text-shadow: 0 1px 0 rgba( 255, 255, 255, 0.4 );
    10311031}
    … …  
    10961096}
    10971097
    1098 #adminmenu .wp-submenu ul {
     1098#adminmenu .wp-submenu,
     1099.folded #adminmenu a.wp-has-current-submenu:focus + .wp-submenu,
     1100.folded #adminmenu .wp-has-current-submenu .wp-submenu {
    10991101    background-color: #fff;
    1100 }
    1101 
    1102 #adminmenu .wp-submenu-wrap,
    1103 #adminmenu .wp-submenu ul {
    1104     border-color: #dfdfdf;
    1105 }
    1106 
    1107 #adminmenu .wp-submenu-wrap,
    1108 .folded #adminmenu .wp-has-current-submenu .wp-submenu-wrap {
    1109     -webkit-box-shadow: 2px 2px 5px rgba( 0, 0, 0, 0.4 );
    1110     box-shadow: 2px 2px 5px rgba( 0, 0, 0, 0.4 );
     1102    border-color: #dfdfdf;
     1103    -webkit-box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.4);
     1104    box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.4);
    11111105}
    11121106
    11131107#adminmenu .wp-submenu .wp-submenu-head {
    1114     border-right-color: #dfdfdf;
    1115     background-color: #ececec;
    1116 }
    1117 
    1118 #adminmenu div.wp-submenu {
    1119     background-color: transparent;
     1108    background-color: #e4e4e4;
     1109    color: #333;
    11201110}
    11211111
    … …  
    11231113#collapse-menu {
    11241114    color: #aaa;
     1115    border-top-color: #f9f9f9;
    11251116}
    11261117
    … …  
    11531144/* Auto-folding of the admin menu */
    11541145@media only screen and (max-width: 900px) {
    1155     #adminmenu li.menu-top {
    1156         border-top-color: #f9f9f9;
    1157         border-bottom-color: #dfdfdf;
    1158     }
    1159 
    1160     #adminmenu li.wp-has-current-submenu,
    1161     #adminmenu li.current.menu-top {
    1162         background: #777;
     1146    .auto-fold #adminmenu li.wp-has-current-submenu,
     1147    .auto-fold #adminmenu li.current.menu-top {
     1148        background-color: #777;
    11631149        background-image: -webkit-gradient(linear, left bottom, left top, from(#6d6d6d), to(#808080));
    11641150        background-image: -webkit-linear-gradient(bottom, #6d6d6d, #808080);
    1165         background-image:    -moz-linear-gradient(bottom, #6d6d6d, #808080);
    1166         background-image:      -o-linear-gradient(bottom, #6d6d6d, #808080);
    1167         background-image: linear-gradient(to top, #6d6d6d, #808080);
     1151        background-image: -moz-linear-gradient(bottom, #6d6d6d, #808080);
     1152        background-image: -o-linear-gradient(bottom, #6d6d6d, #808080);
     1153        background-image: linear-gradient(bottom, #6d6d6d, #808080);
    11681154    }
    11691155
    1170     #adminmenu li.menu-top li:hover a {
    1171         background-image: none;
    1172     }
    1173 
    1174     #adminmenu li.wp-has-current-submenu,
    1175     #adminmenu li.current.menu-top {
     1156    .auto-fold #adminmenu li.wp-has-current-submenu,
     1157    .auto-fold #adminmenu li.current.menu-top {
    11761158        border-top-color: #808080;
    11771159        border-bottom-color: #6d6d6d;
    11781160    }
    11791161
    1180     #adminmenu .wp-has-current-submenu .wp-submenu-wrap {
    1181         -webkit-box-shadow: 2px 2px 5px rgba( 0, 0, 0, 0.4 );
    1182         box-shadow: 2px 2px 5px rgba( 0, 0, 0, 0.4 );
     1162    .auto-fold #adminmenu a.wp-has-current-submenu:focus + .wp-submenu,
     1163    .auto-fold #adminmenu .wp-has-current-submenu .wp-submenu {
     1164        background-color: #fff;
     1165        border-color: #dfdfdf;
     1166        -webkit-box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.4);
     1167        box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.4);
    11831168    }
    11841169
    1185     #collapse-button div {
     1170    .auto-fold #collapse-button div {
    11861171        background-position: 0 -108px;
    11871172    }
    … …  
    20702055}
    20712056
    2072 .rtl #adminmenu .wp-submenu-wrap,
    2073 .rtl.folded #adminmenu .wp-has-current-submenu .wp-submenu-wrap{
     2057.rtl #adminmenu .wp-submenu,
     2058.rtl.folded #adminmenu .wp-has-current-submenu .wp-submenu {
    20742059    -webkit-box-shadow: -2px 2px 5px rgba( 0, 0, 0, 0.4 );
    20752060    box-shadow: -2px 2px 5px rgba( 0, 0, 0, 0.4 );
     2061}
     2062
     2063.rtl #adminmenu .wp-has-current-submenu .wp-submenu {
     2064    -webkit-box-shadow: none;
     2065    box-shadow: none;
    20762066}
    20772067
    … …  
    20872077/* Auto-folding of the admin menu for RTL */
    20882078@media only screen and (max-width: 900px) {
    2089     .rtl #adminmenu .wp-has-current-submenu .wp-submenu-wrap{
     2079    .rtl.auto-fold #adminmenu a.wp-has-current-submenu:focus + .wp-submenu,
     2080    .rtl.auto-fold #adminmenu .wp-has-current-submenu .wp-submenu {
    20902081        -webkit-box-shadow: -2px 2px 5px rgba( 0, 0, 0, 0.4 );
    20912082        box-shadow: -2px 2px 5px rgba( 0, 0, 0, 0.4 );
    20922083    }
    20932084
    2094     .rtl #collapse-button div {
     2085    .rtl.auto-fold #collapse-button div {
    20952086        background-position: 0 -72px;
    20962087    }

  • trunk/wp-admin/css/ie-rtl.dev.css

    r20272 r21574  
    2828}
    2929
    30 #adminmenu .wp-submenu .wp-submenu .wp-submenu-wrap,
    31 #adminmenu .wp-menu-open .wp-submenu .wp-submenu-wrap {
     30#adminmenu .wp-submenu .wp-submenu .wp-submenu,
     31#adminmenu .wp-menu-open .wp-submenu .wp-submenu {
    3232    border: 1px solid #dfdfdf;
    3333}
    … …  
    4040#adminmenu .wp-submenu .wp-submenu-head {
    4141    padding: 6px 10px 6px 4px;
    42 }
    43 
    44 #adminmenu .wp-menu-arrow {
    45     display: none !important;
    4642}
    4743

  • trunk/wp-admin/css/ie.dev.css

    r21547 r21574  
    7575}
    7676
    77 #adminmenu li.wp-not-current-submenu:hover .wp-menu-arrow {
    78     display: none;
    79 }
    80 
    81 #wpcontent #adminmenu .wp-submenu li.wp-submenu-head {
    82     padding: 3px 4px 4px 10px;
     77#adminmenu .wp-menu-arrow {
     78    display: none !important;
     79}
     80
     81#adminmenu .wp-submenu li.wp-submenu-head {
     82    padding: 6px 4px 7px 10px;
    8383    zoom: 100%;
    8484}
    … …  
    8686.js.folded #adminmenu .menu-top {
    8787    height: 30px;
    88 }
    89 
    90 .js.folded #adminmenu .wp-submenu {
    91     margin: -1px 0 0 0;
    9288}
    9389

  • trunk/wp-admin/css/wp-admin-rtl.dev.css

    r21465 r21574  
    343343------------------------------------------------------------------------------*/
    344344
     345.folded #wpcontent {
     346    margin-left: 0;
     347    margin-right: 52px;
     348}
     349
     350.folded.wp-admin #footer {
     351    margin-left: 15px;
     352    margin-right: 52px;
     353}
     354
    345355#adminmenuback,
    346356#adminmenuwrap {
    … …  
    358368}
    359369
    360 .folded #adminmenu .wp-submenu,
    361 .folded #adminmenu .wp-has-current-submenu .wp-submenu {
     370
     371.folded #adminmenu .wp-submenu.sub-open,
     372.folded #adminmenu .opensub .wp-submenu,
     373.folded #adminmenu .wp-has-current-submenu .wp-submenu.sub-open,
     374.folded #adminmenu .wp-has-current-submenu.opensub .wp-submenu,
     375.folded #adminmenu a.menu-top:focus + .wp-submenu,
     376.folded #adminmenu .wp-has-current-submenu a.menu-top:focus + .wp-submenu,
     377.no-js.folded #adminmenu .wp-has-submenu:hover .wp-submenu  {
    362378    left: auto;
    363     right: 26px;
    364 }
    365 
    366 #adminmenu .wp-submenu.sub-open,
    367 #adminmenu li.focused.wp-not-current-submenu .wp-submenu,
    368 .folded #adminmenu li.focused.wp-has-current-submenu .wp-submenu,
    369 .folded #adminmenu .wp-has-current-submenu .wp-submenu.sub-open,
    370 .no-js #adminmenu .wp-has-submenu:hover .wp-submenu,
    371 .no-js.folded #adminmenu .wp-has-current-submenu:hover .wp-submenu {
    372     padding: 0 0 8px 8px;
    373 }
    374 
    375 #adminmenu div.wp-menu-image {
    376     float: right;
    377 }
    378 
    379 #adminmenu li li {
    380     margin-left: 0;
    381     margin-right: 8px
     379    right: 32px;
     380}
     381
     382#adminmenu div.wp-menu-image,
     383.folded #adminmenu div.wp-menu-image {
     384    float: right;
     385    width: 30px;
    382386}
    383387
    … …  
    392396    padding-left: 0;
    393397    padding-right: 18px;
    394 }
    395 
    396 .folded #adminmenu li li {
    397     margin-left: inherit;
    398     margin-right: 0
    399 }
    400 
    401 .folded #adminmenu li li a {
    402     padding-left: inherit;
    403     padding-right: 0
    404398}
    405399
    … …  
    445439
    446440#adminmenu .wp-menu-image img {
    447     float: right;
    448     padding: 5px 2px 0 0;
     441    padding: 7px 7px 0 0;
    449442}
    450443
    451444#adminmenu .wp-submenu .wp-submenu-head {
    452445    padding: 6px 10px 5px 4px;
    453 }
    454 
    455 #adminmenu li .wp-submenu-wrap {
    456     border-width: 1px 0 1px 1px;
    457     border-style: solid none solid solid;
     446    -webkit-border-top-right-radius: 0;
     447    -webkit-border-top-left-radius: 3px;
     448    border-top-right-radius: 0;
     449    border-top-left-radius: 3px;
     450}
     451
     452.folded #adminmenu li.wp-has-current-submenu .wp-submenu {
     453    border-width: 1px;
     454    border-style: solid;
    458455    -webkit-border-bottom-right-radius: 0;
    459456    -webkit-border-bottom-left-radius: 3px;
    … …  
    466463}
    467464
    468 .folded #adminmenu .wp-submenu ul {
    469     border-width: 0 1px 0 0;
    470 }
    471 
    472 .folded #adminmenu .wp-submenu a {
    473     padding-left: 0;
    474     padding-right: 10px;
    475 }
    476 
    477 .folded #adminmenu a.wp-has-submenu {
    478     margin-left: 0;
    479     margin-right: 40px;
    480 }
    481 
    482465#adminmenu .awaiting-mod,
    483466#adminmenu span.update-plugins,
    … …  
    494477/* Auto-folding of the admin menu */
    495478@media only screen and (max-width: 900px) {
    496     #adminmenu li .wp-submenu,
    497     #adminmenu .wp-has-current-submenu .wp-submenu {
     479    .auto-fold #wpcontent {
     480        margin-left: 0;
     481        margin-right: 52px;
     482    }
     483
     484    .auto-fold.wp-admin #footer {
     485        margin-left: 15px;
     486        margin-right: 52px;
     487    }
     488
     489    .auto-fold #adminmenu .wp-submenu.sub-open,
     490    .auto-fold #adminmenu .opensub .wp-submenu,
     491    .auto-fold #adminmenu .wp-has-current-submenu .wp-submenu.sub-open,
     492    .auto-fold #adminmenu .wp-has-current-submenu.opensub .wp-submenu,
     493    .auto-fold #adminmenu a.menu-top:focus + .wp-submenu,
     494    .auto-fold #adminmenu .wp-has-current-submenu a.menu-top:focus + .wp-submenu,
     495    .no-js.auto-fold #adminmenu .wp-has-submenu:hover .wp-submenu  {
    498496        left: auto;
    499         right: 26px;
     497        right: 32px;
    500498    }
    501499
    502     #adminmenu li.focused.wp-has-current-submenu .wp-submenu,
    503     #adminmenu .wp-has-current-submenu .wp-submenu.sub-open {
    504         padding: 0 0 8px 8px;
    505     }
    506 
    507     .folded #adminmenu .wp-not-current-submenu li a {
     500    .auto-fold #adminmenu .wp-not-current-submenu li a {
    508501        padding-left: 0;
    509502        padding-right: 12px;
    510503    }
    511504
    512     #adminmenu li li,
    513     #adminmenu li li a {
    514         padding-left: inherit;
    515         padding-right: 0
    516     }
    517 
    518     .wp-menu-arrow {
     505    .auto-fold .wp-menu-arrow {
    519506        -moz-transform:    translate( -27px );
    520507        -webkit-transform: translate( -27px );
    … …  
    524511    }
    525512
    526     #adminmenu .wp-submenu ul {
    527         border-width: 0 1px 0 0;
    528     }
    529 
    530     #adminmenu .wp-submenu a {
    531         padding-left: 0;
    532         padding-right: 10px;
    533     }
    534 
    535     #adminmenu a.wp-has-submenu {
    536         margin-left: 0;
    537         margin-right: 40px;
    538     }
    539 
    540     body #wpcontent {
    541         margin-left: 0;
    542         margin-right: 52px;
    543     }
    544 
    545     body .wp-admin #footer {
    546         margin-left: 15px;
    547         margin-right: 52px;
     513    .auto-fold #adminmenu li.wp-has-current-submenu .wp-submenu {
     514        border-width: 1px;
     515        border-style: solid;
     516        -webkit-border-bottom-right-radius: 0;
     517        -webkit-border-bottom-left-radius: 3px;
     518        -webkit-border-top-right-radius: 0;
     519        -webkit-border-top-left-radius: 3px;
     520        border-bottom-right-radius: 0;
     521        border-bottom-left-radius: 3px;
     522        border-top-right-radius: 0;
     523        border-top-left-radius: 3px;
    548524    }
    549525}
    … …  
    16401616    margin-left: 0;
    16411617    margin-right: 165px;
    1642 }
    1643 
    1644 .folded #wpcontent {
    1645     margin-left: 0;
    1646     margin-right: 52px;
    1647 }
    1648 
    1649 .folded.wp-admin #footer {
    1650     margin-left: 15px;
    1651     margin-right: 52px;
    16521618}
    16531619

  • trunk/wp-admin/css/wp-admin.dev.css

    r21547 r21574  
    7777#adminmenuwrap,
    7878#adminmenu,
    79 #adminmenu .wp-submenu,
    80 #adminmenu .wp-submenu-wrap,
    81 .folded #adminmenu .wp-has-current-submenu .wp-submenu {
     79#adminmenu .wp-submenu {
    8280    width: 145px;
    8381}
    … …  
    13311329}
    13321330
     1331#adminmenu li {
     1332    margin: 0;
     1333    padding: 0;
     1334    cursor: pointer;
     1335}
     1336
     1337#adminmenu a {
     1338    display: block;
     1339    line-height: 18px;
     1340    padding: 2px 5px;
     1341}
     1342
     1343#adminmenu li.menu-top {
     1344    min-height: 28px;
     1345    position: relative;
     1346}
     1347
    13331348#adminmenu .wp-submenu {
    13341349    list-style: none;
    1335     padding: 0;
     1350    padding: 4px 0;
    13361351    margin: 0;
    1337     overflow: hidden;
    1338 }
    1339 
    1340 #adminmenu li .wp-submenu,
    1341 .folded #adminmenu .wp-has-current-submenu .wp-submenu {
    1342     display: none;
    13431352    position: absolute;
    1344     top: -1px;
     1353    top: -1000em;
    13451354    left: 146px;
    13461355    z-index: 999;
    1347     overflow: hidden;
    1348 }
    1349 
    1350 .js #adminmenu .wp-submenu.sub-open,
    1351 .folded #adminmenu .wp-has-current-submenu .wp-submenu.sub-open,
    1352 .no-js #adminmenu .wp-has-submenu:hover .wp-submenu,
     1356    overflow: visible;
     1357    border-width: 1px;
     1358    border-style: solid;
     1359    -webkit-border-bottom-right-radius: 3px;
     1360    -webkit-border-top-right-radius: 3px;
     1361    border-bottom-right-radius: 3px;
     1362    border-top-right-radius: 3px;
     1363}
     1364
     1365.js #adminmenu .sub-open,
     1366.js #adminmenu .opensub .wp-submenu,
     1367#adminmenu a.menu-top:focus + .wp-submenu,
     1368.no-js li.wp-has-submenu:hover .wp-submenu {
     1369    top: -1px;
     1370}
     1371
    13531372#adminmenu .wp-has-current-submenu .wp-submenu,
    1354 #adminmenu li.focused .wp-submenu {
    1355     display: block;
    1356 }
    1357 
    1358 #adminmenu .wp-has-current-submenu .wp-submenu {
     1373.no-js li.wp-has-current-submenu:hover .wp-submenu,
     1374#adminmenu a.wp-has-current-submenu:focus + .wp-submenu,
     1375#adminmenu .wp-has-current-submenu .wp-submenu.sub-open,
     1376#adminmenu .wp-has-current-submenu.opensub .wp-submenu {
    13591377    position: relative;
    13601378    z-index: 2;
    … …  
    13631381    right: auto;
    13641382    bottom: auto;
    1365     padding: 0;
    1366 }
    1367 
    1368 #adminmenu .wp-has-current-submenu .wp-submenu-wrap {
     1383    border: 0 none;
     1384
    13691385    -webkit-box-shadow: none;
    13701386    box-shadow: none;
    13711387}
    13721388
    1373 .folded #adminmenu .wp-submenu,
     1389.folded #adminmenu .wp-submenu.sub-open,
     1390.folded #adminmenu .opensub .wp-submenu,
     1391.folded #adminmenu .wp-has-current-submenu .wp-submenu.sub-open,
     1392.folded #adminmenu .wp-has-current-submenu.opensub .wp-submenu,
     1393.folded #adminmenu a.menu-top:focus + .wp-submenu,
     1394.folded #adminmenu .wp-has-current-submenu a.menu-top:focus + .wp-submenu,
     1395.no-js.folded #adminmenu .wp-has-submenu:hover .wp-submenu  {
     1396    top: -1px;
     1397    left: 32px;
     1398}
     1399
     1400.folded #adminmenu a.wp-has-current-submenu:focus + .wp-submenu,
    13741401.folded #adminmenu .wp-has-current-submenu .wp-submenu {
    1375     top: -5px;
    1376     left: 26px;
    1377 }
    1378 
    1379 #adminmenu .wp-submenu.sub-open,
    1380 #adminmenu li.focused.wp-not-current-submenu .wp-submenu,
    1381 .folded #adminmenu li.focused.wp-has-current-submenu .wp-submenu,
    1382 .folded #adminmenu .wp-has-current-submenu .wp-submenu.sub-open,
    1383 .no-js #adminmenu .wp-has-submenu:hover .wp-submenu,
    1384 .no-js.folded #adminmenu .wp-has-current-submenu:hover .wp-submenu {
    1385     padding: 0 8px 8px 0;
    1386 }
    1387 
    1388 .no-js #adminmenu .wp-has-current-submenu:hover .wp-submenu,
    1389 #adminmenu .wp-has-current-submenu .wp-submenu {
    1390     padding: 0;
     1402    border-width: 1px;
     1403    border-style: solid;
     1404    position: absolute;
     1405    top: -1000em;
    13911406}
    13921407
    … …  
    13941409    font-size: 12px;
    13951410    line-height: 18px;
     1411    margin: 0;
     1412    padding-left: 12px;
     1413}
     1414
     1415#adminmenu .wp-not-current-submenu li > a {
     1416    padding-left: 16px;
     1417}
     1418
     1419#adminmenu .wp-has-current-submenu ul > li > a,
     1420.folded #adminmenu li.menu-top .wp-submenu > li > a {
     1421    padding-left: 12px;
    13961422}
    13971423
    … …  
    13991425#adminmenu .wp-submenu-head {
    14001426    font-size: 13px;
     1427    font-weight: bold;
    14011428    line-height: 18px;
    1402 }
    1403 
    1404 #adminmenu div.wp-submenu-head {
     1429    padding: 0;
     1430}
     1431
     1432#adminmenu .wp-submenu-head,
     1433.folded #adminmenu .wp-menu-name {
    14051434    display: none;
    14061435}
    14071436
    1408 .folded #adminmenu div.wp-submenu-head {
     1437.folded #adminmenu .wp-submenu-head {
    14091438    display: block;
    14101439}
    14111440
    1412 .folded #adminmenu a.menu-top {
    1413     display: none;
     1441#adminmenu .wp-submenu li {
     1442    padding: 0;
     1443    margin: 0;
     1444    overflow: hidden;
     1445}
     1446
     1447#adminmenu a.menu-top {
     1448    border-width: 1px 0;
     1449    border-style: solid none;
     1450}
     1451
     1452#adminmenu .wp-menu-image img {
     1453    padding: 7px 0 0 7px;
     1454    opacity: 0.6;
     1455    filter: alpha(opacity=60);
     1456}
     1457
     1458#adminmenu div.wp-menu-name {
     1459    padding: 5px;
    14141460}
    14151461
    … …  
    14181464    width: 28px;
    14191465    height: 28px;
     1466    margin-top: -1px;
    14201467}
    14211468
    14221469.folded #adminmenu div.wp-menu-image {
    1423     width: 30px;
    1424 }
    1425 
    1426 #adminmenu li {
    1427     margin: 0;
    1428     padding: 0;
    1429     cursor: pointer;
    1430 }
    1431 
    1432 #adminmenu a {
    1433     display: block;
    1434     line-height: 18px;
    1435     padding: 2px 5px;
    1436 }
    1437 
    1438 #adminmenu li.menu-top {
    1439     min-height: 29px;
    1440     position: relative;
    1441 }
    1442 
    1443 #adminmenu a.menu-top {
    1444     font-weight: bold;
    1445     line-height: 18px;
    1446     min-width: 10em;
    1447     padding: 5px 5px;
    1448     border-width: 1px 0 1px;
    1449     border-style: solid;
    1450 }
    1451 
    1452 #adminmenu li.wp-menu-open {
    1453     border-width: 0 0 1px;
    1454     border-style: solid;
    1455 }
    1456 
    1457 #adminmenu .wp-submenu ul {
    1458     padding: 4px 0;
    1459 }
    1460 
    1461 #adminmenu .wp-submenu a {
    1462     margin: 0;
    1463 }
    1464 
    1465 #adminmenu li li {
    1466     margin-left: 8px;
    1467 }
    1468 
    1469 #adminmenu .wp-submenu a,
    1470 #adminmenu li li a,
    1471 .folded #adminmenu .wp-not-current-submenu li a {
    1472     padding-left: 12px;
    1473 }
    1474 
    1475 #adminmenu .wp-not-current-submenu li a {
    1476     padding-left: 18px;
    1477 }
    1478 
    1479 .folded #adminmenu li li {
    1480     margin-left: 0;
    1481 }
    1482 
    1483 .folded #adminmenu li li a {
    1484     padding-left: 0;
     1470    width: 32px;
     1471    margin-top: 0;
     1472    position: absolute;
     1473    z-index: 25;
     1474}
     1475
     1476.folded #adminmenu a.menu-top {
     1477    height: 29px;
    14851478}
    14861479
    14871480.wp-menu-arrow {
    14881481    display: none;
    1489     cursor: auto;
    14901482    z-index: 25;
    14911483    position: absolute;
    … …  
    15001492    -ms-transform:     translate( 146px );
    15011493    transform:         translate( 146px );
    1502 }
    1503 
    1504 #adminmenu li.wp-has-current-submenu .wp-menu-arrow,
    1505 #adminmenu li.menu-top:hover .wp-menu-arrow,
    1506 #adminmenu li.current .wp-menu-arrow,
    1507 #adminmenu li.focused .wp-menu-arrow,
    1508 #adminmenu li.menu-top.wp-has-submenu:hover .wp-menu-arrow div {
    1509     display: block;
    1510 }
    1511 
    1512 #adminmenu li.wp-not-current-submenu:hover .wp-menu-arrow div {
    1513     display: none;
    1514 }
    1515 
    1516 #adminmenu li.menu-top:hover .wp-menu-arrow,
    1517 #adminmenu li.menu-top.focused .wp-menu-arrow {
    1518     z-index: 1001;
    1519 }
    1520 
    1521 .ie8 #adminmenu li.menu-top:hover .wp-menu-arrow {
    1522     display: none;
    15231494}
    15241495
    … …  
    15461517    border-width: 1px 0;
    15471518    border-style: solid;
     1519    top: 0;
    15481520}
    15491521
    … …  
    15561528}
    15571529
     1530#adminmenu li.wp-has-current-submenu .wp-menu-arrow,
     1531#adminmenu a.menu-top:focus .wp-menu-arrow,
     1532.no-js #adminmenu li.wp-has-submenu:hover .wp-menu-arrow,
     1533#adminmenu li.current .wp-menu-arrow,
     1534#adminmenu li.wp-has-submenu.opensub .wp-menu-arrow {
     1535    display: block;
     1536}
     1537
     1538#adminmenu li.current .wp-menu-arrow,
     1539#adminmenu li.wp-menu-open .wp-menu-arrow {
     1540    top: 0;
     1541}
     1542
     1543.no-js #adminmenu li.wp-has-submenu:hover .wp-menu-arrow,
     1544#adminmenu .opensub a.wp-has-submenu .wp-menu-arrow,
     1545#adminmenu a.wp-has-submenu:focus .wp-menu-arrow {
     1546    z-index: 1001;
     1547}
     1548
     1549.ie8 #adminmenu li.menu-top:hover .wp-menu-arrow {
     1550    display: none;
     1551}
     1552
    15581553#adminmenu .wp-not-current-submenu .wp-menu-arrow div {
    15591554    width: 15px;
    … …  
    15641559
    15651560.wp-menu-arrow,
    1566 .folded #adminmenu li.menu-top:hover .wp-menu-arrow {
     1561.folded #adminmenu li.wp-not-current-submenu .wp-menu-arrow,
     1562.no-js #adminmenu li.wp-not-current-submenu:hover .wp-menu-arrow {
    15671563    display: none;
    15681564}
    15691565
    1570 .folded #adminmenu li.current:hover .wp-menu-arrow,
    1571 .folded #adminmenu li.menu-top.wp-menu-open:hover .wp-menu-arrow {
     1566.folded #adminmenu li.current .wp-menu-arrow,
     1567.folded #adminmenu li.wp-menu-open .wp-menu-arrow {
    15721568    display: block;
    1573     z-index: 125;
    1574 }
    1575 
    1576 #adminmenu .wp-submenu li {
    1577     padding: 0;
    1578     margin: 0;
    1579 }
    1580 
    1581 .folded #adminmenu li.menu-top {
    1582     border-width: 1px 0;
    1583     border-style: solid none;
    1584 }
    1585 
    1586 #adminmenu .wp-menu-image img {
    1587     float: left;
    1588     padding: 5px 0 0 2px;
    1589     opacity: 0.6;
    1590     filter: alpha(opacity=60);
     1569    top: 1px;
    15911570}
    15921571
    … …  
    16151594#adminmenu .wp-submenu .wp-submenu-head {
    16161595    padding: 6px 4px 5px 10px;
    1617     cursor: default;
     1596    margin: -4px -1px 4px;
    16181597    border-width: 1px 0;
    16191598    border-style: solid;
    1620 }
    1621 
    1622 #adminmenu li .wp-submenu-wrap {
    1623     border-width: 1px 1px 1px 0;
    1624     border-style: solid solid solid none;
    1625     position: relative;
    1626     -webkit-border-bottom-right-radius: 3px;
    16271599    -webkit-border-top-right-radius: 3px;
    1628     border-bottom-right-radius: 3px;
    16291600    border-top-right-radius: 3px;
    16301601}
    16311602
    1632 #adminmenu li.wp-menu-open .wp-submenu-wrap {
     1603#adminmenu li.wp-menu-open {
     1604    border-width: 0 0 1px;
     1605    border-style: solid;
     1606}
     1607
     1608#adminmenu li.current,
     1609.folded #adminmenu li.wp-menu-open {
    16331610    border: 0 none;
    16341611}
    16351612
    1636 .folded #adminmenu .wp-submenu .wp-submenu-wrap {
    1637     margin-top: 3px;
    1638 }
    1639 
    1640 .folded #adminmenu .wp-has-current-submenu {
     1613.folded #adminmenu li.wp-has-current-submenu {
    16411614    margin-bottom: 1px;
    16421615}
    … …  
    16441617.folded #adminmenu .wp-has-current-submenu.menu-top-last {
    16451618    margin-bottom: 0;
    1646 }
    1647 
    1648 .folded #adminmenu .wp-has-current-submenu .wp-submenu-wrap {
    1649     margin-top: 4px;
    1650 }
    1651 
    1652 .folded #adminmenu .wp-submenu ul {
    1653     border-width: 0 0 0 1px;
    1654     border-style: solid;
    1655 }
    1656 
    1657 .folded #adminmenu .wp-submenu a {
    1658     padding-left: 10px;
    1659 }
    1660 
    1661 .folded #adminmenu a.wp-has-submenu {
    1662     margin-left: 40px;
    1663 }
    1664 
    1665 #adminmenu .wp-menu-image a {
    1666     height: 24px;
    16671619}
    16681620
    … …  
    16971649    font-size: 12px;
    16981650    line-height: 34px;
     1651    border-width: 1px 0 0;
     1652    border-style: solid;
    16991653}
    17001654
    … …  
    17201674/* Auto-folding of the admin menu */
    17211675@media only screen and (max-width: 900px) {
    1722     #wpcontent,
    1723     #footer {
     1676    .auto-fold #wpcontent,
     1677    .auto-fold #footer {
    17241678        margin-left: 52px;
    17251679    }
    17261680
    1727     #adminmenuback,
    1728     #adminmenuwrap,
    1729     #adminmenu,
    1730     #adminmenu li.menu-top {
     1681    .auto-fold #adminmenuback,
     1682    .auto-fold #adminmenuwrap,
     1683    .auto-fold #adminmenu,
     1684    .auto-fold #adminmenu li.menu-top {
    17311685        width: 32px;
    17321686    }
    17331687
    1734     #adminmenu .wp-has-current-submenu .wp-submenu {
     1688    .auto-fold #adminmenu .wp-submenu.sub-open,
     1689    .auto-fold #adminmenu .opensub .wp-submenu,
     1690    .auto-fold #adminmenu .wp-has-current-submenu .wp-submenu.sub-open,
     1691    .auto-fold #adminmenu .wp-has-current-submenu.opensub .wp-submenu,
     1692    .auto-fold #adminmenu a.menu-top:focus + .wp-submenu,
     1693    .auto-fold #adminmenu .wp-has-current-submenu a.menu-top:focus + .wp-submenu  {
     1694        top: -1px;
     1695        left: 32px;
     1696    }
     1697
     1698    .auto-fold #adminmenu a.wp-has-current-submenu:focus + .wp-submenu,
     1699    .auto-fold #adminmenu .wp-has-current-submenu .wp-submenu {
     1700        border-width: 1px;
     1701        border-style: solid;
     1702        position: absolute;
     1703        top: -1000em;
     1704    }
     1705
     1706    .auto-fold #adminmenu li.menu-top .wp-submenu > li > a {
     1707        padding-left: 12px;
     1708    }
     1709
     1710    .auto-fold #adminmenu .wp-menu-name {
    17351711        display: none;
    1736         position: absolute;
    1737         width: 145px;
    1738         z-index: 999;
    1739         overflow: hidden;
    17401712    }
    17411713
    1742     #adminmenu .wp-has-current-submenu .wp-submenu.sub-open {
     1714    .auto-fold #adminmenu .wp-submenu-head {
    17431715        display: block;
    17441716    }
    17451717
    1746     #adminmenu li .wp-submenu,
    1747     #adminmenu .wp-has-current-submenu .wp-submenu {
    1748         top: -5px;
    1749         left: 26px;
     1718    .auto-fold #adminmenu div.wp-menu-image {
     1719        width: 32px;
     1720        margin-top: 0;
     1721        position: absolute;
     1722        z-index: 25;
    17501723    }
    17511724
    1752     #adminmenu li.focused.wp-has-current-submenu .wp-submenu,
    1753     #adminmenu .wp-has-current-submenu .wp-submenu.sub-open {
    1754         padding: 0 8px 8px 0;
     1725    .auto-fold #adminmenu a.menu-top {
     1726        height: 29px;
    17551727    }
    17561728
    1757     #adminmenu div.wp-submenu-head {
    1758         display: block;
    1759     }
    1760 
    1761     #adminmenu a.menu-top {
    1762         display: none;
    1763     }
    1764 
    1765     #adminmenu div.wp-menu-image {
    1766         width: 30px;
    1767     }
    1768 
    1769     #adminmenu .wp-not-current-submenu li a {
    1770         padding-left: 12px;
    1771     }
    1772 
    1773     #adminmenu li li {
    1774         margin-left: 0;
    1775     }
    1776 
    1777     #adminmenu li li a {
    1778         padding-left: 0;
    1779     }
    1780 
    1781     .wp-menu-arrow {
     1729    .auto-fold .wp-menu-arrow {
    17821730        -moz-transform:    translate( 33px );
    17831731        -webkit-transform: translate( 33px );
    … …  
    17871735    }
    17881736
    1789     #adminmenu li.menu-top:hover .wp-menu-arrow {
     1737    .auto-fold #adminmenu li.wp-not-current-submenu .wp-menu-arrow {
    17901738        display: none;
    17911739    }
    17921740
    1793     #adminmenu li.current:hover .wp-menu-arrow,
    1794     #adminmenu li.menu-top.wp-menu-open:hover .wp-menu-arrow {
     1741    .auto-fold #adminmenu li.current .wp-menu-arrow,
     1742    .auto-fold #adminmenu li.wp-menu-open .wp-menu-arrow {
    17951743        display: block;
    1796         z-index: 125;
     1744        top: 1px;
    17971745    }
    17981746
    1799     #adminmenu li.menu-top {
    1800         border-width: 1px 0;
    1801         border-style: solid none;
     1747    .auto-fold #adminmenu li.wp-menu-open {
     1748        border: 0 none;
    18021749    }
    18031750
    1804     #adminmenu .wp-submenu .wp-submenu-wrap {
    1805         margin-top: 3px;
    1806     }
    1807 
    1808     #adminmenu .wp-has-current-submenu {
     1751    .auto-fold #adminmenu li.wp-has-current-submenu {
    18091752        margin-bottom: 1px;
    18101753    }
    18111754
    1812     #adminmenu .wp-has-current-submenu.menu-top-last {
     1755    .auto-fold #adminmenu .wp-has-current-submenu.menu-top-last {
    18131756        margin-bottom: 0;
    18141757    }
    18151758
    1816     #adminmenu .wp-has-current-submenu .wp-submenu-wrap {
    1817         margin-top: 4px;
    1818     }
    1819 
    1820     #adminmenu .wp-submenu ul {
    1821         border-width: 0 0 0 1px;
    1822         border-style: solid;
    1823     }
    1824 
    1825     #adminmenu .wp-submenu a {
    1826         padding-left: 10px;
    1827     }
    1828 
    1829     #adminmenu a.wp-has-submenu {
    1830         margin-left: 40px;
    1831     }
    1832 
    1833     #collapse-menu {
     1759    .auto-fold #collapse-menu span {
    18341760        display: none;
    18351761    }

  • trunk/wp-admin/js/common.dev.js

    r21529 r21574  
    162162$(document).ready( function() {
    163163    var lastClicked = false, checks, first, last, checked, menu = $('#adminmenu'),
    164         pageInput = $('input.current-page'), currentPage = pageInput.val(), refresh;
    165 
    166     // admin menu
    167     refresh = function(i, el){ // force the browser to refresh the tabbing index
    168         var node = $(el), tab = node.attr('tabindex');
    169         if ( tab )
    170             node.attr('tabindex', '0').attr('tabindex', tab);
    171     };
    172 
    173     $('#collapse-menu', menu).click(function(){
     164        pageInput = $('input.current-page'), currentPage = pageInput.val();
     165
     166    // when the menu is folded, make the fly-out submenu header clickable
     167    menu.on('click.wp-submenu-head', '.wp-submenu-head', function(e){
     168        $(e.target).parent().siblings('a').get(0).click();
     169    });
     170
     171    $('#collapse-menu').on('click.collapse-menu', function(e){
    174172        var body = $(document.body);
    175173
    … …  
    177175        $('#adminmenu div.wp-submenu').css('margin-top', '');
    178176
    179         if ( body.hasClass('folded') ) {
    180             body.removeClass('folded');
    181             setUserSetting('mfold', 'o');
     177        if ( $(window).width() < 900 ) {
     178            if ( body.hasClass('auto-fold') ) {
     179                body.removeClass('auto-fold');
     180                setUserSetting('unfold', 1);
     181                body.removeClass('folded');
     182                deleteUserSetting('mfold');
     183            } else {
     184                body.addClass('auto-fold');
     185                deleteUserSetting('unfold');
     186            }
    182187        } else {
    183             body.addClass('folded');
    184             setUserSetting('mfold', 'f');
    185         }
    186         return false;
     188            if ( body.hasClass('folded') ) {
     189                body.removeClass('folded');
     190                deleteUserSetting('mfold');
     191            } else {
     192                body.addClass('folded');
     193                setUserSetting('mfold', 'f');
     194            }
     195        }
    187196    });
    188197
    … …  
    191200            var b, h, o, f, m = $(this).find('.wp-submenu'), menutop, wintop, maxtop;
    192201
    193             if ( m.is(':visible') )
     202            if ( parseInt( m.css('top'), 10 ) > -5 )
    194203                return;
    195204
    … …  
    214223                m.css('margin-top', '');
    215224
    216             menu.find('.wp-submenu').removeClass('sub-open');
    217             m.addClass('sub-open');
     225            menu.find('li.menu-top').removeClass('opensub');
     226            $(this).addClass('opensub');
    218227        },
    219228        out: function(){
    220             $(this).find('.wp-submenu').removeClass('sub-open').css('margin-top', '');
     229            $(this).removeClass('opensub').find('.wp-submenu').css('margin-top', '');
    221230        },
    222231        timeout: 200,
    … …  
    225234    });
    226235
    227     // Tab to select, Enter to open sub, Esc to close sub and focus the top menu
    228     $('li.wp-has-submenu > a.wp-not-current-submenu', menu).bind('keydown.adminmenu', function(e){
    229         if ( e.which != 13 )
    230             return;
    231 
    232         var target = $(e.target);
    233 
    234         e.stopPropagation();
    235         e.preventDefault();
    236 
    237         menu.find('.wp-submenu').removeClass('sub-open');
    238         target.siblings('.wp-submenu').toggleClass('sub-open').find('a[role="menuitem"]').each(refresh);
    239     }).each(refresh);
    240 
    241     $('a[role="menuitem"]', menu).bind('keydown.adminmenu', function(e){
    242         if ( e.which != 27 )
    243             return;
    244 
    245         var target = $(e.target);
    246 
    247         e.stopPropagation();
    248         e.preventDefault();
    249 
    250         target.add( target.siblings() ).closest('.sub-open').removeClass('sub-open').siblings('a.wp-not-current-submenu').focus();
     236    menu.on('focus.adminmenu', '.wp-submenu a', function(e){
     237        $(e.target).closest('li.menu-top').addClass('opensub');
     238    }).on('blur.adminmenu', '.wp-submenu a', function(e){
     239        $(e.target).closest('li.menu-top').removeClass('opensub');
    251240    });
    252241

  • trunk/wp-admin/menu-header.php

    r21311 r21574  
    8888            if ( ! empty( $menu_hook ) || ( ('index.php' != $submenu_items[0][2]) && file_exists( WP_PLUGIN_DIR . "/$menu_file" ) ) ) {
    8989                $admin_is_parent = true;
    90                 echo "<div class='wp-menu-image'><a href='admin.php?page={$submenu_items[0][2]}' tabindex='-1' aria-label='$aria_label'>$img</a></div>$arrow<a href='admin.php?page={$submenu_items[0][2]}'$class $aria_attributes>$title</a>";
     90                echo "<a href='admin.php?page={$submenu_items[0][2]}'$class $aria_attributes>$arrow<div class='wp-menu-image'>$img</div><div class='wp-menu-name'>$title</div></a>";
    9191            } else {
    92                 echo "\n\t<div class='wp-menu-image'><a href='{$submenu_items[0][2]}' tabindex='-1' aria-label='$aria_label'>$img</a></div>$arrow<a href='{$submenu_items[0][2]}'$class $aria_attributes>$title</a>";
     92                echo "\n\t<a href='{$submenu_items[0][2]}'$class $aria_attributes>$arrow<div class='wp-menu-image'>$img</div><div class='wp-menu-name'>$title</div></a>";
    9393            }
    9494        } elseif ( ! empty( $item[2] ) && current_user_can( $item[1] ) ) {
    … …  
    9999            if ( ! empty( $menu_hook ) || ( ('index.php' != $item[2]) && file_exists( WP_PLUGIN_DIR . "/$menu_file" ) ) ) {
    100100                $admin_is_parent = true;
    101                 echo "\n\t<div class='wp-menu-image'><a href='admin.php?page={$item[2]}' tabindex='-1' aria-label='$aria_label'>$img</a></div>$arrow<a href='admin.php?page={$item[2]}'$class $aria_attributes>{$item[0]}</a>";
     101                echo "\n\t<a href='admin.php?page={$item[2]}'$class $aria_attributes>$arrow<div class='wp-menu-image'>$img</div><div class='wp-menu-name'>{$item[0]}</div></a>";
    102102            } else {
    103                 echo "\n\t<div class='wp-menu-image'><a href='{$item[2]}' tabindex='-1' aria-label='$aria_label'>$img</a></div>$arrow<a href='{$item[2]}'$class $aria_attributes>{$item[0]}</a>";
     103                echo "\n\t<a href='{$item[2]}'$class $aria_attributes>$arrow<div class='wp-menu-image'>$img</div><div class='wp-menu-name'>{$item[0]}</div></a>";
    104104            }
    105105        }
    106106
    107107        if ( ! empty( $submenu_items ) ) {
    108             echo "\n\t<div class='wp-submenu'><div class='wp-submenu-wrap'>";
    109             echo "<div class='wp-submenu-head'>{$item[0]}</div><ul>";
     108            echo "\n\t<ul class='wp-submenu wp-submenu-wrap'>";
     109            echo "<li class='wp-submenu-head'>{$item[0]}</li>";
     110   
    110111            $first = true;
    111112            foreach ( $submenu_items as $sub_key => $sub_item ) {
    … …  
    161162                }
    162163            }
    163             echo "</ul></div></div>";
     164            echo "</ul>";
    164165        }
    165166        echo "</li>";
Note: See TracChangeset for help on using the changeset viewer.