diff options
| author | Henry Jameson <me@hjkos.com> | 2018-11-21 03:52:12 +0300 |
|---|---|---|
| committer | Henry Jameson <me@hjkos.com> | 2018-11-21 03:52:12 +0300 |
| commit | c3d8ff65bdcf02a014aafab93628e0508509d25a (patch) | |
| tree | f7078b15a3f49ef4cf2fbe97afeeb520502c0941 /src | |
| parent | aa93664fd68e3fc27821fc1b03af25b6a6e6ae87 (diff) | |
fix notification unseen display rendering underneath the highlight
Diffstat (limited to 'src')
| -rw-r--r-- | src/components/notifications/notifications.scss | 17 | ||||
| -rw-r--r-- | src/components/notifications/notifications.vue | 1 |
2 files changed, 16 insertions, 2 deletions
diff --git a/src/components/notifications/notifications.scss b/src/components/notifications/notifications.scss index fcc0c3d4..26455ffb 100644 --- a/src/components/notifications/notifications.scss +++ b/src/components/notifications/notifications.scss @@ -26,9 +26,22 @@ color: var(--text, $fallback--text); } - .unseen { + .notification { + position: relative; + + .notification-overlay { + position: absolute; + top: 0; + right: 0; + left: 0; + bottom: 0; + } - background-image: linear-gradient(135deg, var(--badgeNotification, $fallback--cRed) 4px, transparent 10px) + &.unseen { + .notification-overlay { + background-image: linear-gradient(135deg, var(--badgeNotification, $fallback--cRed) 4px, transparent 10px) + } + } } } diff --git a/src/components/notifications/notifications.vue b/src/components/notifications/notifications.vue index 7a4322f9..eb6c4dd0 100644 --- a/src/components/notifications/notifications.vue +++ b/src/components/notifications/notifications.vue @@ -13,6 +13,7 @@ </div> <div class="panel-body"> <div v-for="notification in visibleNotifications" :key="notification.action.id" class="notification" :class='{"unseen": !notification.seen}'> + <div class="notification-overlay"></div> <notification :notification="notification"></notification> </div> </div> |