diff --git a/app/assets/javascripts/app/controllers/widget/online_notification.coffee b/app/assets/javascripts/app/controllers/widget/online_notification.coffee
index 4ae7eed4e..fb15b7b7e 100644
--- a/app/assets/javascripts/app/controllers/widget/online_notification.coffee
+++ b/app/assets/javascripts/app/controllers/widget/online_notification.coffee
@@ -124,8 +124,10 @@ class App.OnlineNotificationWidget extends App.Controller
if _.isEmpty(items)
@noNotifications.removeClass('hide')
+ @el.addClass 'is-empty'
else
@noNotifications.addClass('hide')
+ @el.removeClass 'is-empty'
markAllAsRead: (e) ->
e.preventDefault()
@@ -140,28 +142,6 @@ class App.OnlineNotificationWidget extends App.Controller
@fetch()
)
- updateHeight: ->
-
- # set height of notification popover
- heightApp = $('#app').height()
- heightPopoverSpacer = 22
- heightPopoverHeader = @header.outerHeight(true)
- isOverflowing = false
- heightPopoverContent = 0
- @$('.js-item').each (i, el) =>
-
- # accumulate height of items
- heightPopoverContent += el.clientHeight
-
- if (heightPopoverHeader + heightPopoverContent + heightPopoverSpacer) > heightApp
- containerHeight = heightApp - heightPopoverHeader - heightPopoverSpacer
- @content.css 'height', containerHeight
- isOverflowing = true
- return false # exit .each loop
-
- @el.toggleClass('is-overflowing', isOverflowing)
- @content.css 'height', '' if !isOverflowing
-
fetch: =>
load = (data) =>
@fetchedData = true
@@ -199,7 +179,6 @@ class App.OnlineNotificationWidget extends App.Controller
$(window).on 'keydown.notifications', @listNavigate
@shown = true
@el.show()
- @updateHeight()
hide: =>
$(window).off 'keydown.notifications'
@@ -225,7 +204,6 @@ class App.OnlineNotificationContentWidget extends App.CollectionController
onRenderEnd: ->
@container.counterGen()
- @container.updateHeight()
# generate desktop notifications
items = App.OnlineNotification.search(sortBy: 'created_at', order: 'DESC')
diff --git a/app/assets/stylesheets/zammad.scss b/app/assets/stylesheets/zammad.scss
index 4c20f48a3..346e06cc3 100644
--- a/app/assets/stylesheets/zammad.scss
+++ b/app/assets/stylesheets/zammad.scss
@@ -3707,17 +3707,20 @@ footer {
}
.popover--notifications {
+ padding: 0;
left: $navigationWidth;
margin: 8px 2px;
- min-height: 91px;
+ max-height: calc(100% - 16px);
width: auto;
max-width: 400px;
min-width: 350px;
position: absolute;
+ display: flex;
+ flex-direction: column;
@extend .zIndex-5;
-
- &.fade {
- display: inline-block !important;
+
+ &.is-empty .popover-notificationsHeader {
+ box-shadow: none;
}
.arrow {
@@ -3729,15 +3732,25 @@ footer {
flex: 1;
padding-left: 0;
padding-right: 0;
+ margin-bottom: 0;
overflow-y: auto;
- margin-bottom: 10px;
}
- &.is-overflowing .popover-notificationsHeader {
+ .popover-notificationsHeader {
box-shadow:
0 1px hsla(240,4%,95%,.5),
0 2px hsla(240,4%,95%,.2);
- padding-bottom: 17px;
+ padding-bottom: 14px;
+ flex-shrink: 0;
+
+ .btn {
+ padding-top: 3px;
+ padding-bottom: 5px;
+ }
+ }
+
+ .activity-placeholder {
+ margin-bottom: 21px;
}
}
diff --git a/contrib/icon-sprite.sketch b/contrib/icon-sprite.sketch
index 57e7b6475..f06a7b0df 100644
Binary files a/contrib/icon-sprite.sketch and b/contrib/icon-sprite.sketch differ
diff --git a/public/assets/images/icons.svg b/public/assets/images/icons.svg
index cfe578f73..e6f2a902a 100644
--- a/public/assets/images/icons.svg
+++ b/public/assets/images/icons.svg
@@ -1 +1 @@
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/public/assets/images/icons/important.svg b/public/assets/images/icons/important.svg
index 064d9a8df..2a9cc9510 100644
--- a/public/assets/images/icons/important.svg
+++ b/public/assets/images/icons/important.svg
@@ -1,12 +1,12 @@
-