From 72c59cdab8fc26204792b28bf56ce4e00803486e Mon Sep 17 00:00:00 2001 From: webchick Date: Sun, 24 May 2015 15:17:43 -0700 Subject: [PATCH] Issue #1944572 by hass, Cottser, idebr: Remove "ul.menu" dependency to prevent theme clashes --- core/modules/shortcut/shortcut.module | 2 +- .../shortcut/src/Tests/ShortcutLinksTest.php | 4 +- .../src/Tests/ShortcutTranslationUITest.php | 2 +- .../toolbar/css/toolbar.icons.theme.css | 22 +++++----- core/modules/toolbar/css/toolbar.menu.css | 10 ++--- core/modules/toolbar/css/toolbar.theme.css | 10 ++--- core/modules/toolbar/js/toolbar.menu.js | 4 +- .../toolbar/js/views/MenuVisualView.js | 2 +- .../toolbar/src/Menu/ToolbarMenuLinkTree.php | 41 +++++++++++++++++ .../toolbar/templates/menu--toolbar.html.twig | 44 +++++++++++++++++++ .../modules/toolbar_test/toolbar_test.module | 2 +- core/modules/toolbar/toolbar.module | 8 +++- core/modules/toolbar/toolbar.services.yml | 3 ++ core/modules/user/user.module | 2 +- 14 files changed, 124 insertions(+), 32 deletions(-) create mode 100644 core/modules/toolbar/src/Menu/ToolbarMenuLinkTree.php create mode 100644 core/modules/toolbar/templates/menu--toolbar.html.twig diff --git a/core/modules/shortcut/shortcut.module b/core/modules/shortcut/shortcut.module index 96ab2932a60..ff328916c94 100644 --- a/core/modules/shortcut/shortcut.module +++ b/core/modules/shortcut/shortcut.module @@ -277,7 +277,7 @@ function shortcut_renderable_links($shortcut_set = NULL) { '#theme' => 'links__toolbar_shortcuts', '#links' => $links, '#attributes' => array( - 'class' => array('menu'), + 'class' => array('toolbar-menu'), ), '#cache' => array( 'tags' => $cache_tags, diff --git a/core/modules/shortcut/src/Tests/ShortcutLinksTest.php b/core/modules/shortcut/src/Tests/ShortcutLinksTest.php index 032cf6fae3f..3b5811f3c93 100644 --- a/core/modules/shortcut/src/Tests/ShortcutLinksTest.php +++ b/core/modules/shortcut/src/Tests/ShortcutLinksTest.php @@ -307,14 +307,14 @@ class ShortcutLinksTest extends ShortcutTestBase { // Ensure to give permissions to access the shortcuts. $this->drupalLogin($this->drupalCreateUser(array('access toolbar', 'access shortcuts', 'access content overview', 'administer content types'))); $this->drupalGet(Url::fromRoute('')); - $shortcuts = $this->cssSelect('#toolbar-item-shortcuts-tray .menu a'); + $shortcuts = $this->cssSelect('#toolbar-item-shortcuts-tray .toolbar-menu a'); $this->assertEqual((string) $shortcuts[0], 'Add content'); $this->assertEqual((string) $shortcuts[1], 'All content'); foreach($this->set->getShortcuts() as $shortcut) { $shortcut->setWeight($shortcut->getWeight() * -1)->save(); } $this->drupalGet(Url::fromRoute('')); - $shortcuts = $this->cssSelect('#toolbar-item-shortcuts-tray .menu a'); + $shortcuts = $this->cssSelect('#toolbar-item-shortcuts-tray .toolbar-menu a'); $this->assertEqual((string) $shortcuts[0], 'All content'); $this->assertEqual((string) $shortcuts[1], 'Add content'); } diff --git a/core/modules/shortcut/src/Tests/ShortcutTranslationUITest.php b/core/modules/shortcut/src/Tests/ShortcutTranslationUITest.php index 083422f5351..3fc823267d9 100644 --- a/core/modules/shortcut/src/Tests/ShortcutTranslationUITest.php +++ b/core/modules/shortcut/src/Tests/ShortcutTranslationUITest.php @@ -74,7 +74,7 @@ class ShortcutTranslationUITest extends ContentTranslationUITestBase { $this->drupalGet('', array('language' => $language)); $expected_path = \Drupal::urlGenerator()->generateFromRoute('user.page', array(), array('language' => $language)); $label = $entity->getTranslation($langcode)->label(); - $elements = $this->xpath('//nav[contains(@class, "toolbar-lining")]/ul[@class="menu"]/li/a[contains(@href, :href) and normalize-space(text())=:label]', array(':href' => $expected_path, ':label' => $label)); + $elements = $this->xpath('//nav[contains(@class, "toolbar-lining")]/ul[@class="toolbar-menu"]/li/a[contains(@href, :href) and normalize-space(text())=:label]', array(':href' => $expected_path, ':label' => $label)); $this->assertTrue(!empty($elements), format_string('Translated @language shortcut link @label found.', array('@label' => $label, '@language' => $language->getName()))); } } diff --git a/core/modules/toolbar/css/toolbar.icons.theme.css b/core/modules/toolbar/css/toolbar.icons.theme.css index 3a5549e12b8..e50b76392b5 100644 --- a/core/modules/toolbar/css/toolbar.icons.theme.css +++ b/core/modules/toolbar/css/toolbar.icons.theme.css @@ -34,36 +34,36 @@ border: 0; font-size: 1em; } -.toolbar .menu ul .toolbar-icon { +.toolbar .toolbar-menu ul .toolbar-icon { padding-left: 1.3333em; /* LTR */ } -[dir="rtl"] .toolbar .menu ul .toolbar-icon { +[dir="rtl"] .toolbar .toolbar-menu ul .toolbar-icon { padding-left: 0; padding-right: 1.3333em; } -.toolbar .menu ul a.toolbar-icon:before { +.toolbar .toolbar-menu ul a.toolbar-icon:before { display: none; } -.toolbar .toolbar-tray-vertical .menu ul a { +.toolbar .toolbar-tray-vertical .toolbar-menu ul a { padding-left: 2.75em; /* LTR */ } -[dir="rtl"] .toolbar .toolbar-tray-vertical .menu ul a { +[dir="rtl"] .toolbar .toolbar-tray-vertical .toolbar-menu ul a { padding-left: 0; padding-right: 2.75em; } -.toolbar .toolbar-tray-vertical .menu ul ul a { +.toolbar .toolbar-tray-vertical .toolbar-menu ul ul a { padding-left: 3.75em; /* LTR */ } -[dir="rtl"] .toolbar .toolbar-tray-vertical .menu ul ul a { +[dir="rtl"] .toolbar .toolbar-tray-vertical .toolbar-menu ul ul a { padding-left: 0; padding-right: 3.75em; } -.toolbar .toolbar-tray-vertical .menu a { +.toolbar .toolbar-tray-vertical .toolbar-menu a { padding-left: 2.75em; /* LTR */ padding-right: 4em; /* LTR */ } -[dir="rtl"] .toolbar .toolbar-tray-vertical .menu a { +[dir="rtl"] .toolbar .toolbar-tray-vertical .toolbar-menu a { padding-left: 4em; padding-right: 2.75em; } @@ -255,11 +255,11 @@ .toolbar .toolbar-icon.toolbar-handle.open:before { background-image: url(../../../misc/icons/787878/chevron-disc-up.svg); } -.toolbar .menu .menu .toolbar-icon.toolbar-handle:before { +.toolbar .toolbar-menu .toolbar-menu .toolbar-icon.toolbar-handle:before { background-image: url(../../../misc/icons/5181c6/twistie-down.svg); background-size: 75%; } -.toolbar .menu .menu .toolbar-icon.toolbar-handle.open:before { +.toolbar .toolbar-menu .toolbar-menu .toolbar-icon.toolbar-handle.open:before { background-image: url(../../../misc/icons/787878/twistie-up.svg); background-size: 75%; } diff --git a/core/modules/toolbar/css/toolbar.menu.css b/core/modules/toolbar/css/toolbar.menu.css index 14dbd44c575..099fb08496e 100644 --- a/core/modules/toolbar/css/toolbar.menu.css +++ b/core/modules/toolbar/css/toolbar.menu.css @@ -1,8 +1,8 @@ /** * @file toolbar.menu.css */ -.toolbar .menu, -[dir="rtl"] .toolbar .menu { +.toolbar .toolbar-menu, +[dir="rtl"] .toolbar .toolbar-menu { list-style: none; margin: 0; padding: 0; @@ -13,9 +13,9 @@ position: relative; width: auto; } -.toolbar .toolbar-tray-horizontal .menu .toolbar-handle, -.toolbar .toolbar-tray-horizontal .menu ul, -.toolbar .toolbar-tray-vertical .menu ul { +.toolbar .toolbar-tray-horizontal .toolbar-menu .toolbar-handle, +.toolbar .toolbar-tray-horizontal .toolbar-menu ul, +.toolbar .toolbar-tray-vertical .toolbar-menu ul { display: none; } .toolbar .toolbar-tray-vertical li.open > ul { diff --git a/core/modules/toolbar/css/toolbar.theme.css b/core/modules/toolbar/css/toolbar.theme.css index 21aed489e3b..1b2745466fb 100644 --- a/core/modules/toolbar/css/toolbar.theme.css +++ b/core/modules/toolbar/css/toolbar.theme.css @@ -99,7 +99,7 @@ color: #000; text-decoration: underline; } -.toolbar .menu { +.toolbar .toolbar-menu { background-color: #ffffff; } .toolbar .toolbar-tray-horizontal .menu-item + .menu-item { @@ -124,21 +124,21 @@ .toolbar .toolbar-tray-vertical .menu-item .menu-item { border: 0 none; } -.toolbar .toolbar-tray-vertical .menu ul ul { +.toolbar .toolbar-tray-vertical .toolbar-menu ul ul { border-bottom: 1px solid #dddddd; border-top: 1px solid #dddddd; } .toolbar .toolbar-tray-vertical .menu-item:last-child > ul { border-bottom: 0; } -.toolbar .toolbar-tray-vertical .menu .menu .menu .menu { +.toolbar .toolbar-tray-vertical .toolbar-menu .toolbar-menu .toolbar-menu .toolbar-menu { margin-left: 0.25em; /* LTR */ } -[dir="rtl"] .toolbar .toolbar-tray-vertical .menu .menu .menu .menu { +[dir="rtl"] .toolbar .toolbar-tray-vertical .toolbar-menu .toolbar-menu .toolbar-menu .toolbar-menu { margin-left: 0; margin-right: 0.25em; } -.toolbar .menu .menu a { +.toolbar .toolbar-menu .toolbar-menu a { color: #434343; } diff --git a/core/modules/toolbar/js/toolbar.menu.js b/core/modules/toolbar/js/toolbar.menu.js index c14d0d47d98..e590297630c 100644 --- a/core/modules/toolbar/js/toolbar.menu.js +++ b/core/modules/toolbar/js/toolbar.menu.js @@ -2,7 +2,7 @@ * Builds a nested accordion widget. * * Invoke on an HTML list element with the jQuery plugin pattern. - * - For example, $('.menu').drupalToolbarMenu(); + * - For example, $('.toolbar-menu').drupalToolbarMenu(); */ (function ($, Drupal, drupalSettings) { @@ -103,7 +103,7 @@ // Add a handle to each list item if it has a menu. $menu.find('li').each(function (index, element) { var $item = $(element); - if ($item.children('ul.menu').length) { + if ($item.children('ul.toolbar-menu').length) { var $box = $item.children('.toolbar-box'); options.text = Drupal.t('@label', {'@label': $box.find('a').text()}); $item.children('.toolbar-box') diff --git a/core/modules/toolbar/js/views/MenuVisualView.js b/core/modules/toolbar/js/views/MenuVisualView.js index d90b6d01d83..917259b407a 100644 --- a/core/modules/toolbar/js/views/MenuVisualView.js +++ b/core/modules/toolbar/js/views/MenuVisualView.js @@ -35,7 +35,7 @@ // Render the main menu as a nested, collapsible accordion. if ('drupalToolbarMenu' in $.fn) { this.$el - .children('.menu') + .children('.toolbar-menu') .drupalToolbarMenu(); } } diff --git a/core/modules/toolbar/src/Menu/ToolbarMenuLinkTree.php b/core/modules/toolbar/src/Menu/ToolbarMenuLinkTree.php new file mode 100644 index 00000000000..6742e6c61be --- /dev/null +++ b/core/modules/toolbar/src/Menu/ToolbarMenuLinkTree.php @@ -0,0 +1,41 @@ +link; + // Get the menu name of the first link. + $menu_name = $first_link->getMenuName(); + // Add a more specific theme suggestion to differentiate this rendered + // menu from others. + $build['#theme'] = 'menu__toolbar__' . strtr($menu_name, '-', '_'); + return $build; + } + else { + return parent::build($tree, $level); + } + } + +} diff --git a/core/modules/toolbar/templates/menu--toolbar.html.twig b/core/modules/toolbar/templates/menu--toolbar.html.twig new file mode 100644 index 00000000000..3578b951ac4 --- /dev/null +++ b/core/modules/toolbar/templates/menu--toolbar.html.twig @@ -0,0 +1,44 @@ +{# +/** + * @file + * Default theme implementation to display a toolbar menu. + * + * Available variables: + * - menu_name: The machine name of the menu. + * - items: A nested list of menu items. Each menu item contains: + * - attributes: HTML attributes for the menu item. + * - below: The menu item child items. + * - title: The menu link title. + * - url: The menu link url, instance of \Drupal\Core\Url + * - localized_options: Menu link localized options. + * + * @ingroup themeable + */ +#} +{% import _self as menus %} + +{# + We call a macro which calls itself to render the full tree. + @see http://twig.sensiolabs.org/doc/tags/macro.html +#} +{{ menus.menu_links(items, attributes, 0) }} + +{% macro menu_links(items, attributes, menu_level) %} + {% import _self as menus %} + {% if items %} + {% if menu_level == 0 %} + + {% else %} +
    + {% endif %} + {% for item in items %} + + {{ link(item.title, item.url) }} + {% if item.below %} + {{ menus.menu_links(item.below, attributes, menu_level + 1) }} + {% endif %} + + {% endfor %} +
+ {% endif %} +{% endmacro %} diff --git a/core/modules/toolbar/tests/modules/toolbar_test/toolbar_test.module b/core/modules/toolbar/tests/modules/toolbar_test/toolbar_test.module index f1c824128c4..78c2d090b05 100644 --- a/core/modules/toolbar/tests/modules/toolbar_test/toolbar_test.module +++ b/core/modules/toolbar/tests/modules/toolbar_test/toolbar_test.module @@ -38,7 +38,7 @@ function toolbar_test_toolbar() { \Drupal::l(t('link 3'), new Url('', [], array('attributes' => array('title' => 'Test link 3 title')))), ), '#attributes' => array( - 'class' => array('menu'), + 'class' => array('toolbar-menu'), ), ), ), diff --git a/core/modules/toolbar/toolbar.module b/core/modules/toolbar/toolbar.module index 4cce4a3872c..20665708f89 100644 --- a/core/modules/toolbar/toolbar.module +++ b/core/modules/toolbar/toolbar.module @@ -42,6 +42,10 @@ function toolbar_theme($existing, $type, $theme, $path) { $items['toolbar'] = array( 'render element' => 'element', ); + $items['menu__toolbar'] = array( + 'base hook' => 'menu', + 'variables' => array('items' => array(), 'attributes' => array()), + ); return $items; } @@ -204,7 +208,7 @@ function toolbar_toolbar() { * @see drupal_render() */ function toolbar_prerender_toolbar_administration_tray(array $element) { - $menu_tree = \Drupal::menuTree(); + $menu_tree = \Drupal::service('toolbar.menu_tree'); // Render the top-level administration menu links. $parameters = new MenuTreeParameters(); $parameters->setRoot('system.admin')->excludeRoot()->setTopLevelOnly()->onlyEnabledLinks(); @@ -261,7 +265,7 @@ function toolbar_menu_navigation_links(array $tree) { * Returns the rendered subtree of each top-level toolbar link. */ function toolbar_get_rendered_subtrees() { - $menu_tree = \Drupal::menuTree(); + $menu_tree = \Drupal::service('toolbar.menu_tree'); $parameters = new MenuTreeParameters(); $parameters->setRoot('system.admin')->excludeRoot()->setMaxDepth(3)->onlyEnabledLinks(); $tree = $menu_tree->load(NULL, $parameters); diff --git a/core/modules/toolbar/toolbar.services.yml b/core/modules/toolbar/toolbar.services.yml index 278d3c7313e..d8110d2f5c8 100644 --- a/core/modules/toolbar/toolbar.services.yml +++ b/core/modules/toolbar/toolbar.services.yml @@ -10,3 +10,6 @@ services: class: Drupal\toolbar\PageCache\AllowToolbarPath tags: - { name: page_cache_request_policy } + toolbar.menu_tree: + class: Drupal\toolbar\Menu\ToolbarMenuLinkTree + arguments: ['@menu.tree_storage', '@plugin.manager.menu.link', '@router.route_provider', '@menu.active_trail', '@controller_resolver', '@cache.menu', '@current_route_match'] diff --git a/core/modules/user/user.module b/core/modules/user/user.module index b4c6e1611a4..db3cfb1cfd2 100644 --- a/core/modules/user/user.module +++ b/core/modules/user/user.module @@ -1365,7 +1365,7 @@ function user_toolbar() { '#theme' => 'links__toolbar_user', '#links' => $links, '#attributes' => array( - 'class' => array('menu'), + 'class' => array('toolbar-menu'), ), ), ),