Files
plunk/packages/email/src/common/Footer.tsx
T

36 lines
1.2 KiB
TypeScript

import {Link, Section, Text} from '@react-email/components';
import * as React from 'react';
interface FooterProps {
projectId?: string;
landingUrl?: string;
}
export function Footer({projectId, landingUrl = 'https://www.useplunk.com'}: FooterProps) {
return (
<Section className="border-t border-gray-100 bg-gray-50 px-8 py-8">
<Text className="mb-4 mt-0 text-center text-xs leading-relaxed text-gray-600">
This email was sent by Plunk. .
</Text>
{projectId && (
<Text className="mb-4 mt-0 text-center text-xs leading-relaxed text-gray-400">
Project ID: <span className="font-mono">{projectId}</span>
</Text>
)}
<Text className="mb-0 mt-0 text-center text-xs leading-relaxed text-gray-500">
<Link href={landingUrl} className="text-gray-500 no-underline hover:text-gray-700">
Plunk
</Link>
{' • '}
<Link href={`${landingUrl}/privacy`} className="text-gray-500 no-underline hover:text-gray-700">
Privacy
</Link>
{' • '}
<Link href={`${landingUrl}/terms`} className="text-gray-500 no-underline hover:text-gray-700">
Terms
</Link>
</Text>
</Section>
);
}