git.roojs.org Git - bootswatch/blob - bower_components/bootstrap/less/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       background-color: @pagination-bg;
  20       border: 1px solid @pagination-border;
  21       margin-left: -1px;
  22     }
  23     &:first-child {
  24       > a,
  25       > span {
  26         margin-left: 0;
  27         .border-left-radius(@border-radius-base);
  28       }
  29     }
  30     &:last-child {
  31       > a,
  32       > span {
  33         .border-right-radius(@border-radius-base);
  34       }
  35     }
  36   }
  37
  38   > li > a,
  39   > li > span {
  40     &:hover,
  41     &:focus {
  42       background-color: @pagination-hover-bg;
  43     }
  44   }
  45
  46   > .active > a,
  47   > .active > span {
  48     &,
  49     &:hover,
  50     &:focus {
  51       z-index: 2;
  52       color: @pagination-active-color;
  53       background-color: @pagination-active-bg;
  54       border-color: @pagination-active-bg;
  55       cursor: default;
  56     }
  57   }
  58
  59   > .disabled {
  60     > span,
  61     > span:hover,
  62     > span:focus,
  63     > a,
  64     > a:hover,
  65     > a:focus {
  66       color: @pagination-disabled-color;
  67       background-color: @pagination-bg;
  68       border-color: @pagination-border;
  69       cursor: not-allowed;
  70     }
  71   }
  72 }
  73
  74 // Sizing
  75 // --------------------------------------------------
  76
  77 // Large
  78 .pagination-lg {
  79   .pagination-size(@padding-large-vertical; @padding-large-horizontal; @font-size-large; @border-radius-large);
  80 }
  81
  82 // Small
  83 .pagination-sm {
  84   .pagination-size(@padding-small-vertical; @padding-small-horizontal; @font-size-small; @border-radius-small);
  85 }