This commit is contained in:
2025-04-25 10:01:49 -03:00
parent 1c235b41ba
commit 0c96fe4196
17 changed files with 438 additions and 364 deletions

View File

@@ -1,22 +1,11 @@
---
import { getCollection, render } from "astro:content";
import { Picture } from "astro:assets";
import { Icon } from "astro-icon/components";
import Layout from "~/layouts/CourseLayout.astro";
import Layout from "~/layouts/Layout.astro";
import Container from "~/components/Container.astro";
import Carousel from "~/components/Carousel.astro";
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 Contact from "./_components/Contact.jsx";
import placeholder from "./_assets/placeholder.png";
import mulherdenegocios from "./_assets/mulher-de-negocios.png";
import homemdenegocios from "./_assets/homem-de-negocios.png";
import { getCollection, getEntry, render } from "astro:content";
import placeholder from "~/assets/placeholder.png";
export async function getStaticPaths() {
const courses = await getCollection(
@@ -35,15 +24,11 @@ export async function getStaticPaths() {
const { course } = Astro.props;
const { data } = course;
const { Content } = await render(course);
const trainer = data.course?.trainer
? await getEntry(data.course?.trainer)
: null;
---
<Layout>
<Fragment slot="head">
<title>{data.title}</title>
<title>{data.title} &mdash; EDUSEG&reg;</title>
</Fragment>
<section class="space-y-6 lg:space-y-24">
@@ -158,202 +143,6 @@ const trainer = data.course?.trainer
</section>
</Container>
<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>
<div class="bg-white/10 py-12 lg:py-24">
<Container class="flex justify-between lg:w-6/12">
<ul class="space-y-2.5">
<li class="text-5xl">+ 100k</li>
<li class="uppercase font-bold text-white/50">
Profissionais capacitados
</li>
</ul>
<ul class="space-y-2.5">
<li class="text-5xl">+ 5k</li>
<li class="uppercase font-bold text-white/50">
Empresas atendidas
</li>
</ul>
<ul class="space-y-2.5">
<li class="text-5xl">12 anos</li>
<li class="uppercase font-bold text-white/50">
de experiência
</li>
</ul>
</Container>
</div>
<Container>
<div class="border border-lime-400 rounded-2xl lg:grid grid-cols-3">
<div
class="bg-linear-to-tr from-lime-400/50 to-lime-300 rounded-2xl p-5 relative h-136 max-lg:hidden -m-px max-xl:overflow-hidden"
>
<Picture
alt="Homem de negócios"
formats={["webp"]}
src={homemdenegocios}
class="w-94 absolute bottom-0 -left-28"
/>
<Picture
alt="Mulher de negócios"
formats={["webp"]}
src={mulherdenegocios}
class="w-96 absolute bottom-0 -right-24"
/>
</div>
<div class="col-span-2 flex items-center">
<div class="xl:w-8/12 xl:mx-auto space-y-5 p-6">
<h3 class="text-pretty text-4xl font-semibold">
Por que capacitar sua equipe com a EDUSEG&reg;
</h3>
<p>
Nós cuidamos da burocracia, oferecemos uma
plataforma completa para simplicar a gestão e
capacitação em larga escala de seus colaboradores.
Com a EDUSEG&reg, sua empresa se beneficia de uma
tecnologia eficiente e confiável.
</p>
<ul class="grid md:grid-cols-2 gap-1 lg:gap-2.5">
<li class="bg-white/10 p-2.5 lg:p-5 rounded-lg">
Centralização de todos os certificados
</li>
<li class="bg-white/10 p-2.5 lg:p-5 rounded-lg">
Agilidade na liberação de cursos
</li>
<li class="bg-white/10 p-2.5 lg:p-5 rounded-lg">
Agendamento para liberação de cursos
</li>
<li class="bg-white/10 p-2.5 lg:p-5 rounded-lg">
Aviso de vencimento para certificados
</li>
</ul>
<div class="text-center">
<a
href="#contato"
class="text-blue-400 underline hover:no-underline"
>
Agendar uma demonstração
</a>
</div>
</div>
</div>
</div>
</Container>
<!-- Course Modules -->
<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">
O curso é dividido em módulos para facilitar seu aprendizado
e garantir que você domine todos os aspectos teóricos e
práticos.
</p>
</div>
<div class="lg:col-span-2 flex flex-col gap-1.5">
<Content />
</div>
</Container>
<!-- Course Modules End -->
<!-- Cert -->
<Container id="certificado">
<div
class="text-black bg-linear-to-t from-lime-600 to-lime-400 border border-lime-400 p-5 lg:py-36 rounded-2xl relative overflow-hidden"
>
<Icon
name="lock-closed"
class="size-96 absolute -right-16 -bottom-16 text-black/10 max-lg:hidden"
/>
<div class="lg:w-8/12 2xl:w-6/14 mx-auto space-y-5">
<h5 class="text-4xl lg:text-6xl/14 lg:font-black">
Certificados digitais com respaldo legal e gestão
completa
</h5>
<ul class="lg:text-lg list-disc list-inside">
<li>
Certificado com assinatura digital conforme o padrão
ICP-Brasil
</li>
<li>Tudo digital e salvo para sempre na núvem</li>
<li>Alertas automáticos de vencimento</li>
</ul>
</div>
</div>
</Container>
<!-- Cert End -->
<!-- Trainer -->
{
trainer && (
<Container>
<div class="bg-white/10 rounded-2xl p-5 xl:py-32">
<div class="lg:w-8/12 flex max-lg:flex-col gap-5 mx-auto">
<div class="shrink-0">
<Picture
src={trainer.data.image}
alt={trainer.data.name}
formats={["webp"]}
class="rounded-xl size-32 outline-2 outline-offset-2 outline-lime-400"
/>
</div>
<div class="space-y-2.5">
<h6 class="text-xl text-pretty">
Quem é o(a) instrutor(a)?
</h6>
<p class="text-4xl lg:text-5xl text-pretty">
{trainer.data.name}
</p>
<div
class="text-sm/6 text-white/70 space-y-2.5"
set:html={trainer?.rendered?.html}
/>
<div class="flex">
{trainer.data.networks.map(
({ url, alt }) => {
return (
<a
href={url}
target="_blank"
aria-labelledby={alt}
>
<Icon
name={alt.toLowerCase()}
class="fill-white/70 size-5"
/>
</a>
);
},
)}
</div>
</div>
</div>
</div>
</Container>
)
}
<!-- Trainer End -->
<!-- Contact Form -->
<Container id="contato">
<Contact client:load />
</Container>
<!-- Contact Form End -->
<Content />
</section>
</Layout>