diff --git a/src/email/EmailShell.tsx b/src/email/EmailShell.tsx
index 6eaa606..fdfd4ee 100644
--- a/src/email/EmailShell.tsx
+++ b/src/email/EmailShell.tsx
@@ -48,6 +48,17 @@ function IconPhone() {
)
}
+function IconMapPin() {
+ return (
+
+ )
+}
+
function telHref(phone: string) {
// Remove spaces and dashes so tel links work reliably across clients.
const cleaned = phone.replace(/[\\s-]/g, '')
@@ -56,15 +67,17 @@ function telHref(phone: string) {
function ContactLine({
icon,
+ iconColor,
children,
}: {
icon: ReactNode
+ iconColor: string
children: ReactNode
}) {
return (
-
- {icon}
+
+ {icon}
{children}
@@ -113,42 +126,58 @@ export function EmailShell({ brand, title, previewText, children }: EmailShellPr
backgroundColor: 'rgba(255,255,255,0.55)',
}}
>
- {brand.footer.address ? (
-
- {brand.footer.address}
-
- ) : null}
+
+ Contact
+
- {brand.footer.email ? (
- }>
-
-
- {brand.footer.email}
-
-
-
- ) : null}
+
+
+ {brand.footer.address ? (
+ } iconColor={brand.primaryColor}>
+
+ {brand.footer.address}
+
+
+ ) : null}
+
- {brand.footer.phone1 || brand.footer.phone2 ? (
- }>
-
- {brand.footer.phone1 ? (
-
- {brand.footer.phone1}
+
+ {brand.footer.email ? (
+ } iconColor={brand.primaryColor}>
+
+ {brand.footer.email}
- ) : null}
- {brand.footer.phone1 && brand.footer.phone2 ? ' · ' : ''}
- {brand.footer.phone2 ? (
-
- {brand.footer.phone2}
-
- ) : null}
-
-
- ) : null}
+
+ ) : null}
+
+ {brand.footer.phone1 || brand.footer.phone2 ? (
+ } iconColor={brand.primaryColor}>
+
+ {brand.footer.phone1 ? (
+
+ {brand.footer.phone1}
+
+ ) : null}
+ {brand.footer.phone1 && brand.footer.phone2 ? ' · ' : ''}
+ {brand.footer.phone2 ? (
+
+ {brand.footer.phone2}
+
+ ) : null}
+
+
+ ) : null}
+
+