Favourites drop-down styling

git-svn-id: http://svn.automattic.com/wordpress/trunk@9240 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-admin/admin-header.php

@@ -86,7 +86,6 @@ if ( '' == $blog_name )
 <a href="#edit_settings" id="hide-settings-link" class="show-settings" style="display:none;"><?php _e('Hide Options') ?></a>
 </span>
 <?php } ?></h1>
-</div>
 
 <div id="wphead-info">
 <?php favorite_actions(); ?>
@@ -100,6 +99,9 @@ if ( '' == $blog_name )
 <a href="<?php echo wp_logout_url() ?>" title="<?php _e('Log Out') ?>"><?php _e('Log Out'); ?></a></p>
 </div>
 </div>
+
+</div>
+
 <?php
 require(ABSPATH . 'wp-admin/menu-header.php');
 ?>

wp-admin/css/colors-fresh.css

@@ -79,7 +79,7 @@ strong .post-com-count span {
 
 #post-body ul#category-tabs li.ui-tabs-selected, .button-secondary,
 #quicktags, #login form .submit input, .search-box .button,
-#ed_reply_toolbar, .favorite-action, #favorite-first {
+#ed_reply_toolbar {
 	background-color: #cee1ef !important;
 }
 
@@ -219,9 +219,7 @@ ul#widget-list li.widget-list-item h4.widget-title {
 .button-secondary,
 #login form .submit input,
 div.dashboard-widget-submit input,
-#edit-slug-buttons a.save,
+#edit-slug-buttons a.save {
-.favorite-action,
-#favorite-first {
 	background-color: #e5e5e5;
 	color: #246;
 	border-color: #80b5d0;

wp-admin/includes/template.php

@@ -2961,8 +2961,8 @@ function favorite_actions() {
 	$first = array_keys($allowed_actions);
 	$first = $first[0];
 	echo '<div id="favorite-actions">';
-	echo '<div id="favorite-first"><a href="' . $first . '">' . $allowed_actions[$first] . '</a></div>';
+	echo '<div id="favorite-first"><a href="' . $first . '">' . $allowed_actions[$first] . '</a></div><div id="favorite-toggle"><br /></div>';
-	echo '<div id="favorite-action">';
+	echo '<div id="favorite-inside">';
 
 	array_shift($allowed_actions);
 

wp-admin/js/menu.js

@@ -72,10 +72,12 @@ adminMenu = {
 	}
 };
 
-$(document).ready(function(){adminMenu.init();});
+$(document).ready(function(){
-})(jQuery);
+	adminMenu.init();
 
-jQuery( function($) {	
+	$('#favorite-inside').width($('#favorite-first').width()+24);
-	$('#favorite-actions').bind( 'mouseenter', function(){$('#favorite-action').removeClass('slideUp').addClass('slideDown'); setTimeout(function(){if ( $('#favorite-action').hasClass('slideDown') ) { $('#favorite-action').slideDown('fast') }}, 300) } );
+	$('#favorite-toggle, #favorite-inside').bind( 'mouseenter', function(){$('#favorite-inside').removeClass('slideUp').addClass('slideDown'); setTimeout(function(){if ( $('#favorite-inside').hasClass('slideDown') ) { $('#favorite-inside').slideDown(100); $('#favorite-first').addClass('slide-down'); }}, 200) } );
-	$('#favorite-actions').bind( 'mouseleave', function(){$('#favorite-action').removeClass('slideDown').addClass('slideUp'); setTimeout(function(){if ( $('#favorite-action').hasClass('slideUp') ) { $('#favorite-action').slideUp('fast') }}, 500) } );
+
+	$('#favorite-toggle, #favorite-inside').bind( 'mouseleave', function(){$('#favorite-inside').removeClass('slideDown').addClass('slideUp'); setTimeout(function(){if ( $('#favorite-inside').hasClass('slideUp') ) { $('#favorite-inside').slideUp(100, function(){ $('#favorite-first').removeClass('slide-down'); } ); }}, 300) } );
 });
+})(jQuery);

wp-admin/wp-admin.css

@@ -598,12 +598,12 @@ a.view-comment-post-link {
 /* Admin Header */
 
 #wphead-info {
-	position: absolute;
+	float: right;
-	right: 15px;
+	margin: 0 15px;
-	top: 0;
 }
 
 #user_info {
+	float: right;
 	font-size: 12px;
 	line-height: 46px;
 	height: 46px;
@@ -639,8 +639,8 @@ a#view-site-link {
 }
 
 #logo50 {
+	float: left;
 	margin: 9px 0 0 20px;
-	position: absolute;
 }
 
 ul#adminmenu li.write-new-button {
@@ -664,9 +664,9 @@ ul#adminmenu li.write-new-button a {
 
 #wphead h1 {
 	font: normal 22px Georgia, "Times New Roman", Times, serif;
-	padding: 11px 170px 5px 60px;
+	padding: 10px 10px 5px;
 	margin: 0;
-	margin-right: 15%;
+	float: left;
 }
 
 /* menu stuff */
@@ -2492,49 +2492,82 @@ abbr.required {
 
 /* favorite-actions */
 #favorite-actions {
-	position: absolute;
+	float: left;
-	left: -150px;
+	margin: 11px 12px 0;
-	top: 10px;
+	min-width: 130px;
-	width: 130px;
+	position: relative;
-	z-index: 10;
+	
 }
 
 #favorite-first {
-	-moz-border-radius: 4px;
+	-moz-border-radius: 12px;
-	-khtml-border-radius: 4px;
+	-khtml-border-radius: 12px;
-	-webkit-border-radius: 4px;
+	-webkit-border-radius: 12px;
-	border-radius: 4px;
+	border-radius: 12px;
+	line-height: 15px;
+	padding: 3px 30px 4px 12px;
+	border-color: #464646;
 	border-width: 1px;
 	border-style: solid;
-	padding: 4px 8px;
+	background-color: #797979;
+	background-image: url(images/fav.png);
+	background-repeat: repeat-x;
+	background-position: 0 center;
+}
+
+#favorite-inside {
+	margin: 0 0 0 1px;
+	padding: 2px 8px 4px;
+	border-width: 1px;
+	border-style: solid;
+	position: absolute;
+	z-index: 11;
+	display: none;
+	-moz-border-radius: 0 0 12px 12px;
+	-webkit-border-bottom-right-radius: 12px;
+	-webkit-border-bottom-left-radius: 12px;
+	-khtml-border-bottom-right-radius: 12px;
+	-khtml-border-bottom-left-radius: 12px;
+	border-bottom-right-radius: 12px;
+	border-bottom-left-radius: 12px;
+	border-color: #797979;
+	background-color: #797979;
+	background-image: url(images/fav-bottom.png);
+	background-repeat: repeat-x;
+	background-position: 0 bottom;
 }
 
 .favorite-action {
-	margin: -3px 0 0;
+	padding: 3px;
-	padding: 4px 8px;
-	border-width: 1px;
-	border-top-width: 3px;
-	border-style: solid;
-	-moz-border-radius: 0 0 4px 4px;
-	-webkit-border-bottom-right-radius: 4px;
-	-webkit-border-bottom-left-radius: 4px;
-	-khtml-border-bottom-right-radius: 4px;
-	-khtml-border-bottom-left-radius: 4px;
-	border-bottom-right-radius: 4px;
-	border-bottom-left-radius: 4px;
 }
 
-#favorite-action {
-	padding: 0;
-	margin: 0;
-	display: none;
-}
 #favorite-actions a {
-	padding: 4px 0;
+	padding: 4px 5px 4px 0;
 	text-decoration: none;
+	color: #eee;
+	font-size: 11px;
 }
 
-#favorite-first {
+#favorite-toggle {
-	padding-right: 22px;
+	height: 22px;
-	background: url(images/menu-open.png) 108px 5px no-repeat;
+	position: absolute;
+	right: 0;
+	top: 1px;
+	width: 28px;
+	background: transparent url(images/fav-arrow.png) no-repeat 0 -4px;
 }
+
+#favorite-actions .slide-down {
+	background-image: url(images/fav-top.png);
+	background-repeat: repeat-x;
+	background-position: 0 top;
+	-moz-border-radius: 12px 12px 0 0;
+	-webkit-border-bottom-right-radius: 0;
+	-webkit-border-bottom-left-radius: 0;
+	-khtml-border-bottom-right-radius: 0;
+	-khtml-border-bottom-left-radius: 0;
+	border-bottom-right-radius: 0;
+	border-bottom-left-radius: 0;
+	border-bottom: 1px solid #626262;
+}
+

wp-includes/script-loader.php

@@ -278,7 +278,7 @@ function wp_default_scripts( &$scripts ) {
 		$scripts->add( 'dashboard', '/wp-admin/js/dashboard.js', array( 'jquery', 'admin-comments', 'postbox', 'settings-box' ), '20081016' );
 
 		$scripts->add( 'hoverIntent', '/wp-includes/js/hoverIntent.js', array('jquery'), '20070327' );
-		$scripts->add( 'menu', '/wp-admin/js/menu.js', array( 'jquery', 'hoverIntent' ), '20081013' );
+		$scripts->add( 'menu', '/wp-admin/js/menu.js', array( 'jquery', 'hoverIntent' ), '20081018' );
 
 	}
 }
@@ -310,7 +310,7 @@ function wp_default_styles( &$styles ) {
 
 	$rtl_styles = array( 'global', 'colors', 'dashboard', 'ie', 'install', 'login', 'media', 'theme-editor', 'upload', 'widgets', 'press-this', 'press-this-ie' );
 
-	$styles->add( 'wp-admin', '/wp-admin/wp-admin.css', array(), '20081013' );
+	$styles->add( 'wp-admin', '/wp-admin/wp-admin.css', array(), '20081018' );
 	$styles->add_data( 'wp-admin', 'rtl', '/wp-admin/rtl.css' );
 
 	$styles->add( 'ie', '/wp-admin/css/ie.css' );