css/bootstrap/pagination.less

   1 //
   2 // Pagination (multiple pages)
   3 // --------------------------------------------------
   4 .pagination {
   5   display: inline-block;
   6   padding-left: 0;
   7   margin: @line-height-computed 0;
   8   border-radius: @border-radius-base;
   9
  10   > li {
  11     display: inline; // Remove list-style and block-level defaults
  12     > a,
  13     > span {
  14       position: relative;
  15       float: left; // Collapse white-space
  16       padding: @padding-base-vertical @padding-base-horizontal;
  17       line-height: @line-height-base;
  18       text-decoration: none;
  19       color: @pagination-color;
  20       background-color: @pagination-bg;
  21       border: 1px solid @pagination-border;
  22       margin-left: -1px;
  23     }
  24     &:first-child {
  25       > a,
  26       > span {
  27         margin-left: 0;
  28         .border-left-radius(@border-radius-base);
  29       }
  30     }
  31     &:last-child {
  32       > a,
  33       > span {
  34         .border-right-radius(@border-radius-base);
  35       }
  36     }
  37   }
  38
  39   > li > a,
  40   > li > span {
  41     &:hover,
  42     &:focus {
  43       color: @pagination-hover-color;
  44       background-color: @pagination-hover-bg;
  45       border-color: @pagination-hover-border;
  46     }
  47   }
  48
  49   > .active > a,
  50   > .active > span {
  51     &,
  52     &:hover,
  53     &:focus {
  54       z-index: 2;
  55       color: @pagination-active-color;
  56       background-color: @pagination-active-bg;
  57       border-color: @pagination-active-border;
  58       cursor: default;
  59     }
  60   }
  61
  62   > .disabled {
  63     > span,
  64     > span:hover,
  65     > span:focus,
  66     > a,
  67     > a:hover,
  68     > a:focus {
  69       color: @pagination-disabled-color;
  70       background-color: @pagination-disabled-bg;
  71       border-color: @pagination-disabled-border;
  72       cursor: not-allowed;
  73     }
  74   }
  75 }
  76
  77 // Sizing
  78 // --------------------------------------------------
  79
  80 // Large
  81 .pagination-lg {
  82   .pagination-size(@padding-large-vertical; @padding-large-horizontal; @font-size-large; @border-radius-large);
  83 }
  84
  85 // Small
  86 .pagination-sm {
  87   .pagination-size(@padding-small-vertical; @padding-small-horizontal; @font-size-small; @border-radius-small);
  88 }