branding

bsahane · Jan 24, 2025 · 75c5337 · 75c5337
1 parent 5de87da
commit 75c5337
Show file tree

Hide file tree

Showing 3 changed files with 41 additions and 2 deletions.
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -23,7 +23,13 @@ export const metadata: Metadata = {
   title: "Open Operator",
   description: "Watch AI browse the web, for free",
   openGraph: {
-    images: ['/og.png'],
+    images: ["/og.png"],
+  },
+  icons: {
+    icon: [
+      { url: "/favicon.svg", type: "image/svg+xml" },
+      { url: "/favicon.ico" },
+    ],
   },
 };
 
@@ -34,6 +40,11 @@ export default function RootLayout({
 }) {
   return (
     <html lang="en">
+      <head>
+        <link rel="icon" href="/favicon.svg" type="image/svg+xml" />
+        {/* Fallback for browsers that don't support SVG favicons */}
+        <link rel="alternate icon" href="/favicon.ico" />
+      </head>
       <body
         className={`${inter.variable} ${ppNeue.variable} ${ppSupply.variable} font-sans antialiased bg-white text-gray-900`}
       >

diff --git a/app/page.tsx b/app/page.tsx
@@ -4,6 +4,7 @@ import { useState, useEffect, useCallback } from "react";
 import { AnimatePresence } from "framer-motion";
 import ChatFeed from "./components/ChatFeed";
 import AnimatedButton from "./components/AnimatedButton";
+import Image from "next/image";
 
 export default function Home() {
   const [isChatVisible, setIsChatVisible] = useState(false);
@@ -57,6 +58,13 @@ export default function Home() {
           {/* Top Navigation */}
           <nav className="flex justify-between items-center px-8 py-4 bg-white border-b border-gray-200">
             <div className="flex items-center gap-2">
+              <Image
+                src="/favicon.svg"
+                alt="Open Operator"
+                className="w-8 h-8"
+                width={32}
+                height={32}
+              />
               <span className="font-ppneue text-gray-900">Open Operator</span>
             </div>
           </nav>
@@ -78,7 +86,24 @@ export default function Home() {
                     Open Operator
                   </h1>
                   <p className="text-base font-ppsupply text-gray-500">
-                    Hit run to watch AI browse the web
+                    Hit run to watch AI browse the web.
+                  </p>
+                  <p className="text-base font-ppsupply">
+                    Powered by{" "}
+                    <a
+                      href="https://stagehand.dev"
+                      className="text-yellow-600 hover:underline"
+                    >
+                      Stagehand
+                    </a>{" "}
+                    on{" "}
+                    <a
+                      href="https://browserbase.com"
+                      className="text-[#FF3B00] hover:underline"
+                    >
+                      Browserbase
+                    </a>
+                    .
                   </p>
                 </div>
 

diff --git a/public/favicon.svg b/public/favicon.svg