UNPKG

4.99 kBSCSSView Raw
1@charset "UTF-8";
2
3////
4/// @module input: 输入框
5/// @tag input
6/// @category component
7/// @family data-entry
8/// @varPrefix $input-
9/// @classPrefix {prefix}-input
10/// @order {"statement/normal":10,"statement/normal/addon":100,"statement/normal/feedback":101,"statement/normal/maxlen":102,"statement/normal/clear":103,"statement/hover":11,"statement/hover/clear":110,"statement/focus":12,"statement/disabled":13,"statement/error":14,"size/bounding":10,"size/bounding/addon":100,"size/label":11,"size/maxlen":12}
11////
12
13$input-prefix: '.#{$css-prefix}input';
14
15// 公共
16// --------------------------------------------------
17
18/// text
19/// @namespace statement/normal
20$input-text-color: $gray-08 !default;
21
22/// border
23/// @namespace statement/normal
24$input-border-color: $gray-04 !default;
25
26/// label
27/// @namespace statement/normal
28$input-label-color: $gray-07 !default;
29
30/// border
31/// @namespace statement/hover
32$input-hover-border-color: $gray-05 !default;
33
34/// background
35/// @namespace statement/hover
36$input-hover-bg-color: $background-fill !default;
37
38/// border
39/// @namespace statement/focus
40$input-focus-border-color: $primary-brand !default;
41
42/// background
43/// @namespace statement/focus
44$input-focus-bg-color: $background-fill !default;
45
46/// border
47/// @namespace size/bounding
48$input-border-width: 1px !default;
49
50/// background
51/// @namespace statement/normal
52$input-bg-color: $background-fill !default;
53
54/// placeholder
55/// @namespace statement/normal
56$input-placeholder-color: $gray-05 !default;
57
58/// text
59/// @namespace statement/disabled
60$input-disabled-color: $gray-05 !default;
61
62/// border
63/// @namespace statement/disabled
64$input-disabled-border-color: $gray-03 !default;
65
66/// background
67/// @namespace statement/disabled
68$input-disabled-bg-color: $gray-01 !default;
69
70// 多行
71// --------------------------------------------------
72
73/// padding(l,r)
74/// @namespace size/bounding
75$input-multiple-padding-lr: $S8 !default;
76
77/// padding(t,b)
78/// @namespace size/bounding
79$input-multiple-padding-tb: $S4 !default;
80
81/// text
82/// @namespace size/bounding
83$input-multiple-font-size: $font-size-body !default;
84
85/// corner
86/// @namespace size/bounding
87$input-multiple-corner: $shape-radius !default;
88
89// addon
90// --------------------------------------------------
91
92/// background
93/// @namespace statement/normal/addon
94$input-addon-bg-color: $gray-03 !default;
95
96/// text
97/// @namespace statement/normal/addon
98$input-addon-text-color: $gray-06 !default;
99
100/// padding(l,r)
101/// @namespace size/bounding/addon
102$input-addon-padding: $S8 !default;
103
104// large
105// --------------------------------------------------
106
107/// padding
108/// @namespace size/bounding
109$input-l-padding: $S8 !default;
110
111/// padding(l)
112/// @namespace size/label
113$input-l-label-padding-left: $S12 !default;
114
115/// padding(r)
116/// @namespace size/label
117$input-l-icon-padding-right: $S8 !default;
118
119// medium
120// --------------------------------------------------
121
122/// padding
123/// @namespace size/bounding
124$input-m-padding: $S8 !default;
125
126/// padding(l)
127/// @namespace size/label
128$input-m-label-padding-left: $S8 !default;
129
130/// padding(r)
131/// @namespace size/label
132$input-m-icon-padding-right: $S8 !default;
133
134// xs
135// --------------------------------------------------
136
137/// padding
138/// @namespace size/bounding
139$input-xs-padding: $S8 !default;
140
141/// padding(l)
142/// @namespace size/label
143$input-xs-label-padding-left: $S4 !default;
144
145/// padding(r)
146/// @namespace size/label
147$input-xs-icon-padding-right: $S4 !default;
148
149// small
150// --------------------------------------------------
151
152/// padding
153/// @namespace size/bounding
154$input-s-padding: $S8 !default;
155
156/// padding(l)
157/// @namespace size/label
158$input-s-label-padding-left: $S4 !default;
159
160/// padding(r)
161/// @namespace size/label
162$input-s-icon-padding-right: $S4 !default;
163
164// feedback
165// --------------------------------------------------
166
167/// success
168/// @namespace statement/normal/feedback
169$input-feedback-success-color: $primary-success !default;
170
171/// loading
172/// @namespace statement/normal/feedback
173$input-feedback-loading-color: $border-brand !default;
174
175/// border
176/// @namespace statement/error
177$input-feedback-error-border-color: $primary-danger !default;
178
179/// border
180/// @namespace statement/success
181$input-feedback-success-border-color: $primary-success !default;
182
183/// tip
184/// @namespace statement/error
185$input-feedback-error-tip-color: $primary-danger !default;
186
187// maxlen
188// --------------------------------------------------
189
190/// error
191/// @namespace statement/normal/maxlen
192$input-maxlen-error-color: $primary-danger !default;
193
194/// text
195/// @namespace statement/normal/maxlen
196$input-maxlen-color: $gray-06 !default;
197
198/// text
199/// @namespace size/maxlen
200$input-maxlen-font-size: $font-size-caption !default;
201
202// hint
203// --------------------------------------------------
204
205/// background
206/// @namespace statement/normal/clear
207$input-hint-color: $gray-06 !default;
208
209/// background
210/// @namespace statement/hover/clear
211$input-hint-hover-color: $gray-07 !default;