_pagination.scss in active_frontend-11.0.0

- old
+ new

@@ -1,8 +1,10 @@
 /* Table of Contents
 ==================================================
-# Pagination */
+# Pagination
+# Alignments
+# Colors */
 
 /* # Pagination
 ================================================== */
 .pagination > ul {
   display: inline-block;
@@ -10,33 +12,58 @@
   padding: 0;
 }
 .pagination > ul > li {
   display: inline-block;
   font-size: 14px;
+  font-weight: normal;
   line-height: 14px;
   margin-right: 2px;
 }
 .pagination > ul > li > a,
 .pagination > ul > li.active {
-  background: $color-light-haze;
+  background: $color-white;
   border-radius: 500px;
   color: $color-black;
   display: inline-block;
   min-width: 8px;
   text-align: center;
   text-decoration: none;
 }
-.pagination > ul > li > a { padding: 10px 12px 8px 12px; }
+.pagination > ul > li > a,
 .pagination > ul > li.active { padding: 10px 12px 8px 12px; }
 .pagination > ul > li > a:active,
 .pagination > ul > li.active {
   background: $color-primary;
   color: $color-white;
 }
 .pagination > ul > li > a:hover,
-.pagination > ul > li > a:focus { background: $color-haze; }
+.pagination > ul > li > a:focus { background: $color-light-haze; }
 .pagination > ul > li.pagination-icon > a { padding: 9px 10px 7px 10px; }
 .pagination > ul > li.pagination-icon:first-child > a { padding-right: 13px; }
 .pagination > ul > li.pagination-icon:last-child > a { padding-left: 13px; }
-.pagination-centered { text-align: center; }
+
+/* # Alignments
+================================================== */
+.pagination-center { text-align: center; }
 .pagination-right { text-align: right; }
-.pagination-left { text-align: left; }
+.pagination-left { text-align: left; }
+
+/* # Colors
+================================================== */
+.pagination-dark > ul > li > a,
+.pagination-dark > ul > li.active {
+  background: $color-black;
+  color: $color-white;
+}
+.pagination-light > ul > li > a,
+.pagination-light > ul > li.active { background: $color-light-haze; }
+.pagination-dark > ul > li > a:active,
+.pagination-dark > ul > li.active,
+.pagination-light > ul > li > a:active,
+.pagination-light > ul > li.active {
+  background: $color-primary;
+  color: $color-white;
+}
+.pagination-dark > ul > li > a:hover,
+.pagination-dark > ul > li > a:focus { background: $color-light-black; }
+.pagination-light > ul > li > a:hover,
+.pagination-light > ul > li > a:focus { background: $color-haze; }
\ No newline at end of file