pagination.less 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
  1. .load-more,
  2. .wp-pagenavi {
  3. clear: both;
  4. .products + & {
  5. margin-top: 0;
  6. }
  7. }
  8. .wp-pagenavi {
  9. border-top: 1px solid var( --vamtam-default-line-color );
  10. z-index: 100;
  11. position: relative;
  12. text-align: center;
  13. border: none;
  14. margin: 60px 0px;
  15. article > .page-content > section.portfolios > & {
  16. margin: 0 10px 30px;
  17. }
  18. a, span {
  19. display: inline-block;
  20. padding: 0 !important;
  21. font-size: 12px;
  22. border-radius: var( --vamtam-border-radius-oval );
  23. width: 46px;
  24. height: 46px;
  25. line-height: 46px;
  26. margin: 0px 6px 0px 6px !important;
  27. }
  28. .current {
  29. font-size: 12px;
  30. font-weight: normal !important;
  31. margin: 0px 0px 0px 5px !important;
  32. }
  33. a {
  34. transition: all 0.3s;
  35. border: solid 1px var( --vamtam-accent-color-7 );
  36. &.next,
  37. &.prev {
  38. width: auto;
  39. padding: 0px 15px !important;
  40. border-color: transparent;
  41. }
  42. }
  43. a:hover,
  44. .current {
  45. background-color: var( --vamtam-accent-color-1 );
  46. border: solid 1px var( --vamtam-accent-color-1 );
  47. color: var( --vamtam-accent-color--hc );
  48. }
  49. .previouspostslink,
  50. .nextpostslink {
  51. color: transparent !important;
  52. background: var( --vamtam-accent-color-5 );
  53. width: 23px;
  54. height: 23px;
  55. text-align: center;
  56. line-height: 23px;
  57. padding: 0 !important;
  58. &:after {
  59. color: var( --vamtam-body-link-regular );
  60. font-size: 11px;
  61. font-family: theme;
  62. left: -2px;
  63. position: relative;
  64. font-weight: normal !important;
  65. &:hover {
  66. color: var( --vamtam-body-link-hover );
  67. }
  68. }
  69. }
  70. .previouspostslink:after {
  71. content: icon( vamtam-theme-angle-left);
  72. }
  73. .nextpostslink:after {
  74. content: icon( vamtam-theme-angle-right);
  75. }
  76. span.pages {
  77. display: none;
  78. }
  79. a.page {
  80. background: var( --vamtam-accent-color-5 );
  81. color:var( --vamtam-body-link-regular );
  82. font-size: 12px;
  83. &:hover {
  84. color:var( --vamtam-body-link-hover );
  85. }
  86. &:visited {
  87. color:var( --vamtam-body-link-visited );
  88. }
  89. }
  90. a,
  91. span,
  92. span.pages,
  93. .current {
  94. font-size: 1.2em;
  95. }
  96. }
  97. .comment-paging {
  98. border-top: 0;
  99. margin: 10px 0;
  100. padding-top: 0;
  101. a, span {
  102. margin: 1px !important;
  103. border: none !important;
  104. display: inline-block;
  105. padding: 2px 8px 3px 8px !important;
  106. font-size: 12px;
  107. }
  108. .current {
  109. font-size: 12px;
  110. font-weight: normal !important;
  111. }
  112. .prev,
  113. .next {
  114. color: transparent !important;
  115. background: var( --vamtam-accent-color-5 );
  116. width: 23px;
  117. height: 23px;
  118. text-align: center;
  119. line-height: 22px;
  120. padding: 0 !important;
  121. text-indent: -200px;
  122. &:after {
  123. color:var( --vamtam-body-link-regular );
  124. font-size: 12px;
  125. font-family: theme;
  126. position: relative;
  127. font-weight: normal !important;
  128. &:hover {
  129. color: var( --vamtam-body-link-hover );
  130. }
  131. }
  132. }
  133. .prev {
  134. &:after {
  135. content: icon( vamtam-theme-angle-left);
  136. left: 70px;
  137. }
  138. }
  139. .next {
  140. &:after {
  141. content: icon( vamtam-theme-angle-right);
  142. left: 83px;
  143. }
  144. }
  145. span.pages {
  146. float: left;
  147. .vamtam-font(primary-font-);
  148. padding: 0 !important;
  149. }
  150. a.page-numbers {
  151. background: var( --vamtam-accent-color-5 );
  152. color:var( --vamtam-body-link-regular );
  153. font-size: 12px;
  154. &:hover {
  155. color:var( --vamtam-body-link-hover );
  156. }
  157. &:visited {
  158. color:var( --vamtam-body-link-visited );
  159. }
  160. }
  161. }
  162. .load-more {
  163. margin: 60px auto 30px auto;
  164. position: relative;
  165. text-align: center;
  166. .vamtam-button {
  167. .button-gen-solid();
  168. .button-gen( '--vamtam-accent-color-1' );
  169. .button-gen-hover( '--vamtam-accent-color-6' );
  170. }
  171. &.loading {
  172. background: var( --vamtam-loading-animation ) center center no-repeat;
  173. background-size: contain;
  174. }
  175. }