diff options
| author | Valentin Popov <valentin@popov.link> | 2024-09-13 01:38:34 +0300 |
|---|---|---|
| committer | Valentin Popov <valentin@popov.link> | 2024-09-13 01:38:34 +0300 |
| commit | 65ee69c64569a65c5768a3ca7993153aafe21478 (patch) | |
| tree | aeb5568c7c0d4566f5151cbff8200ad6e86a2ddf /src/components/Pagination.astro | |
| parent | fd054f0fa494bfedf6fd8f9098a2a500be233afc (diff) | |
| download | popov.link-65ee69c64569a65c5768a3ca7993153aafe21478.tar.xz popov.link-65ee69c64569a65c5768a3ca7993153aafe21478.zip | |
Refactor Pagination component and add Next and Prev components
Diffstat (limited to 'src/components/Pagination.astro')
| -rw-r--r-- | src/components/Pagination.astro | 36 |
1 files changed, 7 insertions, 29 deletions
diff --git a/src/components/Pagination.astro b/src/components/Pagination.astro index e9fbc69..cc85db7 100644 --- a/src/components/Pagination.astro +++ b/src/components/Pagination.astro @@ -1,4 +1,7 @@ --- +import Next from "./Pagination/Next.astro"; +import Prev from "./Pagination/Prev.astro"; + type Props = { readonly prevUrl?: string; readonly nextUrl?: string; @@ -8,39 +11,14 @@ const { prevUrl, nextUrl } = Astro.props; --- <style lang="scss"> - .pagination { + div { overflow: hidden; padding: 3rem 0; width: 100%; } - - .prev, - .next { - max-width: 40%; - } - - .prev { - float: left; - } - - .next { - float: right; - } </style> -<div class="pagination"> - { - prevUrl && ( - <span class="prev"> - <a href={prevUrl}>< Prev</a> - </span> - ) - } - { - nextUrl && ( - <span class="next"> - <a href={nextUrl}>Next ></a> - </span> - ) - } +<div> + {prevUrl && <Prev url={prevUrl} />} + {nextUrl && <Next url={nextUrl} />} </div> |