Final homepage (agiresearch#253)

.gitattributes

@@ -2,4 +2,4 @@
 *.html linguist-vendored
 *.js linguist-vendored
 *.ts linguist-vendored
-*.tsx linguist-vendored
+*.tsx linguist-vendored

agenthub/app/globals.css

@@ -163,6 +163,10 @@ body {
   background-color: rgb(36,36,36);
 }
 
+.bg-getstarted {
+  background-color: rgb(64, 150, 219);
+}
+
 .border-strong {
   border-color: rgb(54,54,54);
 }

agenthub/app/layout.tsx

@@ -52,7 +52,7 @@ export const metadata: Metadata = {
     title: 'AIOS – The future of AI Agents',
     type: 'website',
     url: 'aiosfoundation',
-    images: 'https://aiosfoundation.org/assets/images/about/Agent.svg',
+    images: 'https://my.aios.foundation/Agent.svg',
   },
   description:
     'We’re on a journey to advance and democratize artificial intelligence through open source and open science.',

agenthub/app/page.tsx

@@ -19,10 +19,10 @@ const Index = () => {
   return (
     <div className='w-full h-full flex flex-col pt-12 bg-black text-white'>
        <Hero />
-      <Logos />
+      {/* <Logos /> */}
       <Products />
 
-      <TwitterSocialSection />
+      {/* <TwitterSocialSection /> */}
     </div>
 
 

agenthub/components/homepage/ExampleCard.tsx

@@ -106,7 +106,7 @@ function ExampleCard(props: any) {
                 //     </div>
                 //   }
                 >
-                  View Template
+                  Go!
                 </Button>
               )}
             </div>

agenthub/components/homepage/Hero.tsx

@@ -16,26 +16,26 @@ const Hero = () => {
               <div className="relative z-10 lg:h-auto pt-[90px] lg:pt-[90px] lg:min-h-[300px] flex flex-col items-center justify-center sm:mx-auto md:w-3/4 lg:mx-0 lg:w-full gap-4 lg:gap-8">
                 <div className="flex flex-col items-center">
                   <h1 className="text-foreground text-4xl sm:text-5xl sm:leading-none lg:text-7xl">
-                    <span className="text-7xl block text-foreground">Build in a weekend</span>
-                    <span className="text-7xl text-brand block md:ml-0 font-medium">Scale to billions</span>
+                    <span className="text-7xl block text-foreground">AIOS </span>
+                    <span className="text-5xl py-2 text-brand block md:ml-0 font-medium">LLM Agent Operating System</span>
                   </h1>
                   <p className="pt-2 text-foreground my-3 text-sm sm:mt-5 lg:mb-0 sm:text-base lg:text-lg">
-                    Supabase is an open source Firebase alternative.{' '}
-                    <br className="hidden md:block" />
-                    Start your project with a Postgres database, Authentication, instant APIs, Edge
-                    Functions, Realtime subscriptions, Storage, and Vector embeddings.
+                  The goal of AIOS is to build a large language model (LLM) agent operating system, which intends to embed large language model into the operating system as the brain of the OS. AIOS is designed to address problems (e.g., scheduling, context switch, memory management, etc.) during the development and deployment of LLM-based agents, for a better ecosystem among agent developers and users.
                   </p>
                 </div>
                 <div className="flex items-center gap-2">
 
-                  <Link as={Button} size="md" type="button" href="https://supabase.com/dashboard">
-                  Start your project
-                  </Link>
+                  {/* <Link as={Button} size="md" type="button" href="https://supabase.com/dashboard">
+                  Get Started
+                  </Link> */}
+                  <a className='relative justify-center cursor-pointer inline-flex items-center space-x-2 text-center font-regular ease-out duration-200 rounded-md outline-none transition-all outline-0 focus-visible:outline-4 focus-visible:outline-offset-1 border text-foreground bg-getstarted hover:bg-selection border-strong hover:border-stronger focus-visible:outline-brand-600 data-[state=open]:bg-selection data-[state=open]:outline-brand-600 data-[state=open]:border-button-hover text-sm px-4 py-2 h-[38px]'>
+                    Get Started
+                  </a>
                   {/* <Link as={Button} size="md" type="button" href="/contact/sales">
                     Request a demo
                   </Link> */}
                   <a className='relative justify-center cursor-pointer inline-flex items-center space-x-2 text-center font-regular ease-out duration-200 rounded-md outline-none transition-all outline-0 focus-visible:outline-4 focus-visible:outline-offset-1 border text-foreground bg-muted hover:bg-selection border-strong hover:border-stronger focus-visible:outline-brand-600 data-[state=open]:bg-selection data-[state=open]:outline-brand-600 data-[state=open]:border-button-hover text-sm px-4 py-2 h-[38px]'>
-                    Request a demo
+                    View On Github
                   </a>
                 </div>
               </div>

agenthub/components/homepage/Products.tsx

@@ -10,9 +10,9 @@ const Examples = [
       type: 'example',
       tags: ['Next.js', 'Stripe', 'Vercel'],
       products: [],
-      title: 'Stripe Subscriptions Starter',
+      title: 'Agent Hub',
       description:
-        'The all-in-one subscription starter kit for high-performance SaaS applications, powered by Stripe, Supabase, and Vercel.',
+        'View, download, or upload AIOS agents',
       author: 'Vercel',
       author_url: 'https://github.com/vercel',
       author_img: 'https://avatars.githubusercontent.com/u/14985020',
@@ -26,9 +26,9 @@ const Examples = [
       type: 'example',
       tags: ['Next.js', 'Vercel'],
       products: [],
-      title: 'Next.js Starter',
+      title: 'Agent Chat',
       description:
-        'A Next.js App Router template configured with cookie-based auth using Supabase, TypeScript and Tailwind CSS.',
+        'Use and converse with AIOS agents',
       author: 'Supabase',
       author_url: 'https://github.com/supabase',
       author_img: 'https://avatars.githubusercontent.com/u/54469796',
@@ -190,31 +190,17 @@ const BuiltWithSupabase = () => {
   return (
     <SectionContainer id="examples" className="xl:pt-32">
       <div className="text-center">
-        <h3 className="h2">Start building in seconds</h3>
-        <p className="p">
-          Kickstart your next project with templates built by us and our community.
-        </p>
-        <div className="flex justify-center gap-2 py-4">
-          {/* <Button asChild type="undefined" size="small" className="h-full">
-            <Link href="/docs/guides/examples">View all examples</Link>
-          </Button>
-          <Button
-            asChild
-            type="default"
-            // icon={<IconGitHubSolid size="tiny" className="!w-full !h-full" />}
-            size="small"
-          >
-            <Link href="https://github.com/supabase/supabase/tree/master/examples">
-              Official GitHub library
-            </Link>
-          </Button> */}
+        <div className=" text-5xl">Start building in seconds</div>
+        <div className="text-2xl pt-6">
+          Try out our many features
         </div>
+
       </div>
       <div className="mt-16 grid grid-cols-12 gap-5">
-        {Examples.slice(0, 6).map((example: any, i: number) => {
+        {Examples.slice(0, 2).map((example: any, i: number) => {
           return (
             <div
-              className={`col-span-12 lg:col-span-6 xl:col-span-4 ${i > 2 && `sm:hidden lg:block`}`}
+              className={`col-span-12 lg:col-span-6 xl:col-span-6 ${i > 2 && `sm:hidden lg:block`}`}
               key={i}
             >
               <ExampleCard {...example} showProducts />