diff --git a/services/web/app/views/project/list.jade b/services/web/app/views/project/list.jade index 93bcba6df6..781b2963ce 100644 --- a/services/web/app/views/project/list.jade +++ b/services/web/app/views/project/list.jade @@ -18,7 +18,7 @@ block content .content.content-alt(ng-controller="ProjectPageController") .container .row - .col-md-2.col-xs-3 + aside.col-md-2.col-xs-3 include ./list/side-bar .col-md-10.col-xs-9 diff --git a/services/web/app/views/project/list/project-list.jade b/services/web/app/views/project/list/project-list.jade index 1d21c0c9fd..14ab4fc3ce 100644 --- a/services/web/app/views/project/list/project-list.jade +++ b/services/web/app/views/project/list/project-list.jade @@ -109,11 +109,11 @@ .row.row-spaced .col-xs-12 - .card.card-thin + .card.card-thin.project-list-card ul.list-unstyled.project-list.structured-list( select-all-list, ng-if="projects.length > 0", - max-height="windowHeight - 290", + max-height="projectListHeight - 25", ng-cloak ) li.container-fluid diff --git a/services/web/public/coffee/main/project-list.coffee b/services/web/public/coffee/main/project-list.coffee index fd4556c7ff..ee015638f9 100644 --- a/services/web/public/coffee/main/project-list.coffee +++ b/services/web/public/coffee/main/project-list.coffee @@ -59,11 +59,28 @@ define [ $scope.predicate = "lastUpdated" $scope.reverse = true - $scope.windowHeight = $window.innerHeight + recalculateProjectListHeight = () -> + topOffset = $(".project-list-card").offset().top + bottomOffset = $("footer").outerHeight() + 25 + sideBarHeight = $("aside").height() - 56 + # When footer is visible and page doesn't need to scroll we just make it + # span between header and footer + height = $window.innerHeight - topOffset - bottomOffset + + # When page is small enough that this pushes the project list smaller than + # the side bar, then the window going to have to scroll to take into account the + # footer. So we now start to track to the bottom of the window, with a 25px padding + # since the footer is hidden below the fold. Don't ever get bigger than the sidebar + # though since that's what triggered this happening in the first place. + if height < sideBarHeight + height = Math.min(sideBarHeight, $window.innerHeight - topOffset - 25) + $scope.projectListHeight = height + + recalculateProjectListHeight() angular.element($window).bind "resize", () -> - $scope.windowHeight = $window.innerHeight + recalculateProjectListHeight() $scope.$apply() - + # Allow tags to be accessed on projects as well projectsById = {} for project in $scope.projects