diff --git a/src/Element/BackButton.css b/src/Element/BackButton.css
new file mode 100644
index 00000000..0ebb52b8
--- /dev/null
+++ b/src/Element/BackButton.css
@@ -0,0 +1,21 @@
+.back-button {
+ background: none;
+ padding: 0;
+ color: var(--highlight);
+ font-weight: 400;
+ font-size: var(--font-size);
+}
+
+.back-button svg {
+ margin-right: .5em;
+}
+
+.back-button:hover {
+ text-decoration: underline;
+}
+
+.back-button:hover {
+ background: none;
+ color: var(--font-color);
+ text-decoration: underline;
+}
diff --git a/src/Element/BackButton.tsx b/src/Element/BackButton.tsx
new file mode 100644
index 00000000..25564c41
--- /dev/null
+++ b/src/Element/BackButton.tsx
@@ -0,0 +1,17 @@
+import "./BackButton.css"
+
+import { useNavigate } from "react-router-dom";
+
+import ArrowBack from "Icons/ArrowBack";
+
+const BackButton = () => {
+ const navigate = useNavigate()
+
+ return (
+
+ )
+}
+
+export default BackButton
diff --git a/src/Element/FollowListBase.tsx b/src/Element/FollowListBase.tsx
index e65d4ec4..99e063e9 100644
--- a/src/Element/FollowListBase.tsx
+++ b/src/Element/FollowListBase.tsx
@@ -18,7 +18,7 @@ export default function FollowListBase({ pubkeys, title }: FollowListBaseProps)
{title}
-
+
{pubkeys?.map(a =>
)}
diff --git a/src/Element/Thread.tsx b/src/Element/Thread.tsx
index bc3fbef9..70ec56d4 100644
--- a/src/Element/Thread.tsx
+++ b/src/Element/Thread.tsx
@@ -1,10 +1,12 @@
import "./Thread.css";
import { useMemo } from "react";
import { Link } from "react-router-dom";
+
import { TaggedRawEvent, u256 } from "Nostr";
import { default as NEvent } from "Nostr/Event";
import EventKind from "Nostr/EventKind";
import { eventLink } from "Util";
+import BackButton from "Element/BackButton";
import Note from "Element/Note";
import NoteGhost from "Element/NoteGhost";
@@ -83,6 +85,8 @@ export default function Thread(props: ThreadProps) {
}
return (
+ <>
+
{renderRoot()}
{root ? renderChain(root.Id) : null}
@@ -100,5 +104,6 @@ export default function Thread(props: ThreadProps) {
})}
>}
+ >
);
-}
\ No newline at end of file
+}
diff --git a/src/Icons/ArrowBack.tsx b/src/Icons/ArrowBack.tsx
new file mode 100644
index 00000000..78c0cc3d
--- /dev/null
+++ b/src/Icons/ArrowBack.tsx
@@ -0,0 +1,9 @@
+const ArrowBack = () => {
+ return (
+
+ )
+}
+
+export default ArrowBack
diff --git a/src/index.css b/src/index.css
index f75d7a74..fb3dbbf0 100644
--- a/src/index.css
+++ b/src/index.css
@@ -120,6 +120,7 @@ button {
border-radius: 16px;
outline: none;
}
+
button:hover {
background-color: var(--font-color);
color: var(--bg-color);
@@ -129,13 +130,27 @@ button.secondary {
color: var(--font-color);
background-color: var(--gray-dark);
}
+
+button.transparent {
+ background-color: transparent;
+ border: 1px solid var(--gray-superdark);
+}
+
.light button.secondary {
background-color: var(--gray);
}
+
button.secondary:hover {
+ border: none;
color: var(--font-color);
background-color: var(--gray-superdark);
}
+
+button.transparent:hover {
+ color: var(--bg-color);
+ background-color: var(--font-color);
+}
+
.light button.secondary:hover {
background-color: var(--gray-secondary);
}