Twitter Bootstrap Pager Template Stylesheet


/*Default Bootstrap Paging Style*/
.bootstrapPager {
  display: inline-block;
  padding-left: 0;
  border-radius: 4px;
  margin-left: 10px;
  margin-bottom: 10px;
  margin-top: 10px;
  line-height: 1.42857;
}
 
.bootstrapPagerPrevious{	
  background-color: #fff;
  border: 1px solid #ddd;	
  border-bottom-left-radius: 4px;
  border-top-left-radius: 4px;
  display:inline;
  margin-left: 0;
  position: relative;
  float: left;
  padding: 6px 12px;
  color: #ddd;
  line-height: 1.42857143;
  text-decoration: none; 
}

.bootstrapPagerPrevious > a, .bootstrapPagerNext > a, .bootstrapPagerMiddle > span > span > a{	
	color: #337ab7;
	text-decoration: none; 
}
 
.bootstrapPagerPrevious:focus, .bootstrapPagerPrevious:hover, .bootstrapPagerNext:focus, .bootstrapPagerNext:hover {
  background-color:#eee;
  border-color: #ddd; 
  color: #23527c;
}  
 
.bootstrapPagerMiddle {
  display:inline;
}
 
.bootstrapPagerMiddle > span {
  float: left;
}
 
.bootstrapPagerMiddle > span > span {
  margin-left:5px;
  float: left;
  color: #105CB6;
  padding: 6px 12px;
  margin-left: -1px;
  line-height: 1.42857143;
  border: 1px solid #ddd; 
  background-color:#fff;
  text-decoration: none;
}

.xspCurrentItem{
	background-color:#337ab7 !important;
	border-color:#337ab7 !important;
	color:#fff !important;
}

.bootstrapPagerMiddle > span > span:focus, .bootstrapPagerMiddle > span > span:hover {
  background-color:#eee;
  border-color: #ddd; 
  color: #23527c;
} 
 
.bootstrapPagerNext {
  display:inline;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  position: relative;
  float: left;
  padding: 6px 12px;
  margin-left: -1px;
  line-height: 1.42857143;
  text-decoration: none;
  background-color: #fff;
  border: 1px solid #ddd;
  color: #ddd;
}
All code submitted to OpenNTF XSnippets, whether submitted as a "Snippet" or in the body of a Comment, is provided under the Apache License Version 2.0. See Terms of Use for full details.
2 comment(s)Login first to comment...
Patrick Kwintensson
(at 03:52 on 01.03.2016)
I notice the ... in the pager for views with long document list is not proper styled (read: not styled at all)
jeniffer homes
(at 09:55 on 18.12.2015)
Tested on Internet Explorer 9, Google Chrome 22 and Mozilla Firefox 16.

Thanks
http://www.fixithere.net/sky-customer-service/