Merge pull request #314 from v-jostruve/main

update Learn Live page

website/src/pages/Build-IA/LearnLive.js

@@ -17,6 +17,9 @@ function SectionHeader({title, description}) {
             </h1>
             <p> {description} </p>
             <div className={styles.buttons}>
+                <Link className="button button--primary button--lg mobile-block-buttons mobile-block-button-padding button-spacer" to="https://aka.ms/intelligent-apps/serverless-learnlive?ocid=buildia24_LL_website" target="_blank" data-bi-area="Hero" data-bi-name="Build Serverless">
+                    Build Serverless
+                </Link>
                 <Link className="button button--primary button--lg mobile-block-buttons mobile-block-button-padding button-spacer" to="https://aka.ms/intelligent-apps/aks-learnlive?ocid=buildia24_LL_website" target="_blank" data-bi-area="Hero" data-bi-name="Build Kubernetes">
                     Build Kubernetes
                 </Link>
@@ -31,6 +34,17 @@ function SectionContent(){
     return (
         <section className={styles.features}>
             <div className="container">
+                <div>
+                    <h2>Serverless</h2>
+                </div>
+                <div className="row" style={{ paddingBottom: '1rem' }}>
+                    {ContentItemsServerless.map((props, idx) => (
+                        <ContentItemServerless key={idx} {...props} />
+                    ))}
+                </div>
+                <div>
+                    <hr></hr>
+                </div>
                 <div>
                     <h2>Kubernetes</h2>
                 </div>
@@ -65,25 +79,22 @@ function ContentItemKubernetes({title, description, link, imglink, cta}){
     );
 }
 
-function ContentItemLearnLive({title, description, link, imglink, cta}){
+function ContentItemServerless({title, description, link, imglink, cta}){
     return (
         <div className={clsx('col col--6 card-col', styles.contentItem)}>
-            <div className="card">
-                <div className="card__image">
-                    <Image alt={"Thumbnail Image for"+title} img={useBaseUrl(imglink)}/>
-                </div>
-                <div className="card-body">
-                    <div className="text--center padding-horiz--md">
-                        <h3>{title}</h3>
-                        <p>{description}</p>
+            <Link className="card-link" to={link} target="_blank" data-bi-area="BodyGrid" data-bi-name={description}>
+                <div className="card">
+                    <div className="card__image">
+                        <Image alt={"Thumbnail Image for"+title} img={useBaseUrl(imglink)}/>
                     </div>
-                    <div className="card__footer">
-                        <Link className="button button--block button--secondary button--lg" to={link} target="_blank">
-                            {cta}
-                        </Link>
+                    <div className="card-body">
+                        <div className="text--left padding-horiz--md">
+                            <h2>{cta}</h2>
+                            <p>{description}</p>
+                        </div>
                     </div>
                 </div>
-            </div>
+            </Link>
         </div>
     );
 }
@@ -121,6 +132,38 @@ const ContentItemsKubernetes = [
   },
 ];
 
+const ContentItemsServerless = [
+
+    {
+      title: 'Deploying Intelligent Apps with OpenAI on Azure Kubernetes Service',
+      imglink: '/img/60-days-of-ia/serverless-learnlive-ep1.png',
+      link: "https://aka.ms/serverless-learn-live/ep1",
+      description: "Leverage Azure Developer CLI (azd) to deploy intelligent apps on ACA​.",
+      cta: "April 2, 2024"
+    },
+    {
+      title: 'Bring Your Own AI Models to Intelligent Apps on AKS with Kaito',
+      imglink: '/img/60-days-of-ia/serverless-learnlive-ep2.png',
+      link: "https://aka.ms/serverless-learn-live/ep2",
+      description: "Take your intelligent apps to production with ACA using Bicep and GitHub Actions.",
+      cta: "April 3, 2024"
+    },
+    {
+      title: 'Enhance Observability of Your Intelligent Apps on AKS',
+      imglink: '/img/60-days-of-ia/serverless-learnlive-ep3.png',
+      link: "https://aka.ms/serverless-learn-live/ep3",
+      description: "Learn how to build portable, intelligent cloud native apps with ACA and Dapr.",
+      cta: "April 10, 2024"
+    },
+    {
+      title: 'Taking Your Intelligent App Global with AKS',
+      imglink: '/img/60-days-of-ia/serverless-learnlive-ep4.png',
+      link: "https://aka.ms/serverless-learn-live/ep4",
+      description: "Leverage the power of Serverless on Azure and Azure OpenAI with .NET.",
+      cta: "April 17, 2024"
+    },
+];
+
 export default function LearnLive() {
     const {siteConfig} = useDocusaurusContext();
     const pageProps = {