add icon

superpage/src/pages/[slug].astro

@@ -1,16 +1,20 @@
 ---
 import { Picture } from 'astro:assets'
-import { Container } from '~/components/Container'
 import { Faq } from '~/components/Faq'
 import { StarIcon, ClockIcon } from '@heroicons/react/24/outline'
 import { CheckBadgeIcon, LockClosedIcon } from '@heroicons/react/24/solid'
-import { LinkedInIcon } from '~/components/LinkedInIcon'
+import { Icon } from 'astro-icon/components'
 import Layout from '~/layouts/Layout.astro'
-import ClientsLogo from '~/components/ClientsLogo.astro'
-import { Form } from '~/components/Form'
+import Container from '~/components/Container.astro'
+import Carousel from '~/components/Carousel.astro'
 import placeholder from '~/assets/placeholder.png'
 import mulherdenegocios from '~/assets/mulher-de-negocios.png'
 import homemdenegocios from '~/assets/homem-de-negocios.png'
+import Kordsa from '~/components/logos/Kordsa.astro'
+import Semeq from '~/components/logos/Semeq.astro'
+import Natura from '~/components/logos/Natura.astro'
+import Nissan from '~/components/logos/Nissan.astro'
+import Manserv from '~/components/logos/Manserv.astro'
 
 import { getCollection, getEntry } from 'astro:content'
 
@@ -32,9 +36,13 @@ const {
 const trainer = data.course?.trainer ? await getEntry(data.course?.trainer) : null
 ---
 
-<Layout title={data.title}>
+<Fragment slot="head">
+  <title>{data.title}</title>
+</Fragment>
+
+<Layout>
   <div class="space-y-6 lg:space-y-24">
-    <Container className="lg:flex items-center justify-start gap-6 max-lg:pt-6">
+    <Container class="lg:flex items-center justify-start gap-6 max-lg:pt-6">
       <Picture
         src={data?.img ? data.img : placeholder}
         alt={data.title}
@@ -109,7 +117,10 @@ const trainer = data.course?.trainer ? await getEntry(data.course?.trainer) : nu
       </section>
     </Container>
 
-    <ClientsLogo />
+    <Container class="lg:text-center space-y-2.5 lg:space-y-6">
+      <h2 class="text-pretty font-semibold text-4xl">Alguns clientes que acreditam em nós</h2>
+      <Carousel items={[Natura, Kordsa, Semeq, Nissan, Manserv]} />
+    </Container>
 
     <Container>
       <div class="border border-lime-400 rounded-2xl lg:grid grid-cols-3">
@@ -154,7 +165,7 @@ const trainer = data.course?.trainer ? await getEntry(data.course?.trainer) : nu
       </div>
     </Container>
 
-    <Container id="modulos" className="grid gap-2.5 lg:grid-cols-3 lg:gap-5 2xl:w-3/6">
+    <Container id="modulos" class="grid gap-2.5 lg:grid-cols-3 lg:gap-5 2xl:w-3/6">
       <div class="space-y-2.5">
         <h4 class="text-pretty text-4xl lg:text-5xl">Módulos deste curso</h4>
         <p class="text-base/6">
@@ -174,7 +185,7 @@ const trainer = data.course?.trainer ? await getEntry(data.course?.trainer) : nu
             <div class="lg:w-8/12 flex max-lg:flex-col gap-5 mx-auto">
               <div class="shrink-0">
                 <Picture
-                  src={trainer.data.img}
+                  src={trainer.data.image}
                   alt={trainer.data.name}
                   formats={['webp']}
                   class="rounded-xl size-32 outline-2 outline-offset-2 outline-lime-400"
@@ -194,7 +205,7 @@ const trainer = data.course?.trainer ? await getEntry(data.course?.trainer) : nu
                     target="_blank"
                     aria-label="LinkedIn"
                   >
-                    <LinkedInIcon className="fill-white/70 w-6" />
+                    <Icon name="LinkedIn" class="fill-white/70 size-5" />
                   </a>
                 </div>
               </div>
@@ -223,6 +234,6 @@ const trainer = data.course?.trainer ? await getEntry(data.course?.trainer) : nu
       </div>
     </Container>
 
-    <Form client:load />
+    <!-- <Form client:load /> -->
   </div>
 </Layout>

superpage/src/pages/blog/[slug].astro

@@ -15,7 +15,9 @@ export async function getStaticPaths() {
 const { post } = Astro.props
 ---
 
-<Layout title={post.title.rendered}>
+<title slot="head">{post.title.rendered}</title>
+
+<Layout>
   <Container>
     <article>
       <h1 set:html={post.title.rendered} />