Fix: Image embeds were unable to be opened into the image view

- Image embeds actions now use a better styling that's the same as the other action stylings

src/components/common/messaging/embed/Embed.module.scss

@@ -95,3 +95,39 @@
         }
     }
 }
+
+// TODO: unified actions css (see attachment.module.scss for other actions css)
+.actions {
+    display: grid;
+    grid-template: 
+        "name open" auto
+        "size open" auto
+        / minmax(20px, 1fr) min-content;
+
+    align-items: center;
+    column-gap: 8px;
+    
+    width: 100%;
+    padding: 8px;
+    overflow: none;
+
+    color: var(--foreground);
+    background: var(--secondary-background);
+
+    span {
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        overflow: hidden;
+    }
+    
+    .filesize {
+        grid-area: size;
+
+        font-size: 10px;
+        color: var(--secondary-foreground);
+    }
+
+    .openIcon {
+        grid-area: open;
+    }
+}

src/components/common/messaging/embed/EmbedMediaActions.tsx

@@ -14,13 +14,11 @@ export default function EmbedMediaActions({ embed }: Props) {
 
     return (
         <div className={styles.actions}>
-            <div className={styles.info}>
-                <span className={styles.filename}>{filename}</span>
-                <span className={styles.filesize}>
-                    {embed.width + "x" + embed.height}
-                </span>
-            </div>
-            <a href={embed.url} target="_blank">
+            <span className={styles.filename}>{filename}</span>
+            <span className={styles.filesize}>
+                {embed.width + "x" + embed.height}
+            </span>
+            <a href={embed.url} class={styles.openIcon} target="_blank">
                 <IconButton>
                     <LinkExternal size={24} />
                 </IconButton>