diff options
Diffstat (limited to 'src/components/Pagination/Pagination.module.scss')
| -rw-r--r-- | src/components/Pagination/Pagination.module.scss | 92 |
1 files changed, 0 insertions, 92 deletions
diff --git a/src/components/Pagination/Pagination.module.scss b/src/components/Pagination/Pagination.module.scss deleted file mode 100644 index 4d74d1b..0000000 --- a/src/components/Pagination/Pagination.module.scss +++ /dev/null @@ -1,92 +0,0 @@ -@use "@styles/abstracts/functions" as fun; -@use "@styles/abstracts/mixins" as mix; -@use "@styles/abstracts/placeholders"; - -.list { - @extend %flex-list; - justify-content: center; - - row-gap: var(--spacing-sm); -} - -.link { - display: block; - padding: var(--spacing-xs) var(--spacing-sm); - background: var(--color-bg); - border: fun.convert-px(2) solid var(--color-primary); - box-shadow: fun.convert-px(2) fun.convert-px(2) 0 0 - var(--color-primary-darker); - font-weight: 600; - text-decoration: none; - - @include mix.pointer("fine") { - padding: var(--spacing-2xs) var(--spacing-xs); - } - - &--current { - padding: calc(var(--spacing-xs) / 1.5) var(--spacing-sm); - border-color: var(--color-primary-darker); - box-shadow: none; - color: var(--color-primary-darker); - transform: translateY(#{fun.convert-px(10)}); - - @include mix.pointer("fine") { - padding: calc(var(--spacing-2xs) / 1.5) var(--spacing-xs); - transform: translateY(#{fun.convert-px(7)}); - } - } - - &:not(.link--current) { - &:hover, - &:focus { - border-color: var(--color-primary-light); - box-shadow: fun.convert-px(2) fun.convert-px(2) 0 0 - var(--color-primary-darker), - 0 fun.convert-px(2) fun.convert-px(2) fun.convert-px(1) - var(--color-shadow-dark), - 0 fun.convert-px(7) fun.convert-px(7) fun.convert-px(2) - var(--color-shadow-light); - color: var(--color-primary-light); - transform: translateY(#{fun.convert-px(-5)}); - } - - &:active { - padding: calc(var(--spacing-xs) / 1.5) var(--spacing-sm); - border-color: var(--color-primary-dark); - box-shadow: none; - color: var(--color-primary-dark); - transform: translateY(#{fun.convert-px(10)}); - - @include mix.pointer("fine") { - padding: calc(var(--spacing-2xs) / 1.5) var(--spacing-xs); - transform: translateY(#{fun.convert-px(7)}); - } - } - } -} - -.item { - position: relative; - - &:first-child { - .link { - border-top-left-radius: fun.convert-px(4); - border-bottom-left-radius: fun.convert-px(4); - } - } - - &:last-child { - .link { - border-top-right-radius: fun.convert-px(4); - border-bottom-right-radius: fun.convert-px(4); - } - } - - &:not(:first-child) { - margin-left: fun.convert-px(-1); - } - - &:not(:last-child) { - margin-right: fun.convert-px(-1); - } -} |
