[frontend/components] Add emoji to reaction notifications

This commit is contained in:
pancakes 2024-11-24 00:29:27 +10:00 committed by Laura Hausmann
parent 54a899df0b
commit 13a359a1b6
No known key found for this signature in database
GPG key ID: D044E84C5BE01605
2 changed files with 19 additions and 1 deletions

View file

@ -28,7 +28,8 @@
<span class="notification-icon"><Icon Name="Icons.Heart" Pack="IconStyle.Fill" Size="0.8em"/></span> <span class="notification-icon"><Icon Name="Icons.Heart" Pack="IconStyle.Fill" Size="0.8em"/></span>
<span class="notification-text">@Loc["liked note"]</span> <span class="notification-text">@Loc["liked note"]</span>
break; break;
case { Note: not null, Type: "reaction" }: case { Note: not null, Reaction: not null, Type: "reaction" }:
<img class="notification-reaction" src="@NotificationResponse.Reaction.Url" alt="@NotificationResponse.Reaction.Name.Trim(':')" title="@NotificationResponse.Reaction.Name"/>
<span class="notification-text">@Loc["reacted to your note"]</span> <span class="notification-text">@Loc["reacted to your note"]</span>
break; break;
case { Type: "follow", User: not null }: case { Type: "follow", User: not null }:

View file

@ -31,6 +31,23 @@
} }
} }
.notification-reaction {
position: absolute;
top: 3em;
left: 3em;
display: inline-block;
width: 1.25em;
height: 1.25em;
object-fit: contain;
filter: drop-shadow(0 0 0.2em rgba(0, 0, 0, 0.7));
transition-duration: 250ms;
}
.notification-reaction:hover {
transform: scale(1.5);
z-index: +1;
}
.notification-text { .notification-text {
font-size: 0.8em; font-size: 0.8em;
} }