scala-news-reader
rss/atom news reader in scala
git clone https://9o.is/git/scala-news-reader.git
pagination.less
(2678B)
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 > li > a:focus,
36 .pagination ul > .active > a,
37 .pagination ul > .active > span {
38 background-color: @paginationActiveBackground;
39 }
40 .pagination ul > .active > a,
41 .pagination ul > .active > span {
42 color: @grayLight;
43 cursor: default;
44 }
45 .pagination ul > .disabled > span,
46 .pagination ul > .disabled > a,
47 .pagination ul > .disabled > a:hover,
48 .pagination ul > .disabled > a:focus {
49 color: @grayLight;
50 background-color: transparent;
51 cursor: default;
52 }
53 .pagination ul > li:first-child > a,
54 .pagination ul > li:first-child > span {
55 border-left-width: 1px;
56 .border-left-radius(@baseBorderRadius);
57 }
58 .pagination ul > li:last-child > a,
59 .pagination ul > li:last-child > span {
60 .border-right-radius(@baseBorderRadius);
61 }
62
63
64 // Alignment
65 // --------------------------------------------------
66
67 .pagination-centered {
68 text-align: center;
69 }
70 .pagination-right {
71 text-align: right;
72 }
73
74
75 // Sizing
76 // --------------------------------------------------
77
78 // Large
79 .pagination-large {
80 ul > li > a,
81 ul > li > span {
82 padding: @paddingLarge;
83 font-size: @fontSizeLarge;
84 }
85 ul > li:first-child > a,
86 ul > li:first-child > span {
87 .border-left-radius(@borderRadiusLarge);
88 }
89 ul > li:last-child > a,
90 ul > li:last-child > span {
91 .border-right-radius(@borderRadiusLarge);
92 }
93 }
94
95 // Small and mini
96 .pagination-mini,
97 .pagination-small {
98 ul > li:first-child > a,
99 ul > li:first-child > span {
100 .border-left-radius(@borderRadiusSmall);
101 }
102 ul > li:last-child > a,
103 ul > li:last-child > span {
104 .border-right-radius(@borderRadiusSmall);
105 }
106 }
107
108 // Small
109 .pagination-small {
110 ul > li > a,
111 ul > li > span {
112 padding: @paddingSmall;
113 font-size: @fontSizeSmall;
114 }
115 }
116 // Mini
117 .pagination-mini {
118 ul > li > a,
119 ul > li > span {
120 padding: @paddingMini;
121 font-size: @fontSizeMini;
122 }
123 }