feat: implement news layout components and context for improved structure and functionality

2025-02-22 17:34:25 +08:00
parent d9c36c5ff0
commit 77c9843267
11 changed files with 110 additions and 49 deletions
@@ -0,0 +1,60 @@
+import { Link } from 'react-router'
+
+import { Button } from '~/components/ui/button'
+import { APP } from '~/data/meta'
+
+export const FooterNewsletter = () => {
+  return (
+    <>
+      <div className="col-span-2 hidden gap-y-6 sm:grid">
+        <div className="h-[75px] bg-white p-3">
+          <Link
+            to="/news"
+            className="h-full"
+          >
+            <img
+              src={APP.logo}
+              alt={APP.title}
+              className="h-full w-auto"
+            />
+          </Link>
+        </div>
+
+        <h2 className="text-4xl font-bold">Join Our Newsletter</h2>
+        <p className="text-lg">
+          Tidak ingin ketinggalan Berita Hukum terhangat? ingin mendapat
+          informasi kajian dan networking terbaru? ikuti Newsletter kami and
+          Stay up to Speed!
+        </p>
+        <form className="grid gap-5">
+          <input
+            placeholder="Daftarkan Email Disini"
+            className="h-[50px] flex-1 bg-white text-center text-lg font-light text-black placeholder:text-[#777777] focus:ring-0 focus:outline-none"
+            size={1}
+          />
+          <Button
+            type="submit"
+            variant="newsPrimaryOutline"
+            size="block"
+          >
+            Subscribe
+          </Button>
+        </form>
+      </div>
+      <div className="block sm:hidden">
+        <div className="h-[60px] bg-white p-3">
+          <Link
+            to="/news"
+            className="h-full"
+          >
+            <img
+              src={APP.logo}
+              alt={APP.title}
+              className="h-full w-auto"
+            />
+          </Link>
+        </div>
+      </div>
+    </>
+  )
+}