Mercurial > wikked
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 } |