diff --git a/src/lib/ui/Notification.svelte b/src/lib/ui/Notification.svelte
index b679fdb..53a75da 100644
--- a/src/lib/ui/Notification.svelte
+++ b/src/lib/ui/Notification.svelte
@@ -108,6 +108,26 @@
{:else}
{@html data.status.html}
{/if}
+
+ {#if data.status.media && data.status.media.length > 0}
+
+ {/if}
{#if data.type === "mention"}
{#if data.status.reactions}
@@ -270,4 +290,35 @@
outline-color: var(--warn-bg);
transition: outline .05s, box-shadow .05s;
}
+
+ .notif-media-container {
+ margin: 16px 0 4px 0;
+ display: flex;
+ flex-direction: row;
+ gap: 8px;
+ font-size: 14px;
+ line-height: 1.45em;
+ }
+
+ .notif-media {
+ display: inline-block;
+ border-radius: 12px;
+ background-color: #000;
+ overflow: hidden;
+ }
+
+ .notif-media a {
+ width: 5em;
+ height: 5em;
+ display: block;
+ cursor: zoom-in;
+ }
+
+ .notif-media img,
+ .notif-media video {
+ width: 100%;
+ height: 100%;
+ display: block;
+ object-fit: cover;
+ }