Updated site primary nav bar and improved drop-down submenu and made IE compatible, also cleaned up / improved menuitem admin area.

git-svn-id: http://code.elgg.org/elgg/trunk@5564 36083f99-b078-4883-b0ff-0f9b5a30f544

7 files changed, 97 insertions, 56 deletions

diff --git a/_graphics/more_sprite.png b/_graphics/more_sprite.png
new file mode 100644
index 000000000..655cced05
--- /dev/null
+++ b/_graphics/more_sprite.png
diff --git a/languages/en.php b/languages/en.php
index 53b46ca97..5bc18c5cb 100644
--- a/languages/en.php
+++ b/languages/en.php
@@ -511,6 +511,7 @@ To remove a widget drag it back to the <b>Widget gallery</b>.",
 	'admin:user:removeadmin:no' => "We could not remove administrator privileges from this user.",
 
 	'admin:menu_items' => 'Menu Items',
+	'admin:menu_items:configure' => 'Configure main menu items',
 	'admin:menu_items:description' => 'Select which menu items you want to show as featured links.  Unused items will be added as "More" at the end of the list.',
 	'admin:menu_items:hide_toolbar_entries' => 'Remove links from tool bar menu?',
 	'admin:menu_items:saved' => 'Menu items saved.',
diff --git a/views/default/admin/menu_items.php b/views/default/admin/menu_items.php
index 1233eeb1b..2bf71f083 100644
--- a/views/default/admin/menu_items.php
+++ b/views/default/admin/menu_items.php
@@ -22,8 +22,8 @@ $pulldown_values = array_flip($menu_sorted);
 $pulldown_values[''] = elgg_echo('none');
 
 echo elgg_view_title(elgg_echo('admin:menu_items'));
-echo elgg_view('output/longtext', array('value' => elgg_echo("admin:menu_items:description")));
-
+echo "<div class='admin_settings menuitems'><h3>".elgg_echo('admin:menu_items:configure')."</h3>";
+echo "<p class='margin_top'>".strip_tags(elgg_view('output/longtext', array('value' => elgg_echo("admin:menu_items:description"))))."</p>";
 $form_body = '';
 
 // @todo Could probably make this number configurable
@@ -41,9 +41,8 @@ for ($i=0; $i<6; $i++) {
 	));
 }
 
-$form_body .= '<br /><br />';
 // add arbitrary links
-$form_body .= elgg_view_title(elgg_echo('admin:add_menu_item'));
+$form_body .= "<h3>".elgg_echo('admin:add_menu_item')."</h3>";
 $form_body .= elgg_view('output/longtext', array('value' => elgg_echo("admin:add_menu_item:description")));
 
 $custom_items = get_config('menu_items_custom_items');
@@ -65,7 +64,7 @@ if (is_array($custom_items)) {
 			'value' => $url
 		));
 
-		$form_body .= "<li>$name_str: $name_input $url_str: $url_input $delete</li>";
+		$form_body .= "<li class='custom_menuitem'>$name_str: $name_input $url_str: $url_input $delete</li>";
 	}
 }
 
@@ -78,13 +77,13 @@ $url_input = elgg_view('input/text', array(
 	'internalname' => 'custom_item_urls[]',
 ));
 
-$form_body .= "<li>$name_str: $name_input $url_str: $url_input</li>
+$form_body .= "<li class='custom_menuitem'>$name_str: $name_input $url_str: $url_input</li>
 </ul>";
 
-$form_body .= '<br /><br />';
 $form_body .= elgg_view('input/submit', array('value' => elgg_echo('save')));
 
 echo elgg_view('input/form', array(
 	'body' => $form_body,
 	'action' => "{$vars['url']}action/admin/menu_items"
-));
\ No newline at end of file
+));
+echo "</div>";
\ No newline at end of file
diff --git a/views/default/css.php b/views/default/css.php
index e626780de..b9e3bf809 100644
--- a/views/default/css.php
+++ b/views/default/css.php
@@ -493,7 +493,7 @@ h2 {
 *************************************** */
 #elgg_header_contents h1 a {
 	font-size: 2em;
-	line-height:1.7em;
+	line-height:1.4em;
 	color: white;
 	font-style: italic;
 	font-family: Georgia, times, serif;
@@ -557,9 +557,6 @@ h2 {
 	padding:0;
 }
 .navigation a {
-	display:block;
-}
-.navigation a {
 	color:white;
 	margin:0 1px 0 0px;
 	text-decoration:none;
@@ -567,50 +564,99 @@ h2 {
 	font-size: 1em;
 	padding:3px 13px 0px 13px;
 	height:20px;
+	cursor: pointer;
+	display:block;
 }
-.navigation li a.hover,
-.navigation a:hover {
+.navigation li a:hover {
 	background:white;
-	color:#43575e;
+	color:#555555;
 	-moz-border-radius-topleft:4px;
 	-moz-border-radius-topright:4px;
 	-webkit-border-top-left-radius:4px;
 	-webkit-border-top-right-radius:4px;
+	-webkit-box-shadow: 2px -1px 1px rgba(0, 0, 0, 0.25);
+	-moz-box-shadow: 2px -1px 1px rgba(0, 0, 0, 0.25);
 }
 .navigation li.selected a {
 	background:white;
-	color:#43575e;
+	color:#555555;
 	-moz-border-radius-topleft:4px;
 	-moz-border-radius-topright:4px;
 	-webkit-border-top-left-radius:4px;
 	-webkit-border-top-right-radius:4px;
-	margin-top:2px;
+	margin-top:1px;
+	-webkit-box-shadow: 2px -1px 1px rgba(0, 0, 0, 0.25);
+	-moz-box-shadow: 2px -1px 1px rgba(0, 0, 0, 0.25);
 }
-.navigation_more {
+li.navigation_more {
 	overflow:hidden;
 }
-
-.navigation_more:hover{
+li.navigation_more:hover {
 	overflow:visible;
 }
-
+li.navigation_more:hover a {
+	background:white;
+	color:#555555;
+	-moz-border-radius-topleft:4px;
+	-moz-border-radius-topright:4px;
+	-webkit-border-top-left-radius:4px;
+	-webkit-border-top-right-radius:4px;
+	-webkit-box-shadow: 2px -1px 1px rgba(0, 0, 0, 0.25);
+	-moz-box-shadow: 2px -1px 1px rgba(0, 0, 0, 0.25);
+}
+li.navigation_more a.subnav span {
+	background-image: url(<?php echo $vars['url']; ?>_graphics/more_sprite.png);
+	background-repeat: no-repeat;
+	background-position: 0 4px;
+	padding-left: 12px;
+}
+li.navigation_more:hover a.subnav span,
+li.navigation_more a.subnav:hover span {
+	background-position: 0 -16px;
+}
 li.navigation_more ul {
-	z-index: 1;
-	border: 1px solid #999;
-	border-top: 0;
+	z-index: 7000;
+	min-width: 150px;
+	margin-left:-1px;
+	background-color:white;
+	border-left:1px solid #999999;
+	border-right:1px solid #999999;
+	border-bottom:1px solid #999999;
 	-moz-border-radius-bottomleft:4px;
 	-moz-border-radius-bottomright:4px;
 	-webkit-border-bottom-left-radius:4px;
 	-webkit-border-bottom-right-radius:4px;
+	-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.25);
+	-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.25);
 }
 li.navigation_more ul li {
 	float:none;
-	background-color:#4690D6;
 }
-li.navigation_more ul li:hover {
+.navigation li.navigation_more ul li a {
 	background:white;
-	color:#43575e;
+	color:#555555;
+	-webkit-border-radius: 0;
+	-moz-border-radius: 0;
+	-webkit-box-shadow: none;
+	-moz-box-shadow: none;
+}
+.navigation li.navigation_more ul li:last-child a,
+.navigation li.navigation_more ul li:last-child a:hover {
+	-moz-border-radius-bottomleft:4px;
+	-moz-border-radius-bottomright:4px;
+	-webkit-border-bottom-left-radius:4px;
+	-webkit-border-bottom-right-radius:4px;
 }
+.navigation li.navigation_more ul li a:hover {
+	background:#4690D6;
+	color:white;
+	margin:0;
+	-webkit-border-radius: 0;
+	-moz-border-radius: 0;
+	-webkit-box-shadow: none;
+	-moz-box-shadow: none;
+}
+
 
 /* ***************************************
 	FOOTER CONTENTS
@@ -1558,5 +1604,14 @@ a.action_button:focus {
 	border:1px solid #999999;
 	background:#dedede;
 }
-
+.configure_menuitems {
+	margin-bottom:30px;
+}
+.admin_settings.menuitems .input_pulldown {
+	margin-right:15px;
+	margin-bottom:10px;
+}
+.admin_settings.menuitems li.custom_menuitem {
+	margin-bottom:20px;
+}
 
diff --git a/views/default/css_ie.php b/views/default/css_ie.php
index f2bf30e34..1ec19b69f 100644
--- a/views/default/css_ie.php
+++ b/views/default/css_ie.php
@@ -4,6 +4,13 @@
 */
 * {zoom: 1;} /* trigger hasLayout in IE */
 
+/* main nav drop-down */
+#elgg_header {z-index:1;}
+.navigation li a:hover ul {display:block; position:absolute; top:21px; left:0;}
+.navigation li a:hover ul li a {display:block;}
+.navigation li.navigation_more ul li a {width:150px;background-color: #dedede;}
+
+
 #elgg_topbar_contents a.privatemessages_new span { 
 	display:block;
 	padding:1px;
@@ -16,13 +23,3 @@
 #elgg_topbar_contents a.privatemessages_new  {
 	padding:0 0 0 20px;
 }
-
-ul.topbar_tools ul a {
-	zoom: 1;
-}
-ul.topbar_tools li.menu a.tools {
-	padding-bottom:6px;
-}
-ul.topbar_tools ul a {
-	filter: alpha(opacity=90);
-}
\ No newline at end of file
diff --git a/views/default/css_ie6.php b/views/default/css_ie6.php
index c7935902f..57890e62d 100644
--- a/views/default/css_ie6.php
+++ b/views/default/css_ie6.php
@@ -5,23 +5,12 @@
 
 * {zoom: 1;} /* trigger hasLayout in IE */
 
-ul.topbar_tools ul {
-	line-height: 1.1em;
-}
-ul.topbar_tools ul a {
-	zoom: 1;
-}
-ul.topbar_tools ul a {
-	filter: alpha(opacity=90);
-}
-
-.collapsable_box  {
-	height:10px;
-}
-
-.search_listing_info {
-	/* height:40px; */
-}
+/* main nav drop-down */
+#elgg_header {z-index:1;}
+.navigation li a:hover ul {display:block; position:absolute; top:21px; left:0;}
+.navigation li a:hover ul li a {display:block;}
+.navigation li.navigation_more ul li a {width:150px;background-color: #dedede;}
 
+/* @todo check this one */
 .delete_button a { background-position-y: 2px; }
 .delete_button a:hover { background-position-y: -14px; }
\ No newline at end of file
diff --git a/views/default/navigation/site_nav.php b/views/default/navigation/site_nav.php
index 4a73d0084..1f97ce617 100644
--- a/views/default/navigation/site_nav.php
+++ b/views/default/navigation/site_nav.php
@@ -62,7 +62,7 @@ foreach ($more as $info) {
 
 if ($more_nav_html) {
 	$more = elgg_echo('more');
-	$nav_html .= "<li class=\"navigation_more\"><a title=\"$more\"><span>$more</span></a>
+	$nav_html .= "<li class='navigation_more'><a class='subnav' title=\"$more\"><span>$more</span></a>
 		<ul>
 			$more_nav_html
 		</ul>