diff --git a/src/components/InfoPanel/index.tsx b/src/components/InfoPanel/index.tsx
index d2d3bfa..6092085 100644
--- a/src/components/InfoPanel/index.tsx
+++ b/src/components/InfoPanel/index.tsx
@@ -7,6 +7,8 @@ import { ViewMode } from '../SlideShow';
import AuthorProfile from '../AuthorProfile';
import useProfile from '../../utils/useProfile';
import { useGlobalState } from '../../utils/globalState';
+import IconLink from '../Icons/IconLink';
+import { nip19 } from 'nostr-tools';
type InfoPanelProps = {
image: NostrImage;
@@ -31,9 +33,19 @@ const InfoPanel = ({ image, onClose, setViewMode, settings }: InfoPanelProps) =>
return (
- {profile &&
{profile}
}
+ {profile && (
+
+ {profile}
+ {image?.noteId && (
+
+
+
+ )}
+
+ )}
+
+
{image?.content}
-
{image?.content}
{image.tags.length > 0 && (
{uniq(image?.tags)
diff --git a/src/components/InfoPanel/styles.css b/src/components/InfoPanel/styles.css
index d96fb70..3c82980 100644
--- a/src/components/InfoPanel/styles.css
+++ b/src/components/InfoPanel/styles.css
@@ -13,8 +13,17 @@
width: 80dvw;
display: flex;
flex-direction: column;
+ gap: 4px;
}
+.infoPanel .link svg {
+ padding: 0.5em;
+ width: 1.5em;
+ height: 1.5em;
+ cursor: pointer;
+ color: white;
+ }
+
.infoPanelContent {
padding-left: 1em;
padding-right: 1em;
@@ -65,6 +74,15 @@
}
}
+.infoPanelAuthor {
+ display: flex;
+ flex-direction: row;
+}
+
+.infoPanelAuthor .link {
+ padding: 1em;
+}
+
.infoPanelAuthor .author-info {
position: relative;
left: initial;
@@ -72,6 +90,7 @@
padding-left: 1em;
padding-top: 1em;
display: flex;
+ flex-grow: 1;
flex-direction: row;
gap: 8px;
align-items: center;