You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ambari.apache.org by xi...@apache.org on 2017/03/30 01:14:31 UTC
[2/2] ambari git commit: AMBARI-20610. Unable to scroll down
collapsed navigation bar if it's higher that viewport.(xiwang)
AMBARI-20610. Unable to scroll down collapsed navigation bar if it's higher that viewport.(xiwang)
Project: http://git-wip-us.apache.org/repos/asf/ambari/repo
Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/8d075c6a
Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/8d075c6a
Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/8d075c6a
Branch: refs/heads/trunk
Commit: 8d075c6a1ae8c6b1d2c8e64b717dac464496f415
Parents: 77dd10c
Author: Xi Wang <xi...@apache.org>
Authored: Tue Mar 28 11:30:01 2017 -0700
Committer: Xi Wang <xi...@apache.org>
Committed: Wed Mar 29 18:11:39 2017 -0700
----------------------------------------------------------------------
.../app/styles/theme/bootstrap-ambari.css | 6 +---
.../vendor/scripts/theme/bootstrap-ambari.js | 29 +++++++++++++++++---
2 files changed, 26 insertions(+), 9 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/ambari/blob/8d075c6a/ambari-web/app/styles/theme/bootstrap-ambari.css
----------------------------------------------------------------------
diff --git a/ambari-web/app/styles/theme/bootstrap-ambari.css b/ambari-web/app/styles/theme/bootstrap-ambari.css
index b289517..b063fcf 100644
--- a/ambari-web/app/styles/theme/bootstrap-ambari.css
+++ b/ambari-web/app/styles/theme/bootstrap-ambari.css
@@ -1092,10 +1092,6 @@ input.radio:checked + label:after {
top: 0;
left: 50px;
}
-.navigation-bar-container.collapsed ul.nav.side-nav-menu li:hover ul.sub-menu,
-.navigation-bar-container.collapsed ul.nav.side-nav-footer li:hover ul.sub-menu {
- display: block;
-}
.navigation-bar-container.collapsed ul.nav.side-nav-menu li.submenu-li > a,
.navigation-bar-container.collapsed ul.nav.side-nav-footer li.submenu-li > a {
padding: 10px 5px 10px 25px;
@@ -1166,7 +1162,7 @@ input.radio:checked + label:after {
.navigation-bar-fit-height .navigation-bar-container {
height: 100%;
}
-.navigation-bar-fit-height .navigation-bar-container:not(.collapsed) .side-nav-menu {
+.navigation-bar-fit-height .navigation-bar-container .side-nav-menu {
overflow-y: auto;
}
.notifications-group {
http://git-wip-us.apache.org/repos/asf/ambari/blob/8d075c6a/ambari-web/vendor/scripts/theme/bootstrap-ambari.js
----------------------------------------------------------------------
diff --git a/ambari-web/vendor/scripts/theme/bootstrap-ambari.js b/ambari-web/vendor/scripts/theme/bootstrap-ambari.js
index 5cdbb55..d7ffdd1 100644
--- a/ambari-web/vendor/scripts/theme/bootstrap-ambari.js
+++ b/ambari-web/vendor/scripts/theme/bootstrap-ambari.js
@@ -30,6 +30,7 @@ $(document).ready(function () {
var settings = $.extend({}, $.fn.navigationBar.defaults, options);
return this.each(function () {
+ var _this = this;
var containerSelector = '.navigation-bar-container';
var $navigationContainer = $(this).find(containerSelector);
@@ -48,10 +49,10 @@ $(document).ready(function () {
$(this).addClass('navigation-bar-fit-height');
// make scrolling effect on side nav ONLY, i.e. not effected on ambari main contents
- $(this).find('.side-nav-menu').on('DOMMouseScroll mousewheel', function(ev) {
+ $(this).find('.side-nav-menu').on('DOMMouseScroll mousewheel', function (ev) {
var $this = $(this),
- scrollTop = (this).scrollTop,
- scrollHeight = (this).scrollHeight,
+ scrollTop = this.scrollTop,
+ scrollHeight = this.scrollHeight,
height = $this.innerHeight(),
delta = ev.originalEvent.wheelDelta,
up = delta > 0;
@@ -177,7 +178,9 @@ $(document).ready(function () {
$dropdownMenu.on('click', function () {
// some action was triggered, should hide this icon
var moreIcon = $(this).parent();
- setTimeout(function(){ moreIcon.hide(); }, 1000);
+ setTimeout(function () {
+ moreIcon.hide();
+ }, 1000);
});
$navigationContainer.children('.side-nav-menu').scroll(function () {
$moreActions.removeClass('open');
@@ -199,6 +202,16 @@ $(document).ready(function () {
// set the hover effect when collapsed, should show sub-menu on hovering
$subMenuItems.hover(function () {
$(this).find(subMenuSelector).show();
+ // set sub-menu position
+ var $parent = $(this);
+ var $header = $('.side-nav-header');
+ if (settings.fitHeight) {
+ $(this).find(subMenuSelector).css({
+ position: 'fixed',
+ top: $parent.offset().top - $header.offset().top + 'px',
+ left: 50 + 'px'
+ });
+ }
}, function () {
$(this).find(subMenuSelector).hide();
});
@@ -209,6 +222,14 @@ $(document).ready(function () {
});
$subMenuItems.unbind('mouseenter mouseleave');
$navigationContainer.find('.toggle-icon').removeClass(settings.menuLeftClass).addClass(settings.menuDownClass);
+ // set sub-menu position
+ if (settings.fitHeight) {
+ $(_this).find(subMenuSelector).css({
+ position: 'relative',
+ top: 0,
+ left: 0
+ });
+ }
}
//set main content left margin based on the width of side-nav