function CallToActionButton({ href, children, className }) { return /*#__PURE__*/ React.createElement("a", { href: href, className: `bg-[#F3E3AC] text-[#2E3521] hover:bg-[#EDE1BC] font-opensans py-2 mt-4 transition-colors duration-300 ${className}`, __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, children); } function CallToActionButtonStory() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 12, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(CallToActionButton, { href: "https://youtu.be/vgNMAbLgzI0", __source: { fileName: "", lineNumber: 13, columnNumber: 7 }, __self: this }, "Call To Action")); } function MainComponent() { return /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center min-h-screen bg-[#1D2115]", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap md:flex-nowrap rounded-lg overflow-hidden shadow-lg max-w-4xl w-full bg-[#2E3521]", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full p-8 flex flex-col justify-center items-center", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 6, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "logo.png", alt: "Veteran's Affairs logo", className: "w-[100px] h-[100px]", __source: { fileName: "", lineNumber: 7, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("h2", { className: "text-[#F3E3AC] font-opensans text-center mb-8", __source: { fileName: "", lineNumber: 9, columnNumber: 11 }, __self: this }, "Sign up for Veteran Updates"), /*#__PURE__*/ React.createElement("form", { className: "flex flex-col gap-4 items-center", __source: { fileName: "", lineNumber: 10, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative w-full", __source: { fileName: "", lineNumber: 11, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "email", name: "email", placeholder: "Email", className: "bg-transparent border-none border-b-2 border-[#F3E3AC] text-[#F3E3AC] placeholder-[#726950] w-full focus:outline-none font-opensans", __source: { fileName: "", lineNumber: 12, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement(CallToActionButton, { href: "https://youtu.be/vgNMAbLgzI0", __source: { fileName: "", lineNumber: 14, columnNumber: 13 }, __self: this }, "Join Our Mailing List")), /*#__PURE__*/ React.createElement("p", { className: "text-[#726950] text-sm text-center mt-4 font-opensans", __source: { fileName: "", lineNumber: 16, columnNumber: 11 }, __self: this }, "By signing up, you agree to our Terms & Conditions and Privacy Policy."), /*#__PURE__*/ React.createElement("div", { className: "text-center mt-6", __source: { fileName: "", lineNumber: 17, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "https://youtu.be/vgNMAbLgzI0", className: "text-[#F3E3AC] font-opensans underline", __source: { fileName: "", lineNumber: 18, columnNumber: 13 }, __self: this }, "Click Here for Help"))), /*#__PURE__*/ React.createElement("div", { className: "w-full", __source: { fileName: "", lineNumber: 21, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "https://www.thoughtco.com/thmb/DOhm43FcqFjGCw3j_7IhZ60McFs=/1500x0/filters:no_upscale():max_bytes(150000):strip_icc():format(webp)/silhouette-of-soldiers-with-american-flag-186546665-5c7ac4ff46e0fb0001edc832.jpg", alt: "Silhouette of soldiers with American flag", className: "w-full h-full object-cover", __source: { fileName: "", lineNumber: 22, columnNumber: 11 }, __self: this })))); }