UNPKG

7.65 kBSCSSView Raw
1////
2/// @module pagination: 分页器
3/// @tag Pagination
4/// @category component
5/// @family navigation
6/// @varPrefix $pagination-
7/// @classPrefix {prefix}-pagination
8/// @order {"size/item":10,"size/ellipsis":11,"size/display":12,"size/jump":13,"size/size selector":14,"statement/normal":10,"statement/normal/ellipsis":100,"statement/normal/display":101,"statement/normal/jump":102,"statement/normal/size selector":103,"statement/normal/arrow":104,"statement/normal/current item":105,"statement/normal/item":106,"statement/normal/icon":107,"statement/hover/arrow":110,"statement/hover":11,"statement/hover/current item":110}
9////
10
11// pagination variables
12// --------------------------------------------------
13
14// unconfigurable
15$pagination-prefix: ".#{$css-prefix}pagination";
16
17// Size:Medium
18// ----------------------------------------
19
20/// margin (l, r)
21/// @namespace size/item
22$pagination-item-split: $s-1 !default;
23
24/// padding (l,r)
25/// @namespace size/item
26/// @type number
27$pagination-item-padding: 10px !default;
28
29/// border style
30/// @namespace size/item
31$pagination-item-border-style: $line-solid !default;
32
33/// border width
34/// @namespace size/item
35$pagination-item-border-width: $line-1 !default;
36
37/// corner
38/// @namespace size/item
39$pagination-item-corner: $corner-1 !default;
40
41/// icon
42/// @namespace size/ellipsis
43$pagination-ellipsis-size: $icon-xs !default;
44
45/// margin (l, r)
46/// @namespace size/ellipsis
47$pagination-ellipsis-margin: $s-2 !default;
48
49/// current text
50/// @namespace size/display
51$pagination-current-font-size: $font-size-body-1 !default;
52
53/// total text
54/// @namespace size/display
55$pagination-total-font-size: $font-size-body-1 !default;
56
57/// text
58/// @namespace size/jump
59$pagination-jump-font-size: $font-size-body-1 !default;
60
61/// input width
62/// @namespace size/jump
63$pagination-input-width: $s-9 !default;
64
65/// input margin (l, r)
66/// @namespace size/jump
67$pagination-input-margin: $s-1 !default;
68
69/// title margin (r)
70/// @namespace size/size selector
71$pagination-size-selector-title-margin-right: $s-1 !default;
72
73/// number padding
74/// @namespace size/size selector
75$pagination-size-selector-number-padding: $s-3 !default;
76
77// Size:Large
78// ----------------------------------------
79
80/// margin (l, r)
81/// @namespace size/item
82$pagination-large-item-split: $s-2 !default;
83
84/// padding (l,r)
85/// @namespace size/item
86/// @type number
87$pagination-large-item-padding: 15px !default;
88
89/// border width
90/// @namespace size/item
91$pagination-large-item-border-width: $line-1 !default;
92
93/// corner
94/// @namespace size/item
95$pagination-large-item-corner: $corner-1 !default;
96
97/// icon
98/// @namespace size/ellipsis
99$pagination-large-ellipsis-size: $icon-s !default;
100
101/// current text
102/// @namespace size/display
103$pagination-large-current-font-size: $font-size-subhead !default;
104
105/// total text
106/// @namespace size/display
107$pagination-large-total-font-size: $font-size-subhead !default;
108
109/// input width
110/// @namespace size/jump
111$pagination-large-input-width: $s-12 !default;
112
113/// text
114/// @namespace size/jump
115$pagination-large-jump-font-size: $font-size-subhead !default;
116
117/// number padding
118/// @namespace size/size selector
119$pagination-large-size-selector-number-padding: $s-4 !default;
120
121// Size:Small
122// ----------------------------------------
123
124/// margin (l, r)
125/// @namespace size/item
126$pagination-small-item-split: $s-1 !default;
127
128/// padding (l,r)
129/// @namespace size/item
130/// @type number
131$pagination-small-item-padding: 6px !default;
132
133/// border width
134/// @namespace size/item
135$pagination-small-item-border-width: $line-1 !default;
136
137/// corner
138/// @namespace size/item
139$pagination-small-item-corner: $corner-1 !default;
140
141/// icon
142/// @namespace size/ellipsis
143$pagination-small-ellipsis-size: $icon-xs !default;
144
145/// current text
146/// @namespace size/display
147$pagination-small-current-font-size: $font-size-caption !default;
148
149/// total text
150/// @namespace size/display
151$pagination-small-total-font-size: $font-size-caption !default;
152
153/// input width
154/// @namespace size/jump
155$pagination-small-input-width: $s-7 !default;
156
157/// text
158/// @namespace size/jump
159$pagination-small-jump-font-size: $font-size-caption !default;
160
161/// number padding
162/// @namespace size/size selector
163$pagination-small-size-selector-number-padding: $s-2 !default;
164
165// Statement:Normal
166// ----------------------------------------
167
168/// text
169/// @namespace statement/normal/ellipsis
170$pagination-ellipsis-color: $color-text1-2 !default;
171
172/// current text
173/// @namespace statement/normal/display
174$pagination-current-color: $color-brand1-6 !default;
175
176/// total text
177/// @namespace statement/normal/display
178$pagination-total-color: $color-text1-4 !default;
179
180/// text
181/// @namespace statement/normal/jump
182$pagination-jump-color: $color-text1-2 !default;
183
184/// title text
185/// @namespace statement/normal/size selector
186$pagination-size-selector-title-color: $color-text1-2 !default;
187
188/// filter text
189/// @namespace statement/normal/size selector
190$pagination-size-selector-filter-color: $color-text1-3 !default;
191
192/// filter current text
193/// @namespace statement/normal/size selector
194$pagination-size-selector-filter-current-color: $color-brand1-6 !default;
195
196/// border
197/// @namespace statement/normal/item
198$pagination-item-border-color: $color-line1-3 !default;
199
200/// shadow
201/// @namespace statement/normal/item
202$pagination-item-shadow: $shadow-zero !default;
203
204/// text
205/// @namespace statement/normal/item
206$pagination-item-color: $color-text1-4 !default;
207
208/// background
209/// @namespace statement/normal/item
210$pagination-item-bg: $color-white !default;
211
212/// border
213/// @namespace statement/normal/current item
214$pagination-item-current-border-color: $color-brand1-6 !default;
215
216/// shadow
217/// @namespace statement/normal/current item
218$pagination-item-current-shadow: $shadow-zero !default;
219
220/// text
221/// @namespace statement/normal/current item
222$pagination-item-current-color: $color-white !default;
223
224/// background
225/// @namespace statement/normal/current item
226$pagination-item-current-bg: $color-brand1-6 !default;
227
228/// border
229/// @namespace statement/hover/item
230$pagination-item-hover-border-color: $color-line1-4 !default;
231
232/// shadow
233/// @namespace statement/hover/item
234$pagination-item-hover-shadow: $shadow-zero !default;
235
236/// text
237/// @namespace statement/hover/item
238$pagination-item-hover-color: $color-text1-4 !default;
239
240/// background
241/// @namespace statement/hover/item
242$pagination-item-hover-bg: $color-fill1-2 !default;
243
244/// color
245/// @namespace statement/normal/arrow
246$pagination-arrow-color: $color-text1-3 !default;
247
248/// prev
249/// @namespace statement/normal/icon
250$pagination-icon-prev-content: $icon-content-arrow-left !default;
251
252/// next
253/// @namespace statement/normal/icon
254$pagination-icon-next-content: $icon-content-arrow-right !default;
255
256/// ellipsis
257/// @namespace statement/normal/icon
258$pagination-icon-ellipsis-content: $icon-content-ellipsis !default;
259
260// Statement:Hover
261// ----------------------------------------
262
263/// border
264/// @namespace statement/hover/current item
265$pagination-item-current-hover-border-color: $color-transparent !default;
266
267/// shadow
268/// @namespace statement/hover/current item
269$pagination-item-current-hover-shadow: $shadow-zero !default;
270
271/// text
272/// @namespace statement/hover/current item
273$pagination-item-current-hover-color: $color-white !default;
274
275/// background
276/// @namespace statement/hover/current item
277$pagination-item-current-hover-bg: $color-brand1-9 !default;
278
279/// color
280/// @namespace statement/hover/arrow
281$pagination-arrow-hover-color: $color-text1-4 !default;
282
283/// color
284/// @namespace statement/hover/arrow
285$pagination-arrow-hover-color-noboder: $color-brand1-6 !default;