styles/elements/paginate.scss

3   display: -webkit-box;
4   display: -ms-flexbox;
6   -ms-flex-wrap: wrap;
7   flex-wrap: wrap;
8   -webkit-box-pack: center;
9   -ms-flex-pack: center;
10   justify-content: center;
11   -webkit-box-align: center;
12   -ms-flex-align: center;
13   align-items: center;
17 .pagination li { background-color: transparent; list-style-type: none; }
20   font-weight: 300;
21   padding-top: 1px;
22   text-decoration:none;
23   border: 1px solid $border-color-01;
24   border-left-width: 0;
25   min-width:44px;
26   min-height:44px;
27   color: $text-01;
30 .pagination li:not([class*="current"]) a:hover {
31   background-color: $primary-accent;
32   color: $primary-light;
35 .pagination li:not([class*="current"]) a:focus,
36 .pagination li:not([class*="current"]) a:active {
37   border-left-width:1px;
40 .pagination li:first-of-type a {
41   border-left-width: 1px;
44 .pagination li:first-of-type span,
45 .pagination li:last-of-type span,
46 .pagination li:nth-of-type(2) span,
47 .pagination li:nth-last-of-type(2) span {
50   top: -9999px;
51   left: -9999px;
54 .pagination li:first-child a::before,
55 .pagination li:last-child a::after,
56 .pagination li:nth-of-type(2) a::before,
57 .pagination li:nth-last-of-type(2) a::after {
58   display: inline-block;
59   text-rendering: auto;
60   font-size: 1.3em;
61   -webkit-font-smoothing: antialiased;
62   -moz-osx-font-smoothing: grayscale;
63   -webkit-transform: translate(0, 0);
67 .pagination li:first-child a::before,
70 .pagination li:nth-of-type(2) a::before,
73 .pagination li:first-child a::before,
74 .pagination li:nth-of-type(2) a::before { -webkit-transform: rotate(180deg); transform: rotate(180d…
76 .pagination li.current a, .pagination li.active a {
77   padding-top:.25em;
78   color: $primary-light;
79   background-color: $background-05;
81   pointer-events: none;
82   font-weight: 700;
85 @media only screen and ( max-width: 64.063em ) {
86   .pagination li:first-child,
87   .pagination li:last-child {
90     top: -9999px;
91     left: -9999px;
94   .pagination li:nth-of-type(2) a { border-left-width: 1px; }
98 @media only screen and ( max-width: 40.063em ) {
102     top: -9999px;
103     left: -9999px;
106   .pagination li.current,
107   .pagination li:first-of-type,
108   .pagination li:last-of-type,
109   .pagination li:nth-of-type(2),
110   .pagination li:nth-last-of-type(2){
116   .pagination li:nth-of-type(2) a { border-left-width: 0; }
120 @media only screen and ( max-width: 30.063em ) {
122   h1 { font-size: 1.35em !important; }
124   .pagination li:first-child,
125   .pagination li:last-child {
128     top: -9999px;
129     left: -9999px;
132   .pagination li:nth-of-type(2) a { border-left-width: 1px; }
136 @media only screen and ( max-width: 15.063em ) {  /* For watches? */
140   .pagination li.current {
141     -webkit-box-ordinal-group: 3;
142     -ms-flex-order: 2;
145     border-left-width: 1px;