From 51ee97510fd5dc78bc671d9ba043722c3cf5c9b0 Mon Sep 17 00:00:00 2001
From: alexisben <alexiben7@gmail.com>
Date: Mon, 1 Aug 2022 10:42:53 +0200
Subject: [PATCH] pagination wip
---
.../sass/_theme/design-system/pagination.sass | 105 ++++++++++++++++++
assets/sass/_theme/hugo-osuny.sass | 1 +
2 files changed, 106 insertions(+)
create mode 100644 assets/sass/_theme/design-system/pagination.sass
diff --git a/assets/sass/_theme/design-system/pagination.sass b/assets/sass/_theme/design-system/pagination.sass
new file mode 100644
index 00000000..db5cbbff
--- /dev/null
+++ b/assets/sass/_theme/design-system/pagination.sass
@@ -0,0 +1,105 @@
+.pagination
+ // font-family: $font-family-sans-serif
+ font-size: px2rem(14)
+ justify-content: center
+ margin: #{$grid-gutter * 2.5} 0 0
+ li
+ // @extend .page-item
+ a
+ // @extend .page-link
+
+ .disabled
+ a::before
+ opacity: .3
+
+ &:not(&-between-pages)
+ li
+ &:first-child,
+ &:nth-child(2),
+ &:nth-last-child(2),
+ &:last-child
+ a
+ // @extend .icon
+ &:first-child
+ a
+ // @extend .icon-arrow-first
+ &:nth-child(2)
+ a
+ // @extend .icon-arrow-left
+ &:nth-last-child(2)
+ a
+ // @extend .icon-arrow-right
+ &:last-child
+ a
+ // @extend .icon-arrow-last
+ a::before
+ font-size: px2rem(12)
+
+ &-between-pages
+ justify-content: space-between
+ // margin-left: -$pagination-padding-x
+ // margin-right: -$pagination-padding-x
+ // margin-top: map-get($spacers, 5)
+ li
+ flex: 1
+
+ a
+ background-color: transparent
+ border: 0
+ &:hover
+ background-color: transparent
+ text-decoration: underline
+ span
+ text-decoration: none
+
+ span
+ // color: $gray-600
+
+ .previous
+ padding-left: 0
+ span
+ // @extend .icon
+ // @extend .icon-arrow-left
+ &::before
+ font-size: px2rem(12)
+ margin-right: px2rem(5)
+ .next
+ padding-right: 0
+ text-align: right
+ span
+ &::after
+ // @include icon
+ // content: map-get($icons, "arrow-right")
+ font-size: px2rem(12)
+ margin-left: px2rem(5)
+
+ @include media-breakpoint-down(md)
+ flex-direction: column-reverse
+ margin-left: 0
+ margin-right: 0
+ li.previous,
+ li.next
+ // border-top: 1px solid $gray-500
+ text-align: left
+ a
+ padding: px2rem(20) px2rem(40) px2rem(20) 0
+ &::after
+ @include icon
+ font-size: px2rem(12)
+ opacity: 0.5
+ position: absolute
+ right: 0
+ top: 50%
+ transform: translateY(-50%)
+ span
+ &::after,
+ &::before
+ content: none
+
+ li.previous
+ // border-bottom: 1px solid $gray-500
+ a::after
+ // content: map-get($icons, "arrow-left")
+ li.next
+ a::after
+ // content: map-get($icons, "arrow-right")
diff --git a/assets/sass/_theme/hugo-osuny.sass b/assets/sass/_theme/hugo-osuny.sass
index 4e96a464..5a0478d2 100644
--- a/assets/sass/_theme/hugo-osuny.sass
+++ b/assets/sass/_theme/hugo-osuny.sass
@@ -20,6 +20,7 @@
@import "design-system/grid"
@import "design-system/header"
@import "design-system/hero"
+@import "design-system/pagination"
@import "design-system/nav"
@import "design-system/table"
@import "design-system/table_of_content"
--
GitLab