diff --git a/packages/web/components/elements/InfoLink.tsx b/packages/web/components/elements/InfoLink.tsx new file mode 100644 index 000000000..0424f0b2e --- /dev/null +++ b/packages/web/components/elements/InfoLink.tsx @@ -0,0 +1,33 @@ +import Link from 'next/link' +import { Info } from 'phosphor-react' +import { Box } from '../elements/LayoutPrimitives' +import { theme } from '../tokens/stitches.config' +import { TooltipWrapped } from './Tooltip' + +type InfoLinkProps = { + href: string +} + +const TooltipStyle = { + backgroundColor: '#F9D354', + color: '#0A0806', +} + +export function InfoLink(props: InfoLinkProps): JSX.Element { + return ( + + + + + + + + + + ) +} diff --git a/packages/web/pages/settings/emails.tsx b/packages/web/pages/settings/emails.tsx index b0a3fa1b3..79d293648 100644 --- a/packages/web/pages/settings/emails.tsx +++ b/packages/web/pages/settings/emails.tsx @@ -24,6 +24,7 @@ import { StyledText } from '../../components/elements/StyledText' import { applyStoredTheme } from '../../lib/themeUpdater' import { showSuccessToast } from '../../lib/toastHelpers' import Link from 'next/link' +import { InfoLink } from '../../components/elements/InfoLink' enum TextType { EmailAddress, @@ -215,20 +216,7 @@ export default function EmailsPage(): JSX.Element { Email Addresses{' '} - - - - - - - - - +