forked from AkkomaGang/akkoma-fe
fix notification unseen display rendering underneath the highlight
This commit is contained in:
parent
aa93664fd6
commit
c3d8ff65bd
2 changed files with 16 additions and 2 deletions
|
@ -26,11 +26,24 @@
|
|||
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)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.notification {
|
||||
box-sizing: border-box;
|
||||
|
|
|
@ -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>
|
||||
|
|
Loading…
Reference in a new issue