Improve admin bar markup. Un-nest top level secondary menu. Remove unnecessary span. see #18197.

git-svn-id: http://svn.automattic.com/wordpress/trunk@19261 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
koopersmith 2011-11-12 00:26:55 +00:00
parent 64ab05ab09
commit f099d03f84
4 changed files with 35 additions and 68 deletions

View File

@ -142,15 +142,13 @@ class WP_Admin_Bar {
$this->recursive_render( $node ); $this->recursive_render( $node );
} }
if ( ! empty( $this->root->children->secondary ) ): ?></ul>
?><ul class="ab-top-menu top-secondary"><?php <ul class="ab-top-menu ab-top-secondary"><?php
foreach ( $this->root->children->secondary as $node ) { foreach ( $this->root->children->secondary as $node ) {
$this->recursive_render( $node ); $this->recursive_render( $node );
} }
?></ul><?php
endif;
?></ul> ?></ul>
</div> </div>
</div> </div>
@ -187,27 +185,19 @@ class WP_Admin_Bar {
?>><?php ?>><?php
if ( $is_parent ) :
?><span><?php
endif;
echo $node->title; echo $node->title;
if ( $is_parent ) :
?></span><?php
endif;
?></a> ?></a>
<?php <?php
if ( $is_parent ) : if ( $is_parent ) :
?><ul><?php ?><ul class="ab-submenu"><?php
foreach ( $node->children->primary as $child_node ) { foreach ( $node->children->primary as $child_node ) {
$this->recursive_render( $child_node ); $this->recursive_render( $child_node );
} }
if ( ! empty( $node->children->secondary ) ): if ( ! empty( $node->children->secondary ) ):
?><ul class="sub-secondary"><?php ?><ul class="ab-sub-secondary"><?php
foreach ( $node->children->secondary as $child_node ) { foreach ( $node->children->secondary as $child_node ) {
$this->recursive_render( $child_node ); $this->recursive_render( $child_node );
} }

File diff suppressed because one or more lines are too long

View File

@ -78,13 +78,13 @@
border-right: 1px solid #333; border-right: 1px solid #333;
} }
#wpadminbar .quicklinks .top-secondary > li { #wpadminbar .quicklinks .ab-top-secondary > li {
border-left: 1px solid #333; border-left: 1px solid #333;
border-right: 0; border-right: 0;
float: right; float: right;
} }
#wpadminbar .quicklinks .top-secondary > li > a { #wpadminbar .quicklinks .ab-top-secondary > li > a {
border-left: 1px solid #555; border-left: 1px solid #555;
border-right: 0; border-right: 0;
} }
@ -97,10 +97,6 @@
margin: 0; margin: 0;
} }
#wpadminbar .quicklinks a > span {
line-height: 28px;
}
#wpadminbar .quicklinks .menupop ul, #wpadminbar .quicklinks .menupop ul,
#wpadminbar .shortlink-input { #wpadminbar .shortlink-input {
margin: 0 0 0 -1px; margin: 0 0 0 -1px;
@ -118,7 +114,7 @@
border-color: #dfdfdf; border-color: #dfdfdf;
} }
#wpadminbar .quicklinks .top-secondary .menupop ul { #wpadminbar .quicklinks .ab-top-secondary .menupop ul {
right: 0; right: 0;
margin: 0 -1px 0 0; margin: 0 -1px 0 0;
} }
@ -136,12 +132,9 @@
} }
#wpadminbar .quicklinks .menupop ul li a, #wpadminbar .quicklinks .menupop ul li a,
#wpadminbar .quicklinks .menupop ul li a span,
#wpadminbar .quicklinks .menupop ul li a strong, #wpadminbar .quicklinks .menupop ul li a strong,
#wpadminbar .quicklinks .menupop.hover ul li a, #wpadminbar .quicklinks .menupop.hover ul li a,
#wpadminbar .quicklinks .menupop.hover ul li a span,
#wpadminbar.nojs .quicklinks .menupop:hover ul li a, #wpadminbar.nojs .quicklinks .menupop:hover ul li a,
#wpadminbar.nojs .quicklinks .menupop:hover ul li a span,
#wpadminbar .shortlink-input { #wpadminbar .shortlink-input {
line-height: 26px; line-height: 26px;
height: 26px; height: 26px;
@ -167,8 +160,8 @@
border-width: 1px; border-width: 1px;
} }
#wpadminbar .quicklinks .top-secondary .menupop li:hover > ul, #wpadminbar .quicklinks .ab-top-secondary .menupop li:hover > ul,
#wpadminbar .quicklinks .top-secondary .menupop li.hover > ul { #wpadminbar .quicklinks .ab-top-secondary .menupop li.hover > ul {
margin-left: 0; margin-left: 0;
left: inherit; left: inherit;
right: 100%; right: 100%;
@ -176,7 +169,7 @@
#wpadminbar .ab-top-menu > li:hover, #wpadminbar .ab-top-menu > li:hover,
#wpadminbar .ab-top-menu > li > a:focus { #wpadminbar .ab-top-menu > li > a:focus {
background: #3a3a3a; /* Fallback */ background-color: #3a3a3a; /* Fallback */
background-image: -ms-linear-gradient(bottom, #3a3a3a, #222); /* IE10 */ background-image: -ms-linear-gradient(bottom, #3a3a3a, #222); /* IE10 */
background-image: -moz-linear-gradient(bottom, #3a3a3a, #222); /* Firefox */ background-image: -moz-linear-gradient(bottom, #3a3a3a, #222); /* Firefox */
background-image: -o-linear-gradient(bottom, #3a3a3a, #222); /* Opera */ background-image: -o-linear-gradient(bottom, #3a3a3a, #222); /* Opera */
@ -192,11 +185,8 @@
} }
#wpadminbar.nojs .quicklinks .menupop:hover a, #wpadminbar.nojs .quicklinks .menupop:hover a,
#wpadminbar.nojs .quicklinks .menupop:hover span,
#wpadminbar .quicklinks .menupop.hover a, #wpadminbar .quicklinks .menupop.hover a,
#wpadminbar .quicklinks .menupop.hover span, #wpadminbar .quicklinks .menupop a:focus {
#wpadminbar .quicklinks .menupop a:focus,
#wpadminbar .quicklinks .menupop a:focus span {
color: #333; color: #333;
text-shadow: none; text-shadow: none;
} }
@ -207,38 +197,24 @@
background-color: #eaf2fa; background-color: #eaf2fa;
} }
#wpadminbar .quicklinks .menupop > a:focus {
background-color: #fff;
}
#wpadminbar .ab-top-menu > .menupop > a span {
white-space: nowrap;
}
#wpadminbar .ab-top-menu > li > a:hover, #wpadminbar .ab-top-menu > li > a:hover,
#wpadminbar .ab-top-menu > li > a:hover span, #wpadminbar .ab-top-menu > li > a:focus {
#wpadminbar .ab-top-menu > li > a:focus,
#wpadminbar .ab-top-menu > li > a:focus span {
color: #fafafa; color: #fafafa;
} }
#wpadminbar.nojs .ab-top-menu > li > a:hover span, #wpadminbar .menupop .menupop > a {
#wpadminbar .ab-top-menu > li.hover > a:hover span {
background: none;
}
#wpadminbar .menupop li a > span {
display: block; display: block;
background: url(../images/admin-bar-sprite.png?d=11122010) right -31px no-repeat; background: url(../images/admin-bar-sprite.png?d=11122010) 93% -31px no-repeat;
padding: 0 1.5em 0 0; padding-right: 2em;
} }
#wpadminbar .top-secondary .menupop li a > span { #wpadminbar .ab-top-secondary .menupop .menupop > a {
background-position: -28px -31px; background: url(../images/admin-bar-sprite-rtl.png?d=11122010) 1em -31px no-repeat;
padding: 0 0 0 1.5em; padding-left: 2em;
padding-right: 1em;
} }
#wpadminbar .quicklinks .menupop ul.sub-secondary { #wpadminbar .quicklinks .menupop ul.ab-sub-secondary {
display: block; display: block;
position: relative; position: relative;
right: auto; right: auto;
@ -254,10 +230,10 @@
box-shadow: none; box-shadow: none;
} }
#wpadminbar .quicklinks .menupop .sub-secondary > li:hover, #wpadminbar .quicklinks .menupop .ab-sub-secondary > li:hover,
#wpadminbar .quicklinks .menupop .sub-secondary > li.hover, #wpadminbar .quicklinks .menupop .ab-sub-secondary > li.hover,
#wpadminbar .quicklinks .menupop .sub-secondary > li a:focus { #wpadminbar .quicklinks .menupop .ab-sub-secondary > li a:focus {
background: #dfdfdf; background-color: #dfdfdf;
} }
#wpadminbar .quicklinks a span#ab-updates { #wpadminbar .quicklinks a span#ab-updates {
@ -277,7 +253,7 @@
color: #000; color: #000;
} }
#wpadminbar .top-secondary { #wpadminbar .ab-top-secondary {
float: right; float: right;
} }
@ -326,6 +302,11 @@
height: 18px; height: 18px;
} }
#wpadminbar #wp-admin-bar-my-account .user-info .display-name,
#wpadminbar #wp-admin-bar-my-account .user-info .username {
text-shadow: none;
display: block;
}
#wpadminbar #wp-admin-bar-my-account .user-info .display-name { #wpadminbar #wp-admin-bar-my-account .user-info .display-name {
color: #333; color: #333;
} }
@ -441,10 +422,6 @@
background: url(../images/wp-logo-white.png) no-repeat 13px 6px; background: url(../images/wp-logo-white.png) no-repeat 13px 6px;
} }
#wpadminbar .wp-admin-bar-logo > a span {
height: 28px;
}
#wpadminbar.nojs .wp-admin-bar-logo:hover > a, #wpadminbar.nojs .wp-admin-bar-logo:hover > a,
#wpadminbar .wp-admin-bar-logo.hover > a, #wpadminbar .wp-admin-bar-logo.hover > a,
#wpadminbar .quicklinks .wp-admin-bar-logo > a:focus { #wpadminbar .quicklinks .wp-admin-bar-logo > a:focus {

View File

@ -452,7 +452,7 @@ function wp_default_styles( &$styles ) {
$styles->add( 'farbtastic', '/wp-admin/css/farbtastic.css', array(), '1.3u1' ); $styles->add( 'farbtastic', '/wp-admin/css/farbtastic.css', array(), '1.3u1' );
$styles->add( 'jcrop', '/wp-includes/js/jcrop/jquery.Jcrop.css', array(), '0.9.8' ); $styles->add( 'jcrop', '/wp-includes/js/jcrop/jquery.Jcrop.css', array(), '0.9.8' );
$styles->add( 'imgareaselect', '/wp-includes/js/imgareaselect/imgareaselect.css', array(), '0.9.1' ); $styles->add( 'imgareaselect', '/wp-includes/js/imgareaselect/imgareaselect.css', array(), '0.9.1' );
$styles->add( 'admin-bar', "/wp-includes/css/admin-bar$suffix.css", array(), '20111109' ); $styles->add( 'admin-bar', "/wp-includes/css/admin-bar$suffix.css", array(), '20111111' );
$styles->add( 'wp-jquery-ui-dialog', "/wp-includes/css/jquery-ui-dialog$suffix.css", array(), '20111107' ); $styles->add( 'wp-jquery-ui-dialog', "/wp-includes/css/jquery-ui-dialog$suffix.css", array(), '20111107' );
$styles->add( 'editor-buttons', "/wp-includes/css/editor-buttons$suffix.css", array(), '20111107' ); $styles->add( 'editor-buttons', "/wp-includes/css/editor-buttons$suffix.css", array(), '20111107' );
$styles->add( 'wp-pointer', "/wp-includes/css/wp-pointer$suffix.css", array(), '20111017' ); $styles->add( 'wp-pointer', "/wp-includes/css/wp-pointer$suffix.css", array(), '20111017' );