Fix pagination

docs/css/bulma-docs.css

@@ -4035,60 +4035,195 @@ a.nav-item.is-tab.is-active {
   }
 }
 
-.pagination {
+.pagination,
+.pagination-list {
   align-items: center;
   display: flex;
   justify-content: center;
   text-align: center;
 }
 
-.pagination a {
-  display: block;
-  min-width: 32px;
-  padding: 3px 8px;
-}
-
-.pagination span {
-  color: #7a7a7a;
-  display: block;
-  margin: 0 4px;
-}
-
-.pagination li {
-  margin: 0 2px;
-}
-
-.pagination ul {
+.pagination-previous,
+.pagination-next,
+.pagination-link,
+.pagination-ellipsis {
+  -moz-appearance: none;
+  -webkit-appearance: none;
   align-items: center;
-  display: flex;
-  flex-grow: 1;
-  flex-shrink: 0;
+  border: none;
+  border-radius: 3px;
+  box-shadow: none;
+  display: inline-flex;
+  font-size: 1rem;
+  height: 2.5em;
+  justify-content: flex-start;
+  line-height: 1.5;
+  padding-left: 0.75em;
+  padding-right: 0.75em;
+  position: relative;
+  vertical-align: top;
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  font-size: 0.875rem;
+  padding-left: 0.5em;
+  padding-right: 0.5em;
   justify-content: center;
+  text-align: center;
+}
+
+.pagination-previous:focus, .pagination-previous.is-focused, .pagination-previous:active, .pagination-previous.is-active,
+.pagination-next:focus,
+.pagination-next.is-focused,
+.pagination-next:active,
+.pagination-next.is-active,
+.pagination-link:focus,
+.pagination-link.is-focused,
+.pagination-link:active,
+.pagination-link.is-active,
+.pagination-ellipsis:focus,
+.pagination-ellipsis.is-focused,
+.pagination-ellipsis:active,
+.pagination-ellipsis.is-active {
+  outline: none;
+}
+
+.pagination-previous[disabled], .pagination-previous.is-disabled,
+.pagination-next[disabled],
+.pagination-next.is-disabled,
+.pagination-link[disabled],
+.pagination-link.is-disabled,
+.pagination-ellipsis[disabled],
+.pagination-ellipsis.is-disabled {
+  pointer-events: none;
+}
+
+.pagination-previous,
+.pagination-next,
+.pagination-link {
+  border: 1px solid #dbdbdb;
+  min-width: 2.5em;
+}
+
+.pagination-previous:hover,
+.pagination-next:hover,
+.pagination-link:hover {
+  border-color: #00d1b2;
+  color: #363636;
+}
+
+.pagination-previous:focus,
+.pagination-next:focus,
+.pagination-link:focus {
+  border-color: #00d1b2;
+}
+
+.pagination-previous:active,
+.pagination-next:active,
+.pagination-link:active {
+  background-color: whitesmoke;
+  box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+}
+
+.pagination-previous[disabled], .pagination-previous.is-disabled,
+.pagination-next[disabled],
+.pagination-next.is-disabled,
+.pagination-link[disabled],
+.pagination-link.is-disabled {
+  background: #dbdbdb;
+  color: #7a7a7a;
+  opacity: 0.5;
+  pointer-events: none;
+}
+
+.pagination-previous,
+.pagination-next {
+  padding-left: 0.75em;
+  padding-right: 0.75em;
+}
+
+.pagination-link.is-current {
+  background-color: #00d1b2;
+  border-color: #00d1b2;
+  color: #fff;
+}
+
+.pagination-ellipsis {
+  color: #7a7a7a;
+  pointer-events: none;
+}
+
+.pagination-list li:not(:first-child) {
+  margin-left: 0.375rem;
 }
 
 @media screen and (max-width: 768px) {
   .pagination {
     flex-wrap: wrap;
   }
-  .pagination > a {
-    width: calc(50% - 5px);
-  }
-  .pagination > a:not(:first-child) {
-    margin-left: 10px;
-  }
-  .pagination li {
+  .pagination-previous,
+  .pagination-next {
     flex-grow: 1;
-    flex-shrink: 0;
+    flex-shrink: 1;
+    width: calc(50% - 0.375rem);
   }
-  .pagination ul {
-    margin-top: 10px;
+  .pagination-next {
+    margin-left: 0.75rem;
+  }
+  .pagination-list {
+    margin-top: 0.75rem;
+  }
+  .pagination-list li {
+    flex-grow: 1;
+    flex-shrink: 1;
   }
 }
 
 @media screen and (min-width: 769px) {
-  .pagination > a:not(:first-child) {
+  .pagination-list {
+    flex-grow: 1;
+    flex-shrink: 1;
+    justify-content: flex-start;
     order: 1;
   }
+  .pagination-previous,
+  .pagination-next {
+    margin-left: 0.75rem;
+  }
+  .pagination-previous {
+    order: 2;
+  }
+  .pagination-next {
+    order: 3;
+  }
+  .pagination {
+    justify-content: space-between;
+  }
+  .pagination.is-centered .pagination-previous {
+    margin-left: 0;
+    order: 1;
+  }
+  .pagination.is-centered .pagination-list {
+    justify-content: center;
+    order: 2;
+  }
+  .pagination.is-centered .pagination-next {
+    order: 3;
+  }
+  .pagination.is-right .pagination-previous {
+    margin-left: 0;
+    order: 1;
+  }
+  .pagination.is-right .pagination-next {
+    order: 2;
+    margin-right: 0.75rem;
+  }
+  .pagination.is-right .pagination-list {
+    justify-content: flex-end;
+    order: 3;
+  }
 }
 
 .panel-icon {