Refs #3021: elgg-section-$section => elgg-menu-$menu-$section

Added elgg-menu-hz for horizontal menus

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

13 files changed, 75 insertions, 55 deletions

diff --git a/views/default/css/admin.php b/views/default/css/admin.php
index a6e1c1e85..b32e1382b 100644
--- a/views/default/css/admin.php
+++ b/views/default/css/admin.php
@@ -698,10 +698,10 @@ a.elgg-widget-edit-button:hover, a.elgg-widget-delete-button:hover {
 	background: #cccccc;
 	text-decoration: none;
 }
-.elgg-hover-admin a {
+.elgg-menu-hover-admin a {
 	color: red;
 }
-.elgg-hover-admin a:hover {
+.elgg-menu-hover-admin a:hover {
 	color: white;
 	background-color: red;
 }
diff --git a/views/default/css/elements/navigation.php b/views/default/css/elements/navigation.php
index d0bb4a630..210ff4cbe 100644
--- a/views/default/css/elements/navigation.php
+++ b/views/default/css/elements/navigation.php
@@ -85,22 +85,38 @@
 /* ***************************************
  * MENUS
  *
- * .elgg-menu does two things:
- *   1) Vertically centers inline images and icons
- *   2) Abstracts commonly-duplicated code used when adding "separators" to horizontal menus
- *
- * To make a menu horizontal:
- * .elgg-menu-$menu > li {display:inline-block}
- *
- * To add separators to a horizontal menu:
- * .elgg-menu-$menu > li > a {display:inline-block}
- * .elgg-menu-$menu > li:after {content: '|'}
+ * To add separators to a menu:
+ * .elgg-menu-$menu > li:after {content: '|'; background: ...;}
  *************************************** */
-.elgg-menu > li {vertical-align: middle;position:relative}
-.elgg-menu > li:after {display: inline-block}
-.elgg-menu > li:last-child:after {display:none}
-.elgg-menu > li > a {display:block}
-.elgg-menu img, .elgg-menu .elgg-icon {vertical-align: middle; margin-top: -2px}
+/* For dropdown/flyout menus */
+.elgg-menu > li {
+	position:relative;
+} 
+
+/* For separators */
+.elgg-menu > li:last-child:after {
+	display:none
+} 
+
+/* Maximize click target */
+.elgg-menu > li > a {
+	display:block
+} 
+
+/* Image placement correction */
+.elgg-menu img, 
+.elgg-menu .elgg-icon {
+	vertical-align: middle; 
+	margin-top: -2px;
+} 
+
+/* Horizontal menus w/ separator support */
+.elgg-menu-hz > li,
+.elgg-menu-hz > li:after,
+.elgg-menu-hz > li > a {
+	display:inline-block;
+	vertical-align:middle;
+}
 
 /* ***************************************
 	BREADCRUMBS
@@ -157,7 +173,7 @@
 	text-decoration: none;
 }
 
-.elgg-menu-topbar.elgg-section-alt {
+.elgg-menu-topbar-alt {
 	float:right;
 }
 
@@ -366,10 +382,10 @@
 	background: #cccccc;
 	text-decoration: none;
 }
-.elgg-hover-admin a {
+.elgg-menu-hover-admin a {
 	color: red;
 }
-.elgg-hover-admin a:hover {
+.elgg-menu-hover-admin a:hover {
 	color: white;
 	background-color: red;
 }
@@ -388,7 +404,7 @@
 	padding: 0 4px;
 }
 
-.elgg-menu-footer.elgg-section-alt {
+.elgg-menu-footer-alt {
 	float: right;
 }
 
diff --git a/views/default/navigation/menu/default.php b/views/default/navigation/menu/default.php
index 52049f6e0..1a7f292b8 100644
--- a/views/default/navigation/menu/default.php
+++ b/views/default/navigation/menu/default.php
@@ -2,19 +2,19 @@
 /**
  * Default menu
  *
+ * @uses $vars['name']
  * @uses $vars['menu']
  * @uses $vars['class']
  */
 
 $class = "elgg-menu elgg-menu-{$vars['name']}";
 if (isset($vars['class'])) {
-	$class = "$class {$vars['class']}";
+	$class .= " {$vars['class']}";
 }
 
 foreach ($vars['menu'] as $section => $menu_items) {
-	echo elgg_view('navigation/menu/elements/group', array(
-		'section' => $section, 
+	echo elgg_view('navigation/menu/elements/section', array(
 		'items' => $menu_items,
-		'class' => $class,
+		'class' => "$class elgg-menu-{$vars['name']}-$section",
 	));
 }
diff --git a/views/default/navigation/menu/elements/item.php b/views/default/navigation/menu/elements/item.php
index e11b01bbf..893bbd205 100644
--- a/views/default/navigation/menu/elements/item.php
+++ b/views/default/navigation/menu/elements/item.php
@@ -28,7 +28,7 @@ if ($item_class) {
 echo "<li $class>";
 echo $item->getContent();
 if ($children) {
-	echo elgg_view('navigation/menu/elements/group', array(
+	echo elgg_view('navigation/menu/elements/section', array(
 		'items' => $children,
 		'class' => 'elgg-menu elgg-child-menu',
 	));
diff --git a/views/default/navigation/menu/elements/group.php b/views/default/navigation/menu/elements/section.php
index b0c0f54d4..f72db847f 100644
--- a/views/default/navigation/menu/elements/group.php
+++ b/views/default/navigation/menu/elements/section.php
@@ -4,13 +4,9 @@
  *
  * @uses $vars['items']
  * @uses $vars['class']
- * @uses $vars['section']
  */
 
 $class = elgg_extract('class', $vars, '');
-if (isset($vars['section'])) {
-	$class = "$class elgg-section-{$vars['section']}";
-}
 
 echo "<ul class=\"$class\">";
 foreach ($vars['items'] as $menu_item) {
diff --git a/views/default/navigation/menu/metadata.php b/views/default/navigation/menu/metadata.php
index ae6a9bebb..742aee3ad 100644
--- a/views/default/navigation/menu/metadata.php
+++ b/views/default/navigation/menu/metadata.php
@@ -11,7 +11,7 @@ $entity = $vars['entity'];
 $handler = elgg_extract('handler', $vars, '');
 
 ?>
-<ul class="elgg-menu elgg-menu-metadata">
+<ul class="elgg-menu elgg-menu-hz elgg-menu-metadata">
 	<li>
 		<?php echo elgg_view('output/access', array('entity' => $entity)); ?>
 	</li>
diff --git a/views/default/navigation/menu/page.php b/views/default/navigation/menu/page.php
index 92006e956..bd2611790 100644
--- a/views/default/navigation/menu/page.php
+++ b/views/default/navigation/menu/page.php
@@ -21,9 +21,8 @@ if (isset($vars['selected_item'])) {
 }
 
 foreach ($vars['menu'] as $section => $menu_items) {
-	echo elgg_view('navigation/menu/elements/group', array(
+	echo elgg_view('navigation/menu/elements/section', array(
 		'items' => $menu_items,
-		'section' => $section,
-		'class' => $class,
+		'class' => "$class elgg-menu-page-$section",
 	));
 }
diff --git a/views/default/navigation/menu/site.php b/views/default/navigation/menu/site.php
index 41c81de03..aa41840fe 100644
--- a/views/default/navigation/menu/site.php
+++ b/views/default/navigation/menu/site.php
@@ -6,7 +6,7 @@
  * @uses $vars['menu']['more']
  */
 
-echo '<ul class="elgg-menu elgg-menu-site clearfix">';
+echo '<ul class="elgg-menu elgg-menu-site elgg-menu-site-default clearfix">';
 foreach ($vars['menu']['default'] as $menu_item) {
 	echo elgg_view('navigation/menu/elements/item', array('item' => $menu_item));
 }
@@ -17,9 +17,8 @@ if (isset($vars['menu']['more'])) {
 	$more = elgg_echo('more');
 	echo "<a title=\"$more\">$more</a>";
 	
-	echo elgg_view('navigation/menu/elements/group', array(
-		'class' => 'elgg-menu', 
-		'section' => 'more', 
+	echo elgg_view('navigation/menu/elements/section', array(
+		'class' => 'elgg-menu elgg-menu-site-more', 
 		'items' => $vars['menu']['more'],
 	));
 	
diff --git a/views/default/navigation/menu/user_hover.php b/views/default/navigation/menu/user_hover.php
index bbca41e21..8e3c4de9f 100644
--- a/views/default/navigation/menu/user_hover.php
+++ b/views/default/navigation/menu/user_hover.php
@@ -24,29 +24,39 @@ echo "<li>$name_link</li>";
 
 // actions
 if (elgg_is_logged_in() && $actions) {
-	echo '<li><ul>';
+	
+	echo '<li>';
 	foreach ($actions as $menu_item) {
-		echo elgg_view('navigation/menu/elements/item', array('item' => $menu_item));
+		echo elgg_view('navigation/menu/elements/section', array(
+			'class' => "elgg-menu elgg-menu-hover-actions",
+			'items' => $actions,
+		));
 	}
-	echo '</ul></li>';
+	echo '</li>';
 }
 
 // main
 if ($main) {
-	echo '<li><ul>';
-	foreach ($main as $menu_item) {
-		echo elgg_view('navigation/menu/elements/item', array('item' => $menu_item));
-	}
-	echo '</ul></li>';
+	echo '<li>';
+	
+	echo elgg_view('navigation/menu/elements/section', array(
+		'class' => 'elgg-menu elgg-menu-hover-default',
+		'items' => $main,
+	));
+	
+	echo '</li>';
 }
 
 // admin
 if (elgg_is_admin_logged_in() && $admin) {
-	echo '<li><ul class="elgg-hover-admin">';
-	foreach ($admin as $menu_item) {
-		echo elgg_view('navigation/menu/elements/item', array('item' => $menu_item));
-	}
-	echo '</ul></li>';
+	echo '<li>';
+	
+	echo elgg_view('navigation/menu/elements/section', array(
+		'class' => 'elgg-menu elgg-menu-hover-admin',
+		'items' => $admin,
+	));
+	
+	echo '</li>';
 }
 
 echo '</ul>';
diff --git a/views/default/page/elements/footer.php b/views/default/page/elements/footer.php
index 96e8c59ca..e818c0eff 100644
--- a/views/default/page/elements/footer.php
+++ b/views/default/page/elements/footer.php
@@ -8,4 +8,4 @@
  *
  */
 
-echo elgg_view_menu('footer', array('sort_by' => 'weight'));
\ No newline at end of file
+echo elgg_view_menu('footer', array('sort_by' => 'weight', 'class' => 'elgg-menu-hz'));
\ No newline at end of file
diff --git a/views/default/page/elements/topbar.php b/views/default/page/elements/topbar.php
index 6184e2846..849b1fdcd 100644
--- a/views/default/page/elements/topbar.php
+++ b/views/default/page/elements/topbar.php
@@ -7,7 +7,7 @@
 
 
 // Elgg logo
-echo elgg_view_menu('topbar', array('sort_by' => 'weight'));
+echo elgg_view_menu('topbar', array('sort_by' => 'weight', array('elgg-menu-hz')));
 
 // elgg tools menu
 // need to echo this empty view for backward compatibility.
diff --git a/views/default/page/layouts/content/filter.php b/views/default/page/layouts/content/filter.php
index f22f2b761..7577f2839 100644
--- a/views/default/page/layouts/content/filter.php
+++ b/views/default/page/layouts/content/filter.php
@@ -45,5 +45,5 @@ if (elgg_is_logged_in() && $context) {
 		elgg_register_menu_item('filter', $tab);
 	}
 
-	echo elgg_view_menu('filter', array('sort_by' => 'weight'));
+	echo elgg_view_menu('filter', array('sort_by' => 'weight', 'class' => 'elgg-menu-hz'));
 }
diff --git a/views/default/page/layouts/content/header.php b/views/default/page/layouts/content/header.php
index c5f78bd06..cbdd1071a 100644
--- a/views/default/page/layouts/content/header.php
+++ b/views/default/page/layouts/content/header.php
@@ -41,7 +41,7 @@ if ($context) {
 			));
 		}
 		
-		$buttons = elgg_view_menu('title', array('sort_by' => 'weight'));
+		$buttons = elgg_view_menu('title', array('sort_by' => 'weight', 'class' => 'elgg-menu-hz'));
 	}
 	echo <<<HTML
 <div class="elgg-head clearfix">