refactor pagination

1 files changed, 52 insertions, 42 deletions

diff --git a/less/pagination.less b/less/pagination.less
index 320387a67d..8050ab90b1 100644
--- a/less/pagination.less
+++ b/less/pagination.less
@@ -6,49 +6,59 @@
   padding-left: 0;
   margin: @line-height-computed 0;
   border-radius: @border-radius-base;
+  
+  > li {
+    display: inline; // Remove list-style and block-level defaults
+    > a,
+    > span,{
+      float: left; // Collapse white-space
+      padding: 4px 12px;
+      line-height: @line-height-base;
+      text-decoration: none;
+      background-color: @pagination-bg;
+      border: 1px solid @pagination-border;
+      border-left-width: 0;
+    }
+  }
+  
+  > li > a:hover,
+  > li > a:focus,
+  > .active > a,
+  > .active > span {
+    background-color: @pagination-active-bg;
+  }
+  > .active > a,
+  > .active > span {
+    color: @gray-light;
+    cursor: default;
+  }
+  
+  > .disabled {
+    span,
+    a,
+    a:hover,
+    a:focus {
+      color: @gray-light;
+      background-color: @pagination-bg;
+      cursor: default;
+    }
+  }
+  
+  > li:first-child {
+    > a,
+    > span {
+      border-left-width: 1px;
+      .border-left-radius(@border-radius-base);
+    }
+  }
+  
+  > li:last-child {
+    > a,
+    > span {
+      .border-right-radius(@border-radius-base);
+    }
+  }
 }
-.pagination > li {
-  display: inline; // Remove list-style and block-level defaults
-}
-.pagination > li > a,
-.pagination > li > span {
-  float: left; // Collapse white-space
-  padding: 4px 12px;
-  line-height: @line-height-base;
-  text-decoration: none;
-  background-color: @pagination-bg;
-  border: 1px solid @pagination-border;
-  border-left-width: 0;
-}
-.pagination > li > a:hover,
-.pagination > li > a:focus,
-.pagination > .active > a,
-.pagination > .active > span {
-  background-color: @pagination-active-bg;
-}
-.pagination > .active > a,
-.pagination > .active > span {
-  color: @gray-light;
-  cursor: default;
-}
-.pagination > .disabled > span,
-.pagination > .disabled > a,
-.pagination > .disabled > a:hover,
-.pagination > .disabled > a:focus {
-  color: @gray-light;
-  background-color: @pagination-bg;
-  cursor: default;
-}
-.pagination > li:first-child > a,
-.pagination > li:first-child > span {
-  border-left-width: 1px;
-  .border-left-radius(@border-radius-base);
-}
-.pagination > li:last-child > a,
-.pagination > li:last-child > span {
-  .border-right-radius(@border-radius-base);
-}
-
 
 // Sizing
 // --------------------------------------------------