fix notification unseen display rendering underneath the highlight

This commit is contained in:
Henry Jameson 2018-11-21 03:52:12 +03:00
parent aa93664fd6
commit c3d8ff65bd
2 changed files with 16 additions and 2 deletions

View File

@ -26,11 +26,24 @@
color: var(--text, $fallback--text); color: var(--text, $fallback--text);
} }
.unseen { .notification {
position: relative;
.notification-overlay {
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
}
&.unseen {
.notification-overlay {
background-image: linear-gradient(135deg, var(--badgeNotification, $fallback--cRed) 4px, transparent 10px) background-image: linear-gradient(135deg, var(--badgeNotification, $fallback--cRed) 4px, transparent 10px)
} }
} }
}
}
.notification { .notification {
box-sizing: border-box; box-sizing: border-box;

View File

@ -13,6 +13,7 @@
</div> </div>
<div class="panel-body"> <div class="panel-body">
<div v-for="notification in visibleNotifications" :key="notification.action.id" class="notification" :class='{"unseen": !notification.seen}'> <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> <notification :notification="notification"></notification>
</div> </div>
</div> </div>