import { Body, Container, Head, Heading, Hr, Html, Preview, Section, Text, } from "@react-email/components"; import * as React from "react"; interface UserConfirmationProps { name: string; messageType: string; message: string; } export const UserConfirmation = ({ name, messageType, message, }: UserConfirmationProps) => { return ( Thank you for contacting us Thank You for Contacting Us

Dear {name}, We have received your message regarding "{messageType}" and will get back to you as soon as possible. Here's a copy of your message: {message} If you have any further questions, please don't hesitate to contact us.

Best regards,
The Support Team ); }; 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 text = { color: "#FFFFFF", fontSize: "14px", lineHeight: "24px", margin: "16px 0", }; const messageLabel = { color: "#A1A1AA", // Zinc-400 fontSize: "14px", margin: "24px 0 8px", }; const messageBox = { backgroundColor: "#3F3F46", // Zinc-700 padding: "16px", borderRadius: "4px", color: "#FFFFFF", fontSize: "14px", lineHeight: "24px", margin: "0 0 24px", }; const hr = { borderColor: "#3F3F46", // Zinc-700 margin: "20px 0", }; const signature = { color: "#FFFFFF", fontSize: "14px", lineHeight: "24px", margin: "16px 0", textAlign: "center" as const, }; export default UserConfirmation;