diff --git a/src/element/DM.css b/src/element/DM.css index 5fb49eb1..1951dd41 100644 --- a/src/element/DM.css +++ b/src/element/DM.css @@ -26,7 +26,3 @@ max-width: 100%; max-height: 500px; } - -.dm p { - margin: 0; -} diff --git a/src/element/DM.tsx b/src/element/DM.tsx index 70fd4962..4f2d97f9 100644 --- a/src/element/DM.tsx +++ b/src/element/DM.tsx @@ -10,7 +10,7 @@ import Event from "../nostr/Event"; // @ts-ignore import NoteTime from "./NoteTime"; // @ts-ignore -import Text from "../Text"; +import Text from "./Text"; export type DMProps = { data: any @@ -44,4 +44,4 @@ export default function DM(props: DMProps) { ) -} \ No newline at end of file +} diff --git a/src/element/Note.css b/src/element/Note.css index 14ea35fd..7ce045e7 100644 --- a/src/element/Note.css +++ b/src/element/Note.css @@ -29,55 +29,6 @@ word-break: normal; } -.note > .body h1 { - margin: 0; -} -.note > .body h2 { - margin: 0; -} -.note > .body h3 { - margin: 0; -} -.note > .body h4 { - margin: 0; -} -.note > .body h5 { - margin: 0; -} -.note > .body h6 { - margin: 0; -} - -.note > .body > p { - margin: 0; -} - -.note > .body > pre { -} - -.note > .body > ul, .note > .body > ol { - margin: 0; -} - -.note > .body > hr { - border: 0; - height: 1px; - background-image: var(--gray-gradient); - margin: 20px; -} - -.note > .body img, .note > .body video, .note > .body iframe { - max-width: 100%; - max-height: 500px; - margin: 10px auto; - display: block; -} - -.note > .body iframe, note > .body video { - width: -webkit-fill-available; - aspect-ratio: 16 / 9; -} - .note > .header img:hover, .note > .header .name > .reply:hover, .note .body:hover { cursor: pointer; } @@ -98,12 +49,7 @@ border-left: 3px solid var(--highlight); } - .indented .note { border-bottom: none; padding: 4px; } - -.note .body a { - color: var(--highlight); -} diff --git a/src/element/Note.js b/src/element/Note.js index cd7e3328..7745ae2e 100644 --- a/src/element/Note.js +++ b/src/element/Note.js @@ -5,7 +5,7 @@ import { useNavigate } from "react-router-dom"; import Event from "../nostr/Event"; import ProfileImage from "./ProfileImage"; -import Text from "../Text"; +import Text from "./Text"; import { eventLink, hexToBech32 } from "../Util"; import NoteFooter from "./NoteFooter"; import NoteTime from "./NoteTime"; diff --git a/src/element/Text.css b/src/element/Text.css new file mode 100644 index 00000000..e58c07ce --- /dev/null +++ b/src/element/Text.css @@ -0,0 +1,53 @@ +.text a { + color: var(--highlight); +} + +.text h1 { + margin: 0; +} +.text h2 { + margin: 0; +} +.text h3 { + margin: 0; +} +.text h4 { + margin: 0; +} +.text h5 { + margin: 0; +} +.text h6 { + margin: 0; +} + +.text p { + margin: 0; +} + +.text pre { + margin: 0; +} + +.text ul, .text ol { + margin: 0; +} + +.text hr { + border: 0; + height: 1px; + background-image: var(--gray-gradient); + margin: 20px; +} + +.text img, .text video, .text iframe { + max-width: 100%; + max-height: 500px; + margin: 10px auto; + display: block; +} + +.text iframe, .text video { + width: -webkit-fill-available; + aspect-ratio: 16 / 9; +} diff --git a/src/Text.js b/src/element/Text.js similarity index 94% rename from src/Text.js rename to src/element/Text.js index 9e7eb0a9..3d83efd8 100644 --- a/src/Text.js +++ b/src/element/Text.js @@ -2,11 +2,13 @@ import { Link } from "react-router-dom"; import ReactMarkdown from "react-markdown"; import { TwitterTweetEmbed } from "react-twitter-embed"; -import Invoice from "./element/Invoice"; -import { UrlRegex, FileExtensionRegex, MentionRegex, InvoiceRegex, YoutubeUrlRegex, TweetUrlRegex, HashtagRegex } from "./Const"; -import { eventLink, hexToBech32, profileLink } from "./Util"; -import LazyImage from "./element/LazyImage"; -import Hashtag from "./element/Hashtag"; +import { UrlRegex, FileExtensionRegex, MentionRegex, InvoiceRegex, YoutubeUrlRegex, TweetUrlRegex, HashtagRegex } from "../Const"; +import { eventLink, hexToBech32, profileLink } from "../Util"; +import Invoice from "./Invoice"; +import LazyImage from "./LazyImage"; +import Hashtag from "./Hashtag"; + +import './Text.css' function transformHttpLink(a) { try { @@ -165,6 +167,6 @@ export default function Text({ content, tags, users }) { a: (props) => transformHttpLink(props.href), li: (props) => transformLi({ body: props.children, tags, users }), } - return {content} + return {content} } diff --git a/src/pages/ProfilePage.js b/src/pages/ProfilePage.js index c05b16cd..3d46a706 100644 --- a/src/pages/ProfilePage.js +++ b/src/pages/ProfilePage.js @@ -11,7 +11,7 @@ import useProfile from "../feed/ProfileFeed"; import FollowButton from "../element/FollowButton"; import { extractLnAddress, parseId, hexToBech32 } from "../Util"; import Timeline from "../element/Timeline"; -import Text from '../Text' +import Text from '../element/Text' import LNURLTip from "../element/LNURLTip"; import Nip05, { useIsVerified } from "../element/Nip05"; import Copy from "../element/Copy";