upheader added new things

components/layout/upHeader.tsx

@@ -0,0 +1,36 @@
+import { Mail, Phone, Send } from "lucide-react";
+
+const downloadCatalog = () => {
+  const link = document.createElement("a");
+  link.href = "/catalog.pdf";
+  link.download = "catalog.pdf";
+  document.body.appendChild(link);
+  link.click();
+  document.body.removeChild(link);
+};
+
+export default function UpHeader() {
+  return (
+    <div className="w-full border-b border-gray-400/50">
+      <div className="max-w-7xl mx-auto py-2 px-4 sm:px-6 lg:px-8 flex justify-between items-center">
+        <div className="flex items-center gap-4">
+          <a>
+            <Mail />
+          </a>
+          <a>
+            <Phone />
+          </a>
+          <a>
+            <Send />
+          </a>
+        </div>
+        <button
+          onClick={downloadCatalog}
+          className="py-1 px-4 hover:bg-red-700 hover:cursor-pointer hover:border-red-700 text-white font-medium border border-white rounded-md transition"
+        >
+          Download Catalog
+        </button>
+      </div>
+    </div>
+  );
+}