update home page

2026-06-18 16:32:31 +05:30
parent d9cc83aa82
commit 8e0d704438
57 changed files with 2813 additions and 301 deletions
--- a/components/shared/SocialIcons.tsx
+++ b/components/shared/SocialIcons.tsx
@@ -0,0 +1,67 @@
+import { type SocialLink } from "@/data/site-config";
+
+interface SocialIconsProps {
+  links: readonly SocialLink[] | SocialLink[];
+  className?: string;
+  iconClassName?: string;
+}
+
+/**
+ * Reusable social icon list.
+ * Used in: Footer, ContactFormSection.
+ */
+export function SocialIcons({
+  links,
+  className = "",
+  iconClassName = "",
+}: SocialIconsProps) {
+  return (
+    <div className={`flex items-center gap-4 ${className}`} role="list">
+      {links.map((link) => (
+        <a
+          key={link.platform}
+          href={link.url}
+          target="_blank"
+          rel="noopener noreferrer"
+          role="listitem"
+          aria-label={link.platform}
+          className={`flex h-10 w-10 items-center justify-center rounded-full border border-aiero-card-border text-aiero-text-muted transition-all duration-300 hover:border-aiero-teal hover:text-aiero-teal ${iconClassName}`}
+        >
+          <SocialSvg icon={link.icon} />
+        </a>
+      ))}
+    </div>
+  );
+}
+
+/** Inline SVG icons for each social platform */
+function SocialSvg({ icon }: { icon: SocialLink["icon"] }) {
+  const size = "h-4 w-4";
+
+  switch (icon) {
+    case "facebook":
+      return (
+        <svg className={size} viewBox="0 0 24 24" fill="currentColor">
+          <path d="M9.198 21.5h4v-8.01h3.604l.396-3.98h-4V7.5a1 1 0 0 1 1-1h3v-4h-3a5 5 0 0 0-5 5v2.01h-2l-.396 3.98h2.396v8.01Z" />
+        </svg>
+      );
+    case "x-twitter":
+      return (
+        <svg className={size} viewBox="0 0 24 24" fill="currentColor">
+          <path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231 5.45-6.231Zm-1.161 17.52h1.833L7.084 4.126H5.117L17.083 19.77Z" />
+        </svg>
+      );
+    case "linkedin":
+      return (
+        <svg className={size} viewBox="0 0 24 24" fill="currentColor">
+          <path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286ZM5.337 7.433a2.062 2.062 0 0 1-2.063-2.065 2.064 2.064 0 1 1 2.063 2.065Zm1.782 13.019H3.555V9h3.564v11.452ZM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003Z" />
+        </svg>
+      );
+    case "youtube":
+      return (
+        <svg className={size} viewBox="0 0 24 24" fill="currentColor">
+          <path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814ZM9.545 15.568V8.432L15.818 12l-6.273 3.568Z" />
+        </svg>
+      );
+  }
+}