import { Body, Container, Head, Heading, Hr, Html, Preview, Section, Text, } from "@react-email/components"; import * as React from "react"; interface AdminNotificationProps { name: string; email: string; phone: string; messageType: string; message: string; } export const AdminNotification = ({ name, email, phone, messageType, message, }: AdminNotificationProps) => { return ( New Contact Form Submission: {messageType} New Contact Form Submission

Name: {name} Email: {email} Phone: {phone} Type: {messageType}

Message: {message}

This message was submitted through the contact form. ); }; const main = { backgroundColor: "#1C1C1C", fontFamily: '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif', }; const container = { backgroundColor: "#2E2E2E", margin: "0 auto", padding: "20px 0 48px", marginBottom: "64px", borderRadius: "8px", }; const section = { padding: "0 48px", }; const h1 = { color: "#10B981", // Emerald-500 fontSize: "24px", fontWeight: "bold", margin: "40px 0", padding: "0", textAlign: "center" as const, }; const h2 = { color: "#10B981", // Emerald-500 fontSize: "20px", fontWeight: "bold", margin: "24px 0", padding: "0", }; const detailLabel = { color: "#A1A1AA", // Zinc-400 fontSize: "14px", margin: "8px 0 4px", }; const detailValue = { color: "#FFFFFF", fontSize: "14px", margin: "0 0 16px", }; const messageBox = { backgroundColor: "#3F3F46", // Zinc-700 padding: "16px", borderRadius: "4px", color: "#FFFFFF", fontSize: "14px", lineHeight: "24px", margin: "0", }; const hr = { borderColor: "#3F3F46", // Zinc-700 margin: "20px 0", }; const footer = { color: "#71717A", // Zinc-500 fontSize: "12px", marginTop: "12px", textAlign: "center" as const, }; export default AdminNotification;