add preview

Author: AdamKaniasty

public/images/social-preview.png

@@ -17,6 +17,32 @@ const lexendDeca = Lexend_Deca({
 export const metadata: Metadata = {
   title: "CCAI - Centre for Credible Artificial Intelligence",
   description: "We make AI understandable, verifiable, and controllable.",
+  metadataBase: process.env.NEXT_PUBLIC_SITE_URL
+    ? new URL(process.env.NEXT_PUBLIC_SITE_URL)
+    : undefined,
+  openGraph: {
+    title: "CCAI - Centre for Credible Artificial Intelligence",
+    description: "We make AI understandable, verifiable, and controllable.",
+    images: [
+      {
+        url: "/images/social-preview.png",
+        width: 1336,
+        height: 768,
+        alt: "Decode AI graphic",
+      },
+    ],
+  },
+  twitter: {
+    card: "summary_large_image",
+    title: "CCAI - Centre for Credible Artificial Intelligence",
+    description: "We make AI understandable, verifiable, and controllable.",
+    images: ["/images/social-preview.png"],
+  },
+  icons: {
+    icon: "/favicon.ico",
+    shortcut: "/favicon.ico",
+    apple: "/icon.png",
+  },
 };
 
 export default function RootLayout({

src/app/favicon.ico

@@ -50,9 +50,9 @@ export default function TeamMemberCard({ member }: TeamMemberProps) {
           {member.tags.map((tag, index) => (
             <div
               key={index}
-              className="bg-[#001f33] flex gap-[10px] items-center justify-center px-[5px] py-[3px] max-w-full"
+              className="bg-[#001f33] inline-flex gap-[10px] items-center justify-start px-[6px] py-[4px] max-w-[220px] w-auto min-w-0"
             >
-              <p className="font-mono text-sm font-normal leading-[1.1] text-white uppercase truncate">
+              <p className="font-mono text-sm font-normal leading-[1.1] text-white uppercase whitespace-normal break-words text-left min-w-0">
                 {tag}
               </p>
             </div>