add ui

ui/components/pager/pager.page.styl

@@ -0,0 +1,46 @@
+.pager
+  margin-bottom: rem(10px)
+  border-top: 2px solid $pager-border-color
+  text-align: center
+  font-size: rem($font-size-small)
+
+  &:empty
+    display: none
+
+  li
+    margin: 0
+    display: inline-block
+    margin-top: -2px
+
+.pager__item
+  display: inline-block
+  padding: rem(10px)
+  text-decoration: none
+  border: 0
+  border-top: 2px solid $pager-border-color
+  transition: border-top .2s linear, color .2s linear
+  color: #a7a7a7
+
+  &.link
+    &, .typo &
+      color: #a7a7a7
+
+    &:hover
+      border-color: $primary-color
+      text-decoration: none
+      &, .typo &
+        color: #666
+
+  &.current
+    color: $secondary-color
+    border-color: $secondary-color
+
++mobile()
+  .pager__item
+    &.ellipsis,
+    &.first,
+    &.previous,
+    &.next,
+    &.last
+      display: none
+