restores newsletter. contact-us points to email

Vizzuality · Oct 8, 2024 · 7e4667e · 7e4667e
1 parent 3f51443
commit 7e4667e
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 42 deletions.
diff --git a/src/app/(static)/layout.tsx b/src/app/(static)/layout.tsx
@@ -1,11 +1,13 @@
 import { PropsWithChildren } from 'react';
 
 import Footer from '@/containers/footer';
+import Newsletter from '@/containers/newsletter';
 
 export default function StaticPageLayout({ children }: Readonly<PropsWithChildren>) {
   return (
     <main>
       {children}
+      <Newsletter />
       <Footer />
     </main>
   );

diff --git a/src/components/app-menu/content.tsx b/src/components/app-menu/content.tsx
@@ -11,19 +11,10 @@ import { cn } from '@/lib/utils';
 import { menuOpenAtom } from '@/app/store';
 
 import { SECTIONS } from '@/containers/header';
-import Newsletter from '@/containers/newsletter';
-
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-  DialogTrigger,
-} from '@/components/ui/dialog';
 
 const navItemContainerClass =
   'hover:text-navy-500 relative inline-flex items-center space-x-6 text-xl text-grey-800 2xl:text-4xl' as const;
-const NavItem = (props: PropsWithChildren<LinkProps & { isDialogButton?: boolean }>) => {
+const NavItem = (props: PropsWithChildren<LinkProps>) => {
   const setOpen = useSetAtom(menuOpenAtom);
   const Text = (
     <>
@@ -32,32 +23,6 @@ const NavItem = (props: PropsWithChildren<LinkProps & { isDialogButton?: boolean
     </>
   );
 
-  if (props.isDialogButton) {
-    return (
-      <Dialog>
-        <DialogTrigger asChild>
-          <button
-            type="button"
-            className={navItemContainerClass}
-            onClick={() => {
-              setOpen(false);
-            }}
-          >
-            {Text}
-          </button>
-        </DialogTrigger>
-        <DialogContent className="bg-white pt-8 text-grey-800" aria-describedby={undefined}>
-          <DialogHeader>
-            <DialogTitle className="pr-2 text-xl font-bold text-grey-800 md:text-2xl">
-              Interested in our work?
-            </DialogTitle>
-          </DialogHeader>
-          <Newsletter />
-        </DialogContent>
-      </Dialog>
-    );
-  }
-
   return (
     <Link
       href={props.href}
@@ -131,9 +96,7 @@ export const Nav = () => {
           <ul className="flex flex-col gap-5 lg:gap-8">
             {SECTIONS.map((item) => (
               <li key={item.href} className="text-right">
-                <NavItem href={item.href} isDialogButton={item.href === '#contact-us'}>
-                  {item.name}
-                </NavItem>
+                <NavItem href={item.href}>{item.name}</NavItem>
               </li>
             ))}
           </ul>

diff --git a/src/containers/header/index.tsx b/src/containers/header/index.tsx
@@ -14,7 +14,7 @@ export const SECTIONS = [
   { name: 'About', href: '/about' },
   { name: 'Cases', href: '/cases' },
   { name: 'Events & News', href: '/events-news' },
-  { name: 'Contact us', href: '#contact-us' },
+  { name: 'Contact us', href: 'mailto:[email protected]' },
 ] as const;
 
 export default function Header({

diff --git a/src/containers/newsletter/index.tsx b/src/containers/newsletter/index.tsx
@@ -120,9 +120,16 @@ export default function Newsletter() {
   );
 
   return (
-    <div className="container space-y-14 p-0">
+    <div className="container space-y-14 py-10 md:py-16">
+      <h2 className="text-xl font-bold text-grey-800 md:text-2xl">
+        Interested in environmental conservation?
+      </h2>
       <Form {...form}>
-        <form ref={formRef} className="space-y-8" onSubmit={handleNewsletter}>
+        <form
+          ref={formRef}
+          className="space-y-8 md:grid md:grid-cols-12 md:gap-[5%] md:space-y-0"
+          onSubmit={handleNewsletter}
+        >
           <div className="flex w-full flex-col justify-between space-y-8 md:col-span-6">
             <FormField
               control={form.control}