finish
This commit is contained in:
@@ -2,6 +2,8 @@
|
||||
import { Icon } from "astro-icon/components";
|
||||
import Container from "../Container.astro";
|
||||
import BuyDropdown from "./BuyDropdown.astro";
|
||||
import Trends from "~/components/Trends.astro";
|
||||
import Search from "~/components/Search.astro";
|
||||
|
||||
import { getCollection } from "astro:content";
|
||||
const courses = await getCollection(
|
||||
@@ -12,8 +14,8 @@ const courses = await getCollection(
|
||||
const { title } = Astro.props;
|
||||
---
|
||||
|
||||
<nav class="sticky top-0 z-10 bg-lime-400 py-3 drop-shadow shadow-sm">
|
||||
<Container class="flex items-center relative">
|
||||
<nav class="sticky bg-lime-400 top-0 z-10 drop-shadow shadow-sm">
|
||||
<Container class="flex items-center relative py-3">
|
||||
<button
|
||||
data-toggle="menu"
|
||||
data-target="#heromenu"
|
||||
@@ -26,40 +28,37 @@ const { title } = Astro.props;
|
||||
</button>
|
||||
|
||||
<BuyDropdown class="ml-auto" {...Astro.props} />
|
||||
</Container>
|
||||
<dialog
|
||||
id="heromenu"
|
||||
class="absolute top-full translate-y-1 w-full bg-transparent max-lg:px-2.5"
|
||||
closedby="any"
|
||||
>
|
||||
<div class="text-black bg-lime-400 rounded-xl lg:rounded-2xl">
|
||||
<div class="lg:w-1/2 mx-auto p-5 lg:py-24">
|
||||
<search class="space-y-5">
|
||||
<label for="search" class="block">
|
||||
<h1
|
||||
class="text-pretty font-semibold text-3xl lg:text-4xl"
|
||||
>
|
||||
Digite o curso para ver todos detalhes
|
||||
</h1>
|
||||
</label>
|
||||
|
||||
<dialog
|
||||
id="heromenu"
|
||||
class="absolute text-black bg-lime-400 w-full inset-0 rounded-b-2xl h-fit overflow-hidden"
|
||||
closedby="any"
|
||||
>
|
||||
<Container class="relative overflow-auto h-100">
|
||||
<div class="sticky top-0 py-2.5 backdrop-blur-sm">
|
||||
<h6 class="font-medium text-xl lg:text-2xl">
|
||||
Conheça outros cursos da EDUSEG®
|
||||
</h6>
|
||||
<Search />
|
||||
</search>
|
||||
|
||||
<div class="space-y-1.5">
|
||||
<h2 class="font-bold text-xl flex gap-1">
|
||||
<Icon name="arrow-trending-up" class="size-6" />
|
||||
<span>Cursos mais procurados</span>
|
||||
</h2>
|
||||
|
||||
<Trends />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ul
|
||||
class="list-disc list-inside max-lg:[&_li]:truncate font-medium"
|
||||
>
|
||||
{
|
||||
courses.map(({ data: { title, slug } }) => {
|
||||
return (
|
||||
<li>
|
||||
<a
|
||||
href={`/${slug}`}
|
||||
class=" hover:underline p-0.5"
|
||||
>
|
||||
{title}
|
||||
</a>
|
||||
</li>
|
||||
);
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
</Container>
|
||||
</dialog>
|
||||
</dialog>
|
||||
</Container>
|
||||
</nav>
|
||||
|
||||
<script>
|
||||
|
||||
@@ -27,17 +27,13 @@ const bundlePath = `${import.meta.env.BASE_URL}pagefind/`;
|
||||
const bundlePath = selector.getAttribute("data-bundle-path");
|
||||
// Pagefind UI configuration options
|
||||
// https://pagefind.app/docs/ui/
|
||||
const search = new PagefindUI({
|
||||
new PagefindUI({
|
||||
element,
|
||||
bundlePath,
|
||||
autofocus: true,
|
||||
autofocus: false,
|
||||
showImages: false,
|
||||
pageSize: 5,
|
||||
});
|
||||
|
||||
console.log(search._pfs);
|
||||
// search._pfs.$$set({ trigger_search_term: "aa" })
|
||||
// console.log();
|
||||
}
|
||||
}
|
||||
|
||||
23
superpage/src/components/Trends.astro
Normal file
23
superpage/src/components/Trends.astro
Normal file
@@ -0,0 +1,23 @@
|
||||
---
|
||||
import { getEntries } from "astro:content";
|
||||
|
||||
const trends = await getEntries([
|
||||
{ collection: "courses", id: "nr-18-plataforma-de-trabalho-aereo" },
|
||||
{ collection: "courses", id: "nr-10-basico" },
|
||||
{ collection: "courses", id: "cipa-grau-de-risco-3" },
|
||||
{
|
||||
collection: "courses",
|
||||
id: "nr-35-seguranca-nos-trabalhos-em-altura-teorico",
|
||||
},
|
||||
]);
|
||||
---
|
||||
|
||||
<ul class="list-disc list-inside font-medium">
|
||||
{
|
||||
trends.map(({ data }) => (
|
||||
<li>
|
||||
<a href={data.slug}>{data.title}</a>
|
||||
</li>
|
||||
))
|
||||
}
|
||||
</ul>
|
||||
@@ -6,20 +6,10 @@ import Container from "~/components/Container.astro";
|
||||
import Clients from "~/components/Clients.astro";
|
||||
import Stats from "~/components/Stats.astro";
|
||||
import Features from "~/components/Features.astro";
|
||||
import Search from "./_components/Search.astro";
|
||||
import { getEntries } from "astro:content";
|
||||
import Trends from "~/components/Trends.astro";
|
||||
import Search from "~/components/Search.astro";
|
||||
|
||||
import mulhercomepi from "~/assets/mulher-com-epi.png";
|
||||
|
||||
const trends = await getEntries([
|
||||
{ collection: "courses", id: "nr-18-plataforma-de-trabalho-aereo" },
|
||||
{ collection: "courses", id: "nr-10-basico" },
|
||||
{ collection: "courses", id: "cipa-grau-de-risco-3" },
|
||||
{
|
||||
collection: "courses",
|
||||
id: "nr-35-seguranca-nos-trabalhos-em-altura-teorico",
|
||||
},
|
||||
]);
|
||||
---
|
||||
|
||||
<Layout title="Educação que garante sua segurança">
|
||||
@@ -49,15 +39,7 @@ const trends = await getEntries([
|
||||
<Icon name="arrow-trending-up" class="size-6" />
|
||||
<span>Cursos mais procurados</span>
|
||||
</h2>
|
||||
<ul class="list-disc list-inside font-medium">
|
||||
{
|
||||
trends.map(({ data }) => (
|
||||
<li>
|
||||
<a href={data.slug}>{data.title}</a>
|
||||
</li>
|
||||
))
|
||||
}
|
||||
</ul>
|
||||
<Trends />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -81,6 +63,16 @@ const trends = await getEntries([
|
||||
|
||||
<Container>
|
||||
<section class="mx-auto lg:w-2/3 space-y-6 py-5 lg:py-24">
|
||||
<h1 class="text-pretty text-3xl lg:text-5xl/14">
|
||||
<div>Conheça as vantagens de estar no</div>
|
||||
<span
|
||||
class="relative inline-block before:absolute before:inset-0 px-1 lg:px-5 lg:py-0.5 before:block before:-skew-x-16 before:bg-lime-400"
|
||||
>
|
||||
<span class="relative text-black font-medium uppercase">
|
||||
EDUSEG<sup>®</sup> Flexível
|
||||
</span>
|
||||
</span>
|
||||
</h1>
|
||||
<div
|
||||
class="grid lg:grid-cols-3 gap-2.5 lg:gap-5 *:border *:rounded-lg *:p-5 *:hover:scale-105 *:transition"
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user