) : null}
diff --git a/src/components/messageStream/bubbles/ImageWithTextBubble.tsx b/src/components/messageStream/bubbles/ImageWithTextBubble.tsx
index 62e45d2..af4669d 100644
--- a/src/components/messageStream/bubbles/ImageWithTextBubble.tsx
+++ b/src/components/messageStream/bubbles/ImageWithTextBubble.tsx
@@ -31,7 +31,7 @@ export function ImageWithTextBubble({ post }: { post: Post }) {
{text ? (
-
diff --git a/src/components/messageStream/bubbles/TextBubble.tsx b/src/components/messageStream/bubbles/TextBubble.tsx
index 22da71f..bfb8523 100644
--- a/src/components/messageStream/bubbles/TextBubble.tsx
+++ b/src/components/messageStream/bubbles/TextBubble.tsx
@@ -6,7 +6,7 @@ import { postDisplayText } from "../utils/postText";
export function TextBubble({ post }: { post: Post }) {
const { lang } = useI18n();
return (
-
+
{autolink(postDisplayText(post, lang))}
);
diff --git a/src/components/messageStream/bubbles/VideoBubble.tsx b/src/components/messageStream/bubbles/VideoBubble.tsx
index 5b2fcb5..4720ba8 100644
--- a/src/components/messageStream/bubbles/VideoBubble.tsx
+++ b/src/components/messageStream/bubbles/VideoBubble.tsx
@@ -112,7 +112,7 @@ export function VideoBubble({ post }: { post: Post }) {
)}
{text ? (
-
+
{autolink(text)}
) : null}
diff --git a/src/components/messageStream/overlays/ImageLightbox.tsx b/src/components/messageStream/overlays/ImageLightbox.tsx
index 9bcae66..92cb6a8 100644
--- a/src/components/messageStream/overlays/ImageLightbox.tsx
+++ b/src/components/messageStream/overlays/ImageLightbox.tsx
@@ -210,7 +210,7 @@ function LightboxView({
/>
{caption ? (
-
diff --git a/src/components/messageStream/utils/autolink.tsx b/src/components/messageStream/utils/autolink.tsx
index ba25da8..4ebebe0 100644
--- a/src/components/messageStream/utils/autolink.tsx
+++ b/src/components/messageStream/utils/autolink.tsx
@@ -24,7 +24,7 @@ export function autolink(text: string): ReactNode[] {
href={url}
target="_blank"
rel="noopener noreferrer"
- className="text-ark-gold underline underline-offset-2 break-all hover:text-ark-gold2"
+ className="message-stream-copyable-text select-text break-all text-ark-gold underline underline-offset-2 hover:text-ark-gold2"
>
{url}
,
diff --git a/src/index.css b/src/index.css
index 37cbb7b..5b4e14d 100644
--- a/src/index.css
+++ b/src/index.css
@@ -41,3 +41,19 @@ header button {
.gold-underline {
box-shadow: inset 0 -2px 0 #eeb726;
}
+
+.message-stream-copyable-text,
+.message-stream-copyable-text * {
+ -webkit-user-select: text;
+ user-select: text;
+}
+
+.message-stream-copyable-text {
+ -webkit-touch-callout: default;
+ cursor: text;
+}
+
+.message-stream-copyable-text::selection,
+.message-stream-copyable-text *::selection {
+ background: rgba(238, 183, 38, 0.35);
+}