diff --git a/packages/app/src/Element/Event/Note.css b/packages/app/src/Element/Event/Note.css index 353ef0da..5a4c8215 100644 --- a/packages/app/src/Element/Event/Note.css +++ b/packages/app/src/Element/Event/Note.css @@ -141,7 +141,6 @@ .trash-icon { color: var(--error); - margin-right: auto; } .note-expand .body { diff --git a/packages/app/src/Element/Relay/Relay.css b/packages/app/src/Element/Relay/Relay.css index a61f3d99..23854ef1 100644 --- a/packages/app/src/Element/Relay/Relay.css +++ b/packages/app/src/Element/Relay/Relay.css @@ -1,8 +1,6 @@ .relay { - margin-top: 10px; background-color: var(--gray-secondary); border-radius: 5px; - text-align: start; display: grid; grid-template-columns: min-content auto; overflow: hidden; @@ -12,33 +10,3 @@ .relay > div { padding: 5px; } - -.relay-extra { - padding: 5px; - margin: 0 5px; - background-color: var(--gray-tertiary); - border-radius: 0 0 5px 5px; - white-space: nowrap; - font-size: var(--font-size-small); -} - -.icon-btn { - padding: 2px 10px; - border-radius: 10px; - background-color: var(--gray); - user-select: none; - color: var(--font-color); - display: inline-block; -} - -.icon-btn:hover { - cursor: pointer; -} - -.checkmark { - margin-left: 0.5em; - padding: 2px 10px; - background-color: var(--gray); - border-radius: 10px; - display: inline-block; -} diff --git a/packages/app/src/Element/Relay/Relay.tsx b/packages/app/src/Element/Relay/Relay.tsx index 95930b6f..5549437c 100644 --- a/packages/app/src/Element/Relay/Relay.tsx +++ b/packages/app/src/Element/Relay/Relay.tsx @@ -1,18 +1,17 @@ import "./Relay.css"; import { useContext, useMemo } from "react"; -import { FormattedMessage } from "react-intl"; import { useNavigate } from "react-router-dom"; import { RelaySettings } from "@snort/system"; import { unixNowMs } from "@snort/shared"; +import classNames from "classnames"; import useRelayState from "Feed/RelayState"; import { SnortContext } from "@snort/system-react"; import { getRelayName, unwrap } from "SnortUtils"; import useLogin from "Hooks/useLogin"; -import { setRelays } from "Login"; -import Icon from "Icons/Icon"; - -import messages from "../messages"; +import { removeRelay, setRelays } from "Login"; +import { RelayFavicon } from "./RelaysMetadata"; +import { AsyncIcon } from "Element/AsyncIcon"; export interface RelayProps { addr: string; @@ -42,48 +41,52 @@ export default function Relay(props: RelayProps) { return ( <> -
{url}
- {url}
+