diff options
21 files changed, 309 insertions, 334 deletions
diff --git a/Bugzilla/Search/Saved.pm b/Bugzilla/Search/Saved.pm index 23507c039..1511cd87b 100644 --- a/Bugzilla/Search/Saved.pm +++ b/Bugzilla/Search/Saved.pm @@ -368,9 +368,10 @@ The CGI parameters for the search, as a string. =item C<link_in_footer> -Whether or not this search should be displayed in the footer for the +Whether or not this search should be displayed in the Search Bar for the I<current user> (not the owner of the search, but the person actually -using Bugzilla right now). +using Bugzilla right now). It says "footer" for historical reasons as the link +was previously displayed on the global footer. =item C<type> diff --git a/buglist.cgi b/buglist.cgi index e650dfcf6..4d3ad1a86 100755 --- a/buglist.cgi +++ b/buglist.cgi @@ -213,7 +213,8 @@ sub LookupNamedQuery { # query - The query part of the buglist.cgi URL, unencoded. Must not be # empty, or we will throw a UserError. # link_in_footer (optional) - 1 if the Named Query should be -# displayed in the user's footer, 0 otherwise. +# displayed in the user's Search Bar, 0 otherwise. It says "footer" for +# historical reasons as the link was previously displayed on the global footer. # # All parameters are validated before passing them into the database. # diff --git a/extensions/BMO/template/en/default/bug/create/create-client-bounty.html.tmpl b/extensions/BMO/template/en/default/bug/create/create-client-bounty.html.tmpl index 5d9d20be8..799b2b35b 100644 --- a/extensions/BMO/template/en/default/bug/create/create-client-bounty.html.tmpl +++ b/extensions/BMO/template/en/default/bug/create/create-client-bounty.html.tmpl @@ -81,9 +81,6 @@ #client_bounty_form .form_section { margin-bottom: 10px; } -#useful-links { - display: none; -} [% END %] [% inline_javascript = BLOCK %] diff --git a/extensions/BMO/template/en/default/hook/global/footer-intro.html.tmpl b/extensions/BMO/template/en/default/hook/global/footer-intro.html.tmpl deleted file mode 100644 index cb157ec48..000000000 --- a/extensions/BMO/template/en/default/hook/global/footer-intro.html.tmpl +++ /dev/null @@ -1,16 +0,0 @@ -[%# This Source Code Form is subject to the terms of the Mozilla Public - # License, v. 2.0. If a copy of the MPL was not distributed with this - # file, You can obtain one at http://mozilla.org/MPL/2.0/. - # - # This Source Code Form is "Incompatible With Secondary Licenses", as - # defined by the Mozilla Public License, v. 2.0. - #%] - -<nav class="org-links"> - <h1><a href="https://www.mozilla.org/">Mozilla</a></h1> - <ul> - <li><a href="https://www.mozilla.org/privacy/websites/" target="_blank">Privacy</a></li> - <li><a href="https://www.mozilla.org/privacy/websites/#cookies" target="_blank">Cookies</a></li> - <li><a href="https://www.mozilla.org/about/legal/" target="_blank">Legal</a></li> - </ul> -</nav> diff --git a/extensions/BMO/template/en/default/hook/global/header-external-links.html.tmpl b/extensions/BMO/template/en/default/hook/global/header-external-links.html.tmpl new file mode 100644 index 000000000..6c7d58816 --- /dev/null +++ b/extensions/BMO/template/en/default/hook/global/header-external-links.html.tmpl @@ -0,0 +1,29 @@ +[%# This Source Code Form is subject to the terms of the Mozilla Public + # License, v. 2.0. If a copy of the MPL was not distributed with this + # file, You can obtain one at http://mozilla.org/MPL/2.0/. + # + # This Source Code Form is "Incompatible With Secondary Licenses", as + # defined by the Mozilla Public License, v. 2.0. + #%] + +<div id="header-external-links" class="dropdown first"> + <button type="button" id="header-external-menu-button" class="dropdown-button minor" title="Mozilla" + aria-label="Mozilla" aria-expanded="false" aria-haspopup="true" aria-controls="header-external-menu"> + <img src="extensions/BMO/web/images/moz-fav-bw-rgb.svg" width="32" height="32" alt=""> + </button> + <ul class="dropdown-content right" id="header-external-menu" role="menu" style="display:none;"> + <li role="presentation"> + <a href="https://www.mozilla.org/" role="menuitem" tabindex="-1">Mozilla Home</a> + </li> + <li role="separator" class="dropdown-separator"></li> + <li role="presentation"> + <a href="https://www.mozilla.org/privacy/websites/" role="menuitem" tabindex="-1">Privacy</a> + </li> + <li role="presentation"> + <a href="https://www.mozilla.org/privacy/websites/#cookies" role="menuitem" tabindex="-1">Cookies</a> + </li> + <li role="presentation"> + <a href="https://www.mozilla.org/about/legal/" role="menuitem" tabindex="-1">Legal</a> + </li> + </ul> +</div> diff --git a/extensions/BMO/web/images/moz-fav-bw-rgb.svg b/extensions/BMO/web/images/moz-fav-bw-rgb.svg new file mode 100644 index 000000000..1e91f0603 --- /dev/null +++ b/extensions/BMO/web/images/moz-fav-bw-rgb.svg @@ -0,0 +1,14 @@ +<?xml version="1.0" encoding="utf-8"?> +<!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> +<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" + viewBox="0 0 68 68" style="enable-background:new 0 0 68 68;" xml:space="preserve"> +<style type="text/css"> + .st0{fill:#FFFFFF;} +</style> +<g> + <rect y="0" width="68" height="68"/> + <path class="st0" d="M57.9,42.6h3.9v6.4H49.5V32.4c0-5.1-1.7-7-5-7c-4,0-5.6,2.9-5.6,6.9v10.2h3.9v6.4H30.5V32.4c0-5.1-1.7-7-5-7 + c-4,0-5.6,2.9-5.6,6.9v10.2h5.6v6.4H7.5v-6.4h3.9V26H7.5v-6.4h12.3v4.4c1.8-3.1,4.8-5,8.9-5c4.2,0,8.1,2,9.5,6.3 + c1.6-3.9,4.9-6.3,9.5-6.3c5.3,0,10.1,3.2,10.1,10.1V42.6z"/> +</g> +</svg> diff --git a/extensions/BMO/web/images/mozilla-tab.png b/extensions/BMO/web/images/mozilla-tab.png Binary files differdeleted file mode 100644 index 417f6a5c6..000000000 --- a/extensions/BMO/web/images/mozilla-tab.png +++ /dev/null diff --git a/images/footer-mozilla.png b/images/footer-mozilla.png Binary files differdeleted file mode 100644 index 593c10308..000000000 --- a/images/footer-mozilla.png +++ /dev/null diff --git a/images/moz-logo-bw-rgb.svg b/images/moz-logo-bw-rgb.svg deleted file mode 100644 index 08f06e057..000000000 --- a/images/moz-logo-bw-rgb.svg +++ /dev/null @@ -1,22 +0,0 @@ -<?xml version="1.0" encoding="utf-8"?> -<!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> -<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" - viewBox="0 0 360 102.8" style="enable-background:new 0 0 360 102.8;" xml:space="preserve"> -<style type="text/css"> - .st0{fill:#FFFFFF;} -</style> -<g> - <rect y="-0.2" width="360" height="102.9"/> - <path class="st0" d="M343.8,73.7c-0.7,0.2-1.3,0.3-1.9,0.3c-2.1,0-3.1-0.9-3.1-3.5V51c0-10.3-8.2-15.3-17.9-15.3 - c-7.4,0-11.4,0.9-19.3,4.1L300,50.2l10.3,1.1l1.5-5.1c2.1-1.1,4.2-1.3,6.9-1.3c7.3,0,7.4,5.5,7.4,10.1v1.5 - c-2.3-0.3-4.9-0.4-7.4-0.4c-10.3,0-21,2.6-21,13.7c0,9.4,7.4,12.9,13.9,12.9c7.3,0,11.9-4.4,14.5-9c0.6,5.5,3.9,9,9.9,9 - c2.8,0,5.7-0.8,8.1-2.1L343.8,73.7z M316.2,73.4c-3.9,0-5.3-2.3-5.3-5.2c0-4.9,4-6.2,8.6-6.2c2.1,0,4.4,0.3,6.5,0.6 - C325.7,70.1,320.8,73.4,316.2,73.4z M298.9,12.9l-19.5,68.7h-12.7l19.5-68.7H298.9z M272.7,12.9l-19.5,68.7h-12.7L260,12.9H272.7z - M218.7,36.6h13.5v16.2h-13.5V36.6z M218.7,65.5h13.5v16.2h-13.5V65.5z M199,64.9l10.2,1l-2.8,15.8h-39.3l-1.3-6.8l24.8-28.5h-14.1 - l-2,7l-9.3-1l1.6-15.8h39.5l1,6.8l-25,28.5h14.6L199,64.9z M134.5,35.7c-16.2,0-24.2,10.9-24.2,24.1c0,14.4,9.6,22.9,23.5,22.9 - c14.4,0,24.8-9.1,24.8-23.5C158.6,46.6,150.7,35.7,134.5,35.7z M134.2,72.7c-7,0-10.6-6-10.6-13.8c0-8.5,4.1-13.4,10.7-13.4 - c6.1,0,11,4.1,11,13.2C145.3,67.4,140.9,72.7,134.2,72.7z M98.7,71.8h6v9.8H85.9V56.3c0-7.8-2.6-10.8-7.7-10.8 - c-6.2,0-8.7,4.4-8.7,10.7v15.7h6v9.8H56.6V56.3c0-7.8-2.6-10.8-7.7-10.8c-6.2,0-8.7,4.4-8.7,10.7v15.7h8.6v9.8H21.4v-9.8h6V46.4h-6 - v-9.8h18.9v6.8c2.7-4.8,7.4-7.7,13.7-7.7c6.5,0,12.5,3.1,14.7,9.7c2.5-6,7.6-9.7,14.7-9.7c8.1,0,15.5,4.9,15.5,15.6V71.8z"/> -</g> -</svg> diff --git a/js/dropdown.js b/js/dropdown.js index 32ce4696f..58aa4fee2 100644 --- a/js/dropdown.js +++ b/js/dropdown.js @@ -30,31 +30,63 @@ $(function() { if (e.keyCode == 38 || e.keyCode == 40) { $('.dropdown-content').each(function() { var $content = $(this); + var content_id = $content.attr('id'); + var $controller = content_id ? $('[aria-controls="' + content_id + '"]') : $(); if ($content.is(':visible')) { e.preventDefault(); e.stopPropagation(); - var $items = $content.find('[role="menuitem"]'); - // if none focused select the first or last - var $any_focused = $items.filter(':focus'); - if ($any_focused.length == 0) { + var $items = $content.find('[role="menuitem"], [role="option"]'); + // if none active select the first or last + var $link = $items.filter('.active'); + if ($link.length == 0) { var index = e.keyCode == 40 ? 0 : $items.length - 1; - var $link = $items.eq(index); - $link.addClass('active').focus(); - return; + $link = $items.eq(index); + } else { + // otherwise move up or down the list based on arrow key pressed + var move = $items.index($link) + (e.keyCode == 40 ? 1 : -1); + + // remove active state first + if ($link.length) { + $link.removeClass('active'); + + if ($link.attr('id') === content_id + '-active-item') { + $link.removeAttr('id'); + } + } + + // get the new active element + $link = $items.eq(move % $items.length); + } + + $link.addClass('active'); + + if (content_id && !$link.attr('id')) { + $link.attr('id', content_id + '-active-item'); + } + + if ($link.attr('id')) { + $controller.attr('aria-activedescendant', $link.attr('id')); + } + + // move focus when the dropdown's controller is not search box + if (!$controller.eq('input')) { + $link.focus(); } - // otherwise move up or down the list based on arrow key pressed - var inc = e.keyCode == 40 ? 1 : -1; - var move = $items.index($any_focused) + inc; - var $link = $items.eq(move % $items.length); - $content.find('a').removeClass('active'); - $link.addClass('active').focus(); } }); } - // enter clicks on a link + // navigate to an active link or click on it + // note that `trigger('click')` doesn't always work if (e.keyCode == 13) { - $('.dropdown-content:visible a.active').trigger('click'); + var $link = $('.dropdown-content:visible a.active'); + if ($link.length) { + if ($link.attr('href')) { + location.href = $link.attr('href'); + } else { + $link.trigger('click'); + } + } } }); @@ -70,8 +102,18 @@ $(function() { $button.click(function(e) { toggleDropDown(e, $button, $content); }).keydown(function(e) { - // allow enter to toggle menu if (e.keyCode == 13) { + if ($button.eq('input') && !$button.val()) { + // prevent the form being submitted if the search bar is empty + e.preventDefault(); + // navigate to an active link if any + var $link = $content.find('a.active'); + if ($link.length) { + location.href = $link.attr('href'); + } + } + + // allow enter to toggle menu toggleDropDown(e, $button, $content); } }); @@ -85,8 +127,19 @@ $(function() { $expanded.attr('aria-expanded', false); } + // don't expand the dropdown if there's no item + var $items = $content.find('[role="menuitem"], [role="option"]'); + if (!$items.length) { + return; + } + // clear all active links $content.find('a').removeClass('active'); + var content_id = $content.attr('id'); + if (content_id) { + $('[aria-controls="' + content_id + '"]').removeAttr('aria-activedescendant'); + $content.find('#' + content_id + '-active-item').removeAttr('id'); + } if ($content.is(':visible')) { $content.hide(); $button.attr('aria-expanded', false); diff --git a/qa/t/test_bmo_enter_new_bug.t b/qa/t/test_bmo_enter_new_bug.t index 6e5753c74..375a59fcb 100644 --- a/qa/t/test_bmo_enter_new_bug.t +++ b/qa/t/test_bmo_enter_new_bug.t @@ -212,7 +212,7 @@ _check_group('pr-private'); _check_product('Legal'); _check_component('Legal', 'Contract Request'); -_check_group('mozilla-employee-confidential'); +_check_group('mozilla-employee-confidential'); $sel->open_ok("/$config->{bugzilla_installation}/enter_bug.cgi?product=Legal&format=legal"); $sel->wait_for_page_to_load_ok(WAIT_TIME); @@ -289,7 +289,7 @@ sub _check_component { $sel->wait_for_page_to_load_ok(WAIT_TIME); $sel->title_is("Edit components for which product?"); - $sel->click_ok("link=$product"); + $sel->click_ok("//div[\@id='bugzilla-body']//a[normalize-space(text())='$product']"); $sel->wait_for_page_to_load_ok(WAIT_TIME); $sel->title_is("Select component of product '$product'"); @@ -311,7 +311,7 @@ sub _check_component { $sel->click_ok("link=components"); $sel->wait_for_page_to_load_ok(WAIT_TIME); $sel->title_is("Edit components for which product?"); - $sel->click_ok("link=$product"); + $sel->click_ok("//div[\@id='bugzilla-body']//a[normalize-space(text())='$product']"); $sel->wait_for_page_to_load_ok(WAIT_TIME); $sel->title_is("Select component of product '$product'"); $sel->click_ok("link=Add"); @@ -372,7 +372,7 @@ sub _check_version { $sel->click_ok("link=versions"); $sel->wait_for_page_to_load(WAIT_TIME); $sel->title_is("Edit versions for which product?"); - $sel->click_ok("link=$product"); + $sel->click_ok("//div[\@id='bugzilla-body']//a[normalize-space(text())='$product']"); $sel->wait_for_page_to_load(WAIT_TIME); my $text = trim($sel->get_text("bugzilla-body")); diff --git a/qa/t/test_saved_searches.t b/qa/t/test_saved_searches.t index b5f47ff4a..b39458fa5 100644 --- a/qa/t/test_saved_searches.t +++ b/qa/t/test_saved_searches.t @@ -50,7 +50,7 @@ $sel->click_ok("link=SavedSearchTEST1"); $sel->wait_for_page_to_load_ok(WAIT_TIME); $sel->title_is("Bug List: SavedSearchTEST1"); -# Remove the saved search from the page footer. It should no longer be displayed there. +# Remove the saved search from the Search Bar. It should no longer be displayed there. $sel->click_ok("link=Preferences"); $sel->wait_for_page_to_load_ok(WAIT_TIME); @@ -76,8 +76,8 @@ $sel->type_ok("short_desc", "bilboa"); $sel->click_ok("Search"); $sel->wait_for_page_to_load_ok(WAIT_TIME); $sel->title_is("Bug List"); -# As we said, this saved search should no longer be displayed in the page footer. -ok(!$sel->is_text_present("SavedSearchTEST1"), "SavedSearchTEST1 is not present in the page footer"); +# As we said, this saved search should no longer be displayed in the Search Bar. +ok(!$sel->is_text_present("SavedSearchTEST1"), "SavedSearchTEST1 is not present in the Search Bar"); $sel->type_ok("save_newqueryname", "SavedSearchTEST1"); $sel->click_ok("remember"); $sel->wait_for_page_to_load_ok(WAIT_TIME); @@ -86,7 +86,7 @@ $text = trim($sel->get_text("message")); ok($text =~ /Your search named SavedSearchTEST1 has been updated./, "Saved searche SavedSearchTEST1 has been updated."); # Make sure our new criteria has been saved (let's edit the saved search). -# As the saved search is no longer displayed in the footer, we have to go +# As the saved search is no longer displayed in the Search Bar, we have to go # to the "Preferences" page to edit it. $sel->click_ok("link=Preferences"); diff --git a/qa/t/test_shared_searches.t b/qa/t/test_shared_searches.t index 3e5838c03..98237f756 100644 --- a/qa/t/test_shared_searches.t +++ b/qa/t/test_shared_searches.t @@ -34,7 +34,7 @@ my $text = trim($sel->get_text("message")); ok($text =~ /OK, you have a new search named Shared Selenium buglist./, "New search named 'Shared Selenium buglist' has been created"); # Retrieve the newly created saved search's internal ID and make sure it's displayed -# in the footer by default. +# in the Search Bar by default. $sel->click_ok("link=Preferences"); $sel->wait_for_page_to_load_ok(WAIT_TIME); @@ -47,10 +47,10 @@ $ssname =~ /(?:link_in_footer_(\d+))/; my $saved_search1_id = $1; $sel->is_checked_ok("link_in_footer_$saved_search1_id"); -# As an admin, the "Add to footer" checkbox must be displayed, but unchecked by default. +# As an admin, the "Add to Search Bar" checkbox must be displayed, but unchecked by default. $sel->select_ok("share_$saved_search1_id", "label=canconfirm"); -ok(!$sel->is_checked("force_$saved_search1_id"), "Shared search not displayed in other users' footer by default"); +ok(!$sel->is_checked("force_$saved_search1_id"), "Shared search not displayed in other users' Search Bar by default"); $sel->click_ok("force_$saved_search1_id"); $sel->click_ok("update"); $sel->wait_for_page_to_load_ok(WAIT_TIME); @@ -58,9 +58,10 @@ $sel->title_is("User Preferences"); logout($sel); # Log in as the "canconfirm" user. The search shared by the admin must appear -# in the footer. +# in the Search Bar. log_in($sel, $config, 'canconfirm'); +$sel->click_ok("quicksearch_top"); $sel->is_text_present_ok("Shared Selenium buglist"); $sel->click_ok("link=Shared Selenium buglist"); $sel->wait_for_page_to_load_ok(WAIT_TIME); @@ -78,7 +79,7 @@ $sel->wait_for_page_to_load_ok(WAIT_TIME); $sel->title_is("User Preferences"); $sel->is_text_present_ok($config->{admin_user_login}); -# Remove the shared search from your footer. +# Remove the shared search from your Search Bar. $sel->is_checked_ok("link_in_footer_$saved_search1_id"); $sel->click_ok("link_in_footer_$saved_search1_id"); @@ -89,7 +90,8 @@ $sel->title_is("User Preferences"); $sel->click_ok("link=Permissions"); $sel->wait_for_page_to_load_ok(WAIT_TIME); $sel->title_is("User Preferences"); -ok(!$sel->is_text_present("Shared Selenium buglist"), "Shared query no longer displayed in the footer"); +$sel->click_ok("quicksearch_top"); +ok(!$sel->is_text_present("Shared Selenium buglist"), "Shared query no longer displayed in the Search Bar"); # Create your own saved search, and share it with the canconfirm group. @@ -113,7 +115,7 @@ $sel->title_is("User Preferences"); $ssname = $sel->get_attribute('//input[@type="checkbox" and @alt="helpwanted"]@name'); $ssname =~ /(?:link_in_footer_(\d+))/; my $saved_search2_id = $1; -# Our own saved searches are displayed in the footer by default. +# Our own saved searches are displayed in the Search Bar by default. $sel->is_checked_ok("link_in_footer_$saved_search2_id"); $sel->select_ok("share_$saved_search2_id", "label=canconfirm"); $sel->click_ok("update"); @@ -123,9 +125,10 @@ logout($sel); # Log in as admin again. The other user is not a blesser for the 'canconfirm' # group, and so his shared search must not be displayed by default. But it -# must still be available and can be added to the footer, if desired. +# must still be available and can be added to the Search Bar, if desired. log_in($sel, $config, 'admin'); +$sel->click_ok("quicksearch_top"); ok(!$sel->is_text_present("helpwanted"), "No 'helpwanted' shared search displayed"); $sel->click_ok("link=Preferences"); $sel->wait_for_page_to_load_ok(WAIT_TIME); @@ -133,6 +136,7 @@ $sel->title_is("User Preferences"); $sel->click_ok("link=Saved Searches"); $sel->wait_for_page_to_load_ok(WAIT_TIME); $sel->title_is("User Preferences"); +$sel->click_ok("quicksearch_top"); $sel->is_text_present_ok("helpwanted"); $sel->is_text_present_ok($config->{canconfirm_user_login}); @@ -141,7 +145,7 @@ $sel->click_ok("link_in_footer_$saved_search2_id"); $sel->click_ok("update"); $sel->wait_for_page_to_load_ok(WAIT_TIME); $sel->title_is("User Preferences"); -# This query is now available from the footer. +# This query is now available from the Search Bar. $sel->click_ok("link=helpwanted"); $sel->wait_for_page_to_load_ok(WAIT_TIME); $sel->title_is("Bug List: helpwanted"); @@ -167,13 +171,15 @@ logout($sel); # user as he doesn't belong to the 'canconfirm' group. log_in($sel, $config, 'QA_Selenium_TEST'); -ok(!$sel->is_text_present("helpwanted"), "The 'helpwanted' query is not displayed in the footer"); +$sel->click_ok("quicksearch_top"); +ok(!$sel->is_text_present("helpwanted"), "The 'helpwanted' query is not displayed in the Search Bar"); $sel->click_ok("link=Preferences"); $sel->wait_for_page_to_load_ok(WAIT_TIME); $sel->title_is("User Preferences"); $sel->click_ok("link=Saved Searches"); $sel->wait_for_page_to_load_ok(WAIT_TIME); $sel->title_is("User Preferences"); +$sel->click_ok("quicksearch_top"); ok(!$sel->is_text_present("helpwanted"), "The 'helpwanted' query is not shared with this user"); logout($sel); @@ -186,6 +192,7 @@ $sel->title_is("User Preferences"); $sel->click_ok("link=Saved Searches"); $sel->wait_for_page_to_load_ok(WAIT_TIME); $sel->title_is("User Preferences"); +$sel->click_ok("quicksearch_top"); ok(!$sel->is_text_present("Shared Selenium buglist"), "The 'Shared Selenium buglist' is no longer available"); $sel->click_ok('//a[contains(@href,"buglist.cgi?cmdtype=dorem&remaction=forget&namedcmd=helpwanted")]', undef, "Deleting the 'helpwanted' search"); diff --git a/skins/standard/IE-fixes.css b/skins/standard/IE-fixes.css index 0e326286d..fd96e4afe 100644 --- a/skins/standard/IE-fixes.css +++ b/skins/standard/IE-fixes.css @@ -26,25 +26,6 @@ form#Create #comp_desc { margin: .5em 1em; } -#footer #useful-links li { - padding-bottom: 0.8ex; -} - -#footer .label { - display: block; - float: left; - width: 8.2em; - padding-bottom: 0.1ex; -} - -#footer #links-actions .label { - padding-top: 0.35em; -} - -#footer .links { - display: inline; -} - #bug_id_container, .search_field_grid, .search_email_fields, ul.bug_changes li { zoom: 1; diff --git a/skins/standard/global.css b/skins/standard/global.css index 12dab11f5..9b9ae6550 100644 --- a/skins/standard/global.css +++ b/skins/standard/global.css @@ -91,6 +91,10 @@ pointer-events: none; /* Make sure button is clickable on Chrome & Safari */ } + #header img { + vertical-align: top; + } + #header .inner { display: flex; align-items: center; @@ -154,7 +158,7 @@ #header .searchbox-outer { position: relative; - width: 240px; + width: 280px; height: 32px; } @@ -239,34 +243,8 @@ box-shadow: none; } - #header-tools-menu-button { - width: 32px; - height: 32px; - border-radius: 4px; - } - - #header-tools-menu-button .icon { - text-indent: -.7em; - letter-spacing: -.7em; - } - - #header-tools-menu-button .icon::before { - content: '\E5CC\E5CC'; - } - - #header-account-menu-button img { - display: block; - border-radius: 50%; - } - - #header-account-menu-button .icon::before { - font-size: 32px; - content: '\E853'; - } - #header .dropdown-content { top: calc(100% + 4px); - right: -4px; border-color: #BBB #999 #777; border-radius: 4px; padding: 4px 0; @@ -276,6 +254,14 @@ box-shadow: 0 2px 8px rgba(0,0,0,.3); } + #header .dropdown-content.right { + left: -4px; + } + + #header .dropdown-content.left { + right: -4px; + } + #header .dropdown-content::before, #header .dropdown-content::after { content: ''; @@ -283,12 +269,21 @@ width: 0; height: 0; position: absolute; - right: 10px; border-width: 8px; border-color: transparent; border-style: solid; } + #header .dropdown-content.right::before, + #header .dropdown-content.right::after { + left: 10px; + } + + #header .dropdown-content.left::before, + #header .dropdown-content.left::after { + right: 10px; + } + #header .dropdown-content::before { top: -17px; border-bottom-color: #BBB; @@ -304,9 +299,80 @@ padding: 2px 16px; line-height: 1.5; white-space: normal; + color: inherit !important; background-color: transparent; } + #header-search h2 { + position: absolute; + left: -99999px; + } + + #header-search-dropdown { + right: auto; + min-width: calc(100% + 8px) !important; + max-width: calc(200% + 8px) !important; + } + + #header-search-dropdown-wrapper { + overflow-x: hidden; + overflow-y: scroll; + max-height: 400px; + } + + #header-search-dropdown h3 { + position: sticky; + top: -4px; + left: 0; + margin: -4px 8px 0; + padding: 8px 0 4px; + color: #999; + background: #FFF; + font-size: 12px; + font-weight: normal; + } + + #header-search-dropdown ul { + margin: 0; + padding: 0; + list-style: none; + } + + #header-search-dropdown a { + overflow: hidden; + white-space: nowrap !important; + text-overflow: ellipsis; + } + + #header-tools-menu-button { + width: 32px; + height: 32px; + border-radius: 4px; + } + + #header-tools-menu-button .icon { + text-indent: -.7em; + letter-spacing: -.7em; + } + + #header-tools-menu-button .icon::before { + content: '\E5CC\E5CC'; + } + + #header-account-menu-button img { + display: block; + border-radius: 50%; + } + + #header-account-menu-button .icon::before { + font-size: 32px; + content: '\E853'; + } + + #header-external-links.first { + order: -1; + } + #header .account-label * { overflow: hidden; white-space: nowrap; @@ -360,92 +426,6 @@ } /* header (end) */ -/* footer (begin) - * See also the "header" section for styles that apply - * to both the header and footer. - */ - #footer { - display: flex; - clear: both; - margin: 15px 0 0; - border-top: 1px solid rgba(0, 0, 0, 0.1); - padding: 8px; - color: #bbb; - background-color: #fff; - line-height: 1.5; - } - - #footer .intro { - flex: none; - display: flex; - align-items: center; - border-right: 1px solid #DDD; - padding: 16px 24px 16px 16px; - } - - #footer .org-links { - display: flex; - align-items: center; - } - - #footer .org-links h1 { - margin: 0; - font-size: 1em; - } - - #footer .org-links h1 a { - display: block; - width: 100px; - height: 30px; - background-image: url(../../images/moz-logo-bw-rgb.svg); - background-repeat: no-repeat; - background-size: contain; - text-indent: -9999px; - } - - #footer .org-links ul { - display: flex; - margin: 0 0 0 16px; - padding: 0; - } - - #footer .org-links li { - flex: none; - } - - #footer .org-links li:not(:last-child) { - margin-right: 16px; - } - - #footer #useful-links { - flex: auto; - display: flex; - flex-direction: column; - justify-content: center; - margin: 0 0 0 24px; - padding: 0; - } - - #footer ul { - list-style-type: none; - } - #links-saved ul { - display: inline; - } - #links-saved th { - vertical-align: top; - } - - #footer .label { - white-space: nowrap; - vertical-align: top; - } - - #footer .links { - vertical-align: top; - } -/* footer (end) */ - /* link lists (begin) */ ul.links { margin: 0; @@ -783,7 +763,7 @@ div.user_match { /* Rules specific for printing */ @media print { - #header, #footer { + #header { display: none; } @@ -1075,6 +1055,7 @@ input.required, select.required, span.required_explanation { } body { + min-height: 400px; background: #f6f4ec; background-image: url(../../images/noise.png); background-image: url(../../images/noise.png), -moz-linear-gradient(#d7d3c8, #f6f4ec 400px); @@ -1088,11 +1069,11 @@ body, td, th, input, select, option, optgroup, button, .text_input { font-family: "Fira Sans", "Open Sans", "Helvetica Neue", Arial, Helvetica, sans-serif; } -a, #footer a, #footer a:visited { +a { color: #0095dd; } -a:hover, #footer a:hover { +a:hover { color: #00539f; } @@ -1148,7 +1129,7 @@ hr { background: none; border: none; color: #404040; - margin: 15px auto; + margin: 15px auto 0; } #bugzilla-body th { diff --git a/skins/standard/mobile.css b/skins/standard/mobile.css index 244726f21..f112c2a3b 100644 --- a/skins/standard/mobile.css +++ b/skins/standard/mobile.css @@ -8,7 +8,7 @@ @media only screen and (max-device-width : 720px) { - #header, #footer { + #header { display: none; } .cookie-notify { @@ -52,10 +52,6 @@ only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { - #footer .org-links { - font-size: small; - } - body { font-size: medium; } diff --git a/template/en/default/account/prefs/saved-searches.html.tmpl b/template/en/default/account/prefs/saved-searches.html.tmpl index ce9623372..7b71ccf6d 100644 --- a/template/en/default/account/prefs/saved-searches.html.tmpl +++ b/template/en/default/account/prefs/saved-searches.html.tmpl @@ -59,7 +59,7 @@ </th> <th> Show in - Footer + Search Bar </th> [% may_share = user.in_group(Param('querysharegroup')) && queryshare_groups.size %] [% IF may_share %] @@ -137,7 +137,7 @@ %]class="bz_default_hidden"[% END %]> <input type="checkbox" id="force_[% q.id FILTER html %]" name="force_[% q.id FILTER html %]" value="1"> - <label for="force_[% q.id FILTER html %]">Add to footer</label> + <label for="force_[% q.id FILTER html %]">Add to Search Bar</label> </span> [% END %] [% IF q.shared_with_users %] @@ -151,8 +151,8 @@ [% END %] </table> [% IF user.can_bless %] - <p>Note that for every search that has the "Add to footer" selected, a - link to the shared search is added to the footer of every user that is + <p>Note that for every search that has the "Add to Search Bar" selected, a + link to the shared search is added to the Search Bar of every user that is a direct member of the group at the time you click Submit Changes.</p> [% END %] </blockquote> @@ -179,7 +179,7 @@ </th> <th> Show in - Footer + Search Bar </th> </tr> [% FOREACH q = user.queries_available %] diff --git a/template/en/default/global/footer.html.tmpl b/template/en/default/global/footer.html.tmpl index 29d17bccd..4578c1084 100644 --- a/template/en/default/global/footer.html.tmpl +++ b/template/en/default/global/footer.html.tmpl @@ -19,28 +19,7 @@ # Svetlana Harisova <light@rathedg.com> #%] -[%# INTERFACE: - # This template has no interface. However, you must fulfill the interface to - # global/useful-links.html.tmpl. - #%] - -</div> - -[%# Migration note: below this point, this file corresponds to the old Param - # 'footerhtml' - #%] - -<div id="footer"> - <div class="intro">[% Hook.process('intro') %]</div> - -[%# Migration note: the old param 'blurbhtml' goes here %] - -[%# Migration note: useful-links.html.tmpl corresponds to %commandmenu% %] - - [% PROCESS "global/useful-links.html.tmpl" %] - - <div class="outro">[% Hook.process('outro') %]</div> -</div> +</div> [%# bugzilla-body %] [% Hook.process("end") %] diff --git a/template/en/default/global/header-search-dropdown.html.tmpl b/template/en/default/global/header-search-dropdown.html.tmpl new file mode 100644 index 000000000..590c95d31 --- /dev/null +++ b/template/en/default/global/header-search-dropdown.html.tmpl @@ -0,0 +1,48 @@ +[%# The contents of this file are subject to the Mozilla Public + # License Version 1.1 (the "License"); you may not use this file + # except in compliance with the License. You may obtain a copy of + # the License at http://www.mozilla.org/MPL/ + # + # Software distributed under the License is distributed on an "AS + # IS" basis, WITHOUT WARRANTY OF ANY KIND, either express or + # implied. See the License for the specific language governing + # rights and limitations under the License. + # + # The Original Code is the Bugzilla Bug Tracking System. + # + # The Initial Developer of the Original Code is Netscape Communications + # Corporation. Portions created by Netscape are + # Copyright (C) 1998 Netscape Communications Corporation. All + # Rights Reserved. + # + # Contributor(s): Gervase Markham <gerv@gerv.net> + # Svetlana Harisova <light@rathedg.com> + # Marc Schumann <wurblzap@gmail.com> + #%] + +[% PROCESS global/variables.none.tmpl %] + +<div id="header-search-dropdown" class="dropdown-content right" role="listbox" style="display: none;"> + <div id="header-search-dropdown-wrapper"> + [% IF user.showmybugslink OR user.queries.size OR user.queries_subscribed.size %] + <section id="header-search-dropdown-saved"> + <h3>Saved Searches</h3> + <ul role="none"> + [% IF user.showmybugslink %][% filtered_username = user.login FILTER uri %] + <li role="none"><a role="option" href="[% Param('mybugstemplate').replace('%userid%', filtered_username) %]"> + My [% terms.Bugs %]</a></li> + [% END %] + [% FOREACH q = user.queries %][% IF q.link_in_footer %] + <li role="none"><a role="option" href="buglist.cgi?cmdtype=runnamed&namedcmd=[% q.name FILTER uri %]"> + [% q.name FILTER html %]</a></li> + [% END %][% END %] + [% FOREACH q = user.queries_subscribed %] + <li role="none"><a role="option" href="buglist.cgi?cmdtype=dorem&remaction=run&namedcmd= + [% q.name FILTER uri %]&sharer_id=[% q.user.id FILTER uri %]" + title="Shared by [% q.user.identity FILTER html %]">[% q.name FILTER html FILTER no_break %]</a></li> + [% END %] + </ul> + </section> + [% END %] + </div> +</div> diff --git a/template/en/default/global/header.html.tmpl b/template/en/default/global/header.html.tmpl index 9baecbb53..81db1910b 100644 --- a/template/en/default/global/header.html.tmpl +++ b/template/en/default/global/header.html.tmpl @@ -246,16 +246,20 @@ <header id="header" role="banner"> <div class="inner"> - <h1 id="header-title" class="title"><a href="./" title="Go to home page">[% terms.BugzillaTitle %]</a></h1> - <form role="search" id="header-search" class="quicksearch quicksearch_check_empty" action="buglist.cgi"> - <div class="searchbox-outer"> - <input role="searchbox" id="quicksearch_top" name="quicksearch" + <h1 id="header-title" class="title"><a href="./" title="Go to home page">[% terms.Bugzilla %]</a></h1> + <form role="search" id="header-search" class="quicksearch" action="buglist.cgi"> + <section class="searchbox-outer dropdown" role="combobox" aria-expanded="false" aria-haspopup="listbox" + aria-owns="header-search-dropdown"> + <h2>Quick Search</h2> + <input role="searchbox" id="quicksearch_top" class="dropdown-button" name="quicksearch" autocomplete="off" value="[% quicksearch FILTER html %]" placeholder="Search [% terms.Bugs %]" - title="Search [% terms.bugs %] by keywords"> + title="Enter a [% terms.bug %] number or some search terms" aria-controls="header-search-dropdown" + aria-label="Quick Search"> <button type="submit" id="find_top" aria-label="Submit"> <span class="icon" aria-hidden="true"></span> </button> - </div> + [% PROCESS "global/header-search-dropdown.html.tmpl" %] + </section> </form> <nav id="header-nav"> <ul class="links"> @@ -286,13 +290,7 @@ aria-label="More tools…" aria-expanded="false" aria-haspopup="true" aria-controls="header-tools-menu"> <span class="icon" aria-hidden="true"></span> </button> - <ul class="dropdown-content" id="header-tools-menu" role="menu" style="display:none;"> - [% IF user.showmybugslink %] - [% filtered_username = user.login FILTER uri %] - <li role="presentation"> - <a href="[% Param('mybugstemplate').replace('%userid%', filtered_username) %]" role="menuitem" tabindex="-1">My [% terms.Bugs %]</a> - </li> - [% END %] + <ul class="dropdown-content left" id="header-tools-menu" role="menu" style="display:none;"> [% IF user.id %] <li role="presentation"> <a href="request.cgi?requester=[% user.login FILTER uri %]&requestee=[% user.login FILTER uri %]&do_union=1&group=type&action=queue" role="menuitem" tabindex="-1">My Requests</a> @@ -330,7 +328,7 @@ <span class="icon" aria-hidden="true"></span> [% END %] </button> - <ul class="dropdown-content" id="header-account-menu" role="menu" style="display:none;"> + <ul class="dropdown-content left" id="header-account-menu" role="menu" style="display:none;"> <li role="presentation"> <div href="user_profile" class="account-label"> <div class="name">[% user.name FILTER html %]</div> @@ -371,6 +369,7 @@ [% END %] </ul> [% END %] + [% Hook.process('external-links') %] </div> </header> [%# header %] diff --git a/template/en/default/global/useful-links.html.tmpl b/template/en/default/global/useful-links.html.tmpl deleted file mode 100644 index 90a3268cb..000000000 --- a/template/en/default/global/useful-links.html.tmpl +++ /dev/null @@ -1,73 +0,0 @@ -[%# The contents of this file are subject to the Mozilla Public - # License Version 1.1 (the "License"); you may not use this file - # except in compliance with the License. You may obtain a copy of - # the License at http://www.mozilla.org/MPL/ - # - # Software distributed under the License is distributed on an "AS - # IS" basis, WITHOUT WARRANTY OF ANY KIND, either express or - # implied. See the License for the specific language governing - # rights and limitations under the License. - # - # The Original Code is the Bugzilla Bug Tracking System. - # - # The Initial Developer of the Original Code is Netscape Communications - # Corporation. Portions created by Netscape are - # Copyright (C) 1998 Netscape Communications Corporation. All - # Rights Reserved. - # - # Contributor(s): Gervase Markham <gerv@gerv.net> - # Svetlana Harisova <light@rathedg.com> - # Marc Schumann <wurblzap@gmail.com> - #%] - -[%# Migration note: this whole file corresponds to the old %commandmenu% - substitution param in 'footerhtml' %] - -[% PROCESS global/variables.none.tmpl %] - -<ul id="useful-links"> - [%# Saved searches %] - - [% IF user.showmybugslink OR user.queries.size - OR user.queries_subscribed.size - %] - [% print_pipe = 0 %] - <li id="links-saved"> - <ul class="links"> - [% IF user.showmybugslink %] - [% filtered_username = user.login FILTER uri %] - <li><a href="[% Param('mybugstemplate').replace('%userid%', filtered_username) %]">My [% terms.Bugs %]</a></li> - [% print_pipe = 1 %] - [% END %] - - [% FOREACH q = user.queries %] - [% IF q.link_in_footer %] - <li>[% '<span class="separator">| </span>' IF print_pipe %] - <a href="buglist.cgi?cmdtype=runnamed&namedcmd=[% q.name FILTER uri %]">[% q.name FILTER html %]</a></li> - [% print_pipe = 1 %] - [% END %] - [% END %] - [% new_line = print_pipe %] - [% print_pipe = 0 %] - [% FOREACH q = user.queries_subscribed %] - [% IF new_line %] - <br> - [% new_line = 0 %] - [% END %] - <li> - [% '<span class="separator">| </span>' IF print_pipe %] - <a href="buglist.cgi?cmdtype=dorem&remaction=run&namedcmd= - [% q.name FILTER uri %]&sharer_id= - [% q.user.id FILTER uri %]" - class="shared" - title="Shared by [% q.user.identity FILTER html %]" - >[% q.name FILTER html FILTER no_break %]</a></li> - [% print_pipe = 1 %] - [% END %] - </ul> - </li> - [% END %] - - [%# Sections of links to more things users can do on this installation. %] - [% Hook.process("end") %] -</ul> |
