You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

86 lines
1.3 KiB

4 years ago
  1. .pagination {
  2. margin-top: 50px;
  3. @media print {
  4. display: none;
  5. }
  6. &__title {
  7. display: flex;
  8. text-align: center;
  9. position: relative;
  10. margin: 100px 0 20px;
  11. &-h {
  12. text-align: center;
  13. margin: 0 auto;
  14. padding: 5px 10px;
  15. background: color-mod(var(--accent) blend(#1D1E28 98%));
  16. font-size: .8rem;
  17. text-transform: uppercase;
  18. text-decoration: none;
  19. letter-spacing: .1em;
  20. z-index: 1;
  21. }
  22. hr {
  23. position: absolute;
  24. left: 0;
  25. right: 0;
  26. width: 100%;
  27. margin-top: 15px;
  28. z-index: 0;
  29. }
  30. }
  31. &__buttons {
  32. display: flex;
  33. align-items: center;
  34. justify-content: center;
  35. a {
  36. text-decoration: none;
  37. }
  38. }
  39. }
  40. .button {
  41. position: relative;
  42. display: inline-flex;
  43. flex: 1;
  44. align-items: center;
  45. justify-content: center;
  46. font-size: 1rem;
  47. border-radius: 8px;
  48. padding: 0;
  49. cursor: pointer;
  50. appearance: none;
  51. overflow: hidden;
  52. + .button {
  53. margin-left: 10px;
  54. }
  55. a {
  56. display: flex;
  57. padding: 8px 16px;
  58. text-decoration: none;
  59. text-overflow: ellipsis;
  60. white-space: nowrap;
  61. overflow: hidden;
  62. }
  63. &__text {
  64. text-overflow: ellipsis;
  65. white-space: nowrap;
  66. overflow: hidden;
  67. }
  68. &.next .button__icon {
  69. margin-left: 8px;
  70. }
  71. &.previous .button__icon {
  72. margin-right: 8px;
  73. }
  74. }