/* ------------------------------------------------------------------------------
*
* # Pager component
*
* Overrides for pager bootstrap component
*
* Version: 1.0
* Latest update: May 25, 2015
*
* ---------------------------------------------------------------------------- */
// Basic styles
// -------------------------
.pager {
margin-bottom: 0;
// Pager nav item
li {
// Links
> a,
> span {
padding: @padding-base-vertical @padding-base-horizontal;
color: @gray-dark;
}
// Hover/focus states
> a:hover,
> a:focus {
border-color: @pager-hover-bg;
color: #fff;
}
}
// Disabled state
.disabled {
> a,
> a:hover,
> a:focus,
> span {
border-color: @pager-border;
}
}
// Text alignment
&.text-left {
text-align: left;
}
&.text-right {
text-align: right;
}
}
// Optional sizing
// -------------------------
// Large
.pager-lg {
li > a,
li > span {
padding: @padding-large-vertical @padding-large-horizontal;
font-size: @font-size-large;
}
}
// Small
.pager-sm {
li > a,
li > span {
padding: @padding-small-vertical @padding-small-horizontal;
font-size: @font-size-base;
}
}
// Mini
.pager-xs {
li > a,
li > span {
padding: @padding-xs-vertical @padding-xs-horizontal;
font-size: @font-size-small;
line-height: @line-height-small;
}
}
// Optional styling
// -------------------------
// Rounded pager
.pager-rounded {
li > a,
li > span {
border-radius: 100px;
}
}
// Linked pager
.pager-linked {
li {
> a,
> span {
border-color: transparent;
color: @link-color;
}
// Hover state
> a:hover,
> span:hover {
background-color: @brand-primary;
color: #fff;
}
}
// Disabled state
.disabled {
> a,
> a:hover,
> a:focus,
> span {
border-color: transparent;
}
}
}