prehistoric-systems/omnivore
1
0
Fork 0
mirror of https://github.com/omnivore-app/omnivore.git synced 2026-03-11 08:54:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Use buttons in the subscribe directly blocks

Browse source
This commit is contained in:
Jackson Harper 2022-03-31 12:04:31 -07:00
parent 89626bf435
commit 1215735d4c
1 changed files with 39 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

43
packages/web/pages/help/newsletters.tsx
View file

@ -5,6 +5,37 @@ import { Button } from '../../components/elements/Button'
import Link from 'next/link'
import { StyledText } from '../../components/elements/StyledText'
import { styled } from '@stitches/react'
import { Copy, Plus } from 'phosphor-react'
import { theme } from '../../components/tokens/stitches.config'
const AddEmailButton = () => {
return (<Button
onClick={() => {}}
style="ctaDarkYellow"
css={{
cursor: 'default',
display: 'inline-flex',
alignItems: 'center',
}}
>
<Plus size={18} style={{ marginRight: '6.5px' }} />
<SpanBox>Add Email</SpanBox>
</Button>)
}
const CopyButton = () => {
return (
<Button style="plainIcon" css={{
pl: '2px',
pr: '4px',
cursor: 'default',
display: 'inline-flex',
}}
onClick={() => {}}
>
<Copy color={theme.colors.grayTextContrast.toString()} />
</Button>)
}
export default function Newsletters(): JSX.Element {
const HighlightText = styled(SpanBox, {
@ -74,10 +105,10 @@ export default function Newsletters(): JSX.Element {
<h2 id="directly">Subscribing Directly</h2>
<p>
Create your first email address by clicking the <HighlightText>Create New Email</HighlightText> button on
the <Link href='/settings/emails'>emails page</Link>. Copy the email address to your clipboard using the
copy button, and enter that email address into an email subscription box. If you are already logged into
Substack you might need to logout to use your new email address.
Create your first email address by clicking the <AddEmailButton /> button on
the <Link href='/settings/emails'>emails page</Link>. Copy the email address
to your clipboard using the <CopyButton />
copy button, and enter that email address into an email subscription box.
</p>
<HStack distribution="center" css={{ width: '100%', my: '32px' }}>
@ -87,6 +118,10 @@ export default function Newsletters(): JSX.Element {
/>
</HStack>
<p>
If you are already logged into Substack you might need to logout to use your new email address.
</p>
<h2 id="forwarding">Create a Forwarding Rule</h2>
<p>If you are a Gmail user you can create a forwarding rule to send email from your regular account to your Omnivore email address. This is useful if you have an existing paid newsletter subscription. For free newsletters we recommend subscribing directly to the newsletter with your Omnivore email address.</p>