comparison static/bootstrap/less/pagination.less @ 61:130eccd396d8

Now using Boostrap with LESS.
author Ludovic Chabant <ludovic@chabant.com>
date Wed, 06 Feb 2013 08:22:31 -0800
parents
children a5a3d454eac9
comparison
equal deleted inserted replaced
60:8250c977bc50 61:130eccd396d8
1 //
2 // Pagination (multiple pages)
3 // --------------------------------------------------
4
5 // Space out pagination from surrounding content
6 .pagination {
7 margin: @baseLineHeight 0;
8 }
9
10 .pagination ul {
11 // Allow for text-based alignment
12 display: inline-block;
13 .ie7-inline-block();
14 // Reset default ul styles
15 margin-left: 0;
16 margin-bottom: 0;
17 // Visuals
18 .border-radius(@baseBorderRadius);
19 .box-shadow(0 1px 2px rgba(0,0,0,.05));
20 }
21 .pagination ul > li {
22 display: inline; // Remove list-style and block-level defaults
23 }
24 .pagination ul > li > a,
25 .pagination ul > li > span {
26 float: left; // Collapse white-space
27 padding: 4px 12px;
28 line-height: @baseLineHeight;
29 text-decoration: none;
30 background-color: @paginationBackground;
31 border: 1px solid @paginationBorder;
32 border-left-width: 0;
33 }
34 .pagination ul > li > a:hover,
35 .pagination ul > .active > a,
36 .pagination ul > .active > span {
37 background-color: @paginationActiveBackground;
38 }
39 .pagination ul > .active > a,
40 .pagination ul > .active > span {
41 color: @grayLight;
42 cursor: default;
43 }
44 .pagination ul > .disabled > span,
45 .pagination ul > .disabled > a,
46 .pagination ul > .disabled > a:hover {
47 color: @grayLight;
48 background-color: transparent;
49 cursor: default;
50 }
51 .pagination ul > li:first-child > a,
52 .pagination ul > li:first-child > span {
53 border-left-width: 1px;
54 .border-left-radius(@baseBorderRadius);
55 }
56 .pagination ul > li:last-child > a,
57 .pagination ul > li:last-child > span {
58 .border-right-radius(@baseBorderRadius);
59 }
60
61
62 // Alignment
63 // --------------------------------------------------
64
65 .pagination-centered {
66 text-align: center;
67 }
68 .pagination-right {
69 text-align: right;
70 }
71
72
73 // Sizing
74 // --------------------------------------------------
75
76 // Large
77 .pagination-large {
78 ul > li > a,
79 ul > li > span {
80 padding: @paddingLarge;
81 font-size: @fontSizeLarge;
82 }
83 ul > li:first-child > a,
84 ul > li:first-child > span {
85 .border-left-radius(@borderRadiusLarge);
86 }
87 ul > li:last-child > a,
88 ul > li:last-child > span {
89 .border-right-radius(@borderRadiusLarge);
90 }
91 }
92
93 // Small and mini
94 .pagination-mini,
95 .pagination-small {
96 ul > li:first-child > a,
97 ul > li:first-child > span {
98 .border-left-radius(@borderRadiusSmall);
99 }
100 ul > li:last-child > a,
101 ul > li:last-child > span {
102 .border-right-radius(@borderRadiusSmall);
103 }
104 }
105
106 // Small
107 .pagination-small {
108 ul > li > a,
109 ul > li > span {
110 padding: @paddingSmall;
111 font-size: @fontSizeSmall;
112 }
113 }
114 // Mini
115 .pagination-mini {
116 ul > li > a,
117 ul > li > span {
118 padding: @paddingMini;
119 font-size: @fontSizeMini;
120 }
121 }