Sutty/trabajo-afectivo
5
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Improved positioning of notification popover (way done in controller and css with unmodified BS popover.js).

Browse source
This commit is contained in:
Martin Edenhofer 2015-01-21 17:20:34 +01:00
parent f55b6c76c7
commit 0404fe31ae
2 changed files with 21 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
app/assets/javascripts/app/controllers/widget/online_notification.js.coffee
View file

@ -64,17 +64,19 @@ class App.OnlineNotificationWidget extends App.Controller
onShow: =>
@updateContent()
# set heigth of notification popover
heightApp = $('#navigation').height()
heightPopoverHeader = $('.js-notificationsContainer .popover-notificationsHeader').height()
heightPopoverContent = $('.js-notificationsContainer .popover-content').get(0).scrollHeight
height = heightPopoverHeader + heightPopoverContent
if height > heightApp
height = heightApp - heightPopoverHeader - 56
$('.js-notificationsContainer .popover-content').css('height', "#{height}px")
# set popover arrow
$('.js-notificationsContainer .arrow').css('top', '20px')
# set height of notification popover
notificationsContainer = $('.js-notificationsContainer')
heightApp = $('#app').height()
heightPopoverSpacer = 36
heightPopoverHeader = notificationsContainer.find('.popover-notificationsHeader').outerHeight()
heightPopoverContent = notificationsContainer.find('.popover-content').get(0).scrollHeight
heightPopoverContentNew = heightPopoverContent
if (heightPopoverHeader + heightPopoverContent + heightPopoverSpacer) > heightApp
heightPopoverContentNew = heightApp - heightPopoverHeader - heightPopoverSpacer
notificationsContainer.addClass('is-overflowing')
else
notificationsContainer.removeClass('is-overflowing')
notificationsContainer.find('.popover-content').css('height', "#{heightPopoverContentNew}px")
# close notification list on click
$('.js-notificationsContainer').on('click', (e) =>

11
app/assets/stylesheets/zammad.css.scss
View file

@ -2710,18 +2710,23 @@ footer {
}
.popover--notifications {
min-height: 100px;
@extend .zIndex-5;
&.is-visible {
@extend .vertical;
}
.arrow {
top: 23px !important;
}
.popover-content {
@extend .flex;
}
&.is-overflowing .popover-notificationsHeader {
box-shadow:
box-shadow:
0 1px hsla(240,4%,95%,.5),
0 2px hsla(240,4%,95%,.2);
}
@ -2732,7 +2737,7 @@ footer {
@extend .end;
padding-bottom: 22px;
margin: 21px 17px 0;
.popover-title {
@extend h1;
padding: 0;