feat(Components): Add pagination component

This component accept a Page<T> type from [astro](https://docs.astro.build/en/guides/routing/#complete-api-reference)
This commit is contained in:
Alexander Navarro 2024-03-19 20:43:04 -03:00
parent 642e15656e
commit 944b553e73
9 changed files with 258 additions and 83 deletions

View file

@ -1,17 +1,21 @@
---
import { getCollection } from "astro:content";
import { t, changeLanguage } from "i18next";
import Layout from "../layouts/Layout.astro";
import Card from "../components/Card.astro";
import Button from "../components/Button/Button.astro";
import { Image } from "astro:assets";
import portrait from "../assets/images/portrait.jpg";
import { getCollection } from 'astro:content';
import { t, changeLanguage } from 'i18next';
import Layout from '../layouts/Layout.astro';
import Card from '../components/Card.astro';
import Button from '../components/Button/Button.astro';
import { Image } from 'astro:assets';
import portrait from '../assets/images/portrait.jpg';
changeLanguage("en");
changeLanguage('en');
const blog = await getCollection("blog", ({ data }) => import.meta.env.PROD ? data.draft !== true : true);
const blog = await getCollection('blog', ({ data }) =>
import.meta.env.PROD ? data.draft !== true : true,
);
// TODO: show the pinned ones, not the recents
const portafolio = await getCollection("portafolio", ({ data }) => import.meta.env.PROD ? data.draft !== true : true);
const portafolio = await getCollection('portafolio', ({ data }) =>
import.meta.env.PROD ? data.draft !== true : true,
);
---
<Layout title="aleidk">
@ -49,8 +53,8 @@ const portafolio = await getCollection("portafolio", ({ data }) => import.meta.e
/>
<h3 class="fs-4 text-center my-1">Project N°1</h3>
<p class="text-justify">
cillum sint consectetur cupidatat.
Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint
cillum sint consectetur cupidatat. Lorem ipsum dolor sit amet, qui
minim labore adipisicing minim sint
</p>
<div class="text-end">
@ -94,7 +98,7 @@ const portafolio = await getCollection("portafolio", ({ data }) => import.meta.e
</div>
<div class="mt-4 text-center">
<Button className="px-4 py-2 fs-5 ">View Work</Button>
<Button className="px-4 py-2 fs-5" href="/projects">View Work</Button>
</div>
</section>