source: trip-planner-front/node_modules/angular-material/modules/closure/select/select.css@ 6a3a178

Last change on this file since 6a3a178 was 6a3a178, checked in by Ema <ema_spirova@…>, 3 years ago

initial commit
  • Property mode set to 100644
File size: 9.9 KB
Line 
1/*!
2 * AngularJS Material Design
3 * https://github.com/angular/material
4 * @license MIT
5 * v1.2.3
6 */
7md-input-container:not([md-no-float]) .md-select-placeholder span:first-child {
8 transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
9 transform-origin: left top; }
10 [dir=rtl] md-input-container:not([md-no-float]) .md-select-placeholder span:first-child {
11 transform-origin: right top; }
12
13md-input-container.md-input-focused:not([md-no-float]) md-select:not([placeholder]) .md-select-placeholder span:first-child {
14 transform: translate(-2px, -22px) scale(0.75); }
15
16.md-select-menu-container {
17 position: fixed;
18 left: 0;
19 top: 0;
20 z-index: 90;
21 opacity: 0;
22 display: none;
23 transform: translateY(-1px); }
24 .md-select-menu-container:not(.md-clickable) {
25 pointer-events: none; }
26 .md-select-menu-container md-progress-circular {
27 display: table;
28 margin: 24px auto !important; }
29 .md-select-menu-container.md-active {
30 display: block;
31 opacity: 1; }
32 .md-select-menu-container.md-active md-select-menu {
33 transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
34 transition-duration: 150ms; }
35 .md-select-menu-container.md-active md-select-menu > * {
36 opacity: 1;
37 transition: all 0.3s cubic-bezier(0.55, 0, 0.55, 0.2);
38 transition-duration: 150ms;
39 transition-delay: 100ms; }
40 .md-select-menu-container.md-leave {
41 opacity: 0;
42 transition: all 0.3s cubic-bezier(0.55, 0, 0.55, 0.2);
43 transition-duration: 250ms; }
44
45.md-inline-form md-select {
46 margin-top: 20px; }
47
48md-input-container > md-select,
49.md-inline-form md-input-container > md-select {
50 margin-top: 0px; }
51
52md-input-container > md-select {
53 order: 2; }
54
55md-input-container:not(.md-input-has-value) md-select[required]:not(.md-no-asterisk) .md-select-value span:first-child:after, md-input-container:not(.md-input-has-value) md-select.ng-required:not(.md-no-asterisk) .md-select-value span:first-child:after {
56 content: ' *';
57 font-size: 13px;
58 vertical-align: top; }
59
60md-input-container.md-input-invalid md-select .md-select-value {
61 border-bottom-style: solid;
62 padding-bottom: 1px; }
63
64md-select {
65 display: flex; }
66 md-select[required].ng-empty.ng-invalid:not(.md-no-asterisk) .md-select-value span:first-child:after, md-select.ng-required.ng-empty.ng-invalid:not(.md-no-asterisk) .md-select-value span:first-child:after {
67 content: ' *';
68 font-size: 13px;
69 vertical-align: top; }
70 md-select[disabled] .md-select-value {
71 background-position: bottom -1px left 0;
72 background-size: 4px 1px;
73 background-repeat: repeat-x;
74 padding-bottom: 2px;
75 padding-top: 1px;
76 transform: translateY(1px); }
77 md-select:focus {
78 outline: none; }
79 md-select[disabled]:hover {
80 cursor: default; }
81 md-select:not([disabled]):hover {
82 cursor: pointer; }
83 md-select:not([disabled]):focus .md-select-value {
84 border-bottom-style: solid;
85 border-bottom-width: 2px;
86 padding-bottom: 0px; }
87
88md-input-container md-select:not([disabled]):focus .md-select-value {
89 border-bottom-width: 2px; }
90
91md-input-container md-select[disabled] .md-select-value {
92 background-position: bottom -1px left 0; }
93
94md-input-container md-select .md-select-value {
95 min-height: 26px;
96 border-bottom-width: 1px;
97 padding-bottom: 1px; }
98 md-input-container md-select .md-select-value.md-select-placeholder {
99 padding-left: 0;
100 padding-right: 2px; }
101 [dir=rtl] md-input-container md-select .md-select-value.md-select-placeholder {
102 padding-left: 2px; }
103 [dir=rtl] md-input-container md-select .md-select-value.md-select-placeholder {
104 padding-right: 0; }
105
106.md-select-value {
107 display: flex;
108 align-items: center;
109 padding-top: 2px;
110 padding-bottom: 1px;
111 padding-left: 0;
112 padding-right: 2px;
113 border-bottom-width: 1px;
114 border-bottom-style: solid;
115 background-color: rgba(0, 0, 0, 0);
116 position: relative;
117 box-sizing: content-box;
118 min-width: 88px;
119 min-height: 26px;
120 margin-bottom: auto;
121 -ms-flex-item-align: start;
122 flex-grow: 1; }
123 [dir=rtl] .md-select-value {
124 padding-left: 2px; }
125 [dir=rtl] .md-select-value {
126 padding-right: 0; }
127 .md-select-value > span:not(.md-select-icon) {
128 max-width: 100%;
129 flex: 1 1 auto;
130 text-overflow: ellipsis;
131 white-space: nowrap;
132 overflow: hidden; }
133 .md-select-value > span:not(.md-select-icon) .md-text {
134 display: inline; }
135 .md-select-value .md-select-icon {
136 display: block;
137 align-items: flex-end;
138 text-align: right;
139 width: 24px;
140 transform: translateY(-2px);
141 font-size: 1.2rem; }
142 [dir=rtl] .md-select-value .md-select-icon {
143 align-items: flex-start; }
144 [dir=rtl] .md-select-value .md-select-icon {
145 text-align: left; }
146 .md-select-value .md-select-icon:after {
147 display: block;
148 content: '\25BC';
149 position: relative;
150 top: 2px;
151 right: -4px;
152 left: auto;
153 speak: none;
154 font-size: 13px;
155 transform: scaleY(0.5); }
156 [dir=rtl] .md-select-value .md-select-icon:after {
157 right: auto; }
158 [dir=rtl] .md-select-value .md-select-icon:after {
159 left: -4px; }
160 .md-select-value.md-select-placeholder {
161 display: flex;
162 order: 1;
163 pointer-events: none;
164 -webkit-font-smoothing: antialiased;
165 z-index: 1; }
166
167md-select-menu {
168 display: flex;
169 flex-direction: column;
170 box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 2px 1px -1px rgba(0, 0, 0, 0.12);
171 max-height: 256px;
172 min-height: 48px;
173 overflow-y: hidden;
174 transform-origin: left top;
175 transform: scale(1); }
176 md-select-menu.md-reverse {
177 flex-direction: column-reverse; }
178 md-select-menu:not(.md-overflow) md-content {
179 padding-top: 8px;
180 padding-bottom: 8px; }
181 [dir=rtl] md-select-menu {
182 transform-origin: right top; }
183 md-select-menu md-content {
184 min-width: 136px;
185 min-height: 48px;
186 max-height: 256px;
187 overflow-y: auto; }
188 md-select-menu > * {
189 opacity: 0; }
190
191md-option {
192 cursor: pointer;
193 position: relative;
194 display: flex;
195 align-items: center;
196 width: auto;
197 transition: background 0.15s linear;
198 padding: 0 16px 0 16px;
199 height: 48px; }
200 md-option[disabled] {
201 cursor: default; }
202 md-option:focus {
203 outline: none; }
204 md-option .md-text {
205 -webkit-touch-callout: none;
206 -webkit-user-select: none;
207 -moz-user-select: none;
208 -ms-user-select: none;
209 user-select: none;
210 width: auto;
211 white-space: nowrap;
212 overflow: hidden;
213 text-overflow: ellipsis; }
214
215md-optgroup {
216 display: block; }
217 md-optgroup label {
218 display: block;
219 font-size: 14px;
220 text-transform: uppercase;
221 padding: 16px;
222 font-weight: 500; }
223 md-optgroup md-option {
224 padding-left: 32px;
225 padding-right: 32px; }
226
227@media screen and (-ms-high-contrast: active) {
228 .md-select-backdrop {
229 background-color: transparent; }
230 md-select-menu {
231 border: 1px solid #fff; } }
232
233md-select-menu[multiple] md-option.md-checkbox-enabled {
234 padding-left: 40px;
235 padding-right: 16px; }
236 [dir=rtl] md-select-menu[multiple] md-option.md-checkbox-enabled {
237 padding-left: 16px; }
238 [dir=rtl] md-select-menu[multiple] md-option.md-checkbox-enabled {
239 padding-right: 40px; }
240 md-select-menu[multiple] md-option.md-checkbox-enabled .md-container {
241 position: absolute;
242 top: 50%;
243 transform: translateY(-50%);
244 box-sizing: border-box;
245 display: inline-block;
246 width: 18px;
247 height: 18px;
248 left: 0;
249 right: auto; }
250 [dir=rtl] md-select-menu[multiple] md-option.md-checkbox-enabled .md-container {
251 left: auto; }
252 [dir=rtl] md-select-menu[multiple] md-option.md-checkbox-enabled .md-container {
253 right: 0; }
254 md-select-menu[multiple] md-option.md-checkbox-enabled .md-container:before {
255 box-sizing: border-box;
256 background-color: transparent;
257 border-radius: 50%;
258 content: '';
259 position: absolute;
260 display: block;
261 height: auto;
262 left: 0;
263 top: 0;
264 right: 0;
265 bottom: 0;
266 transition: all 0.5s;
267 width: auto; }
268 md-select-menu[multiple] md-option.md-checkbox-enabled .md-container:after {
269 box-sizing: border-box;
270 content: '';
271 position: absolute;
272 top: -10px;
273 right: -10px;
274 bottom: -10px;
275 left: -10px; }
276 md-select-menu[multiple] md-option.md-checkbox-enabled .md-container .md-ripple-container {
277 position: absolute;
278 display: block;
279 width: auto;
280 height: auto;
281 left: -15px;
282 top: -15px;
283 right: -15px;
284 bottom: -15px; }
285 md-select-menu[multiple] md-option.md-checkbox-enabled .md-icon {
286 box-sizing: border-box;
287 transition: 240ms;
288 position: absolute;
289 top: 0;
290 left: 0;
291 width: 18px;
292 height: 18px;
293 border-width: 2px;
294 border-style: solid;
295 border-radius: 2px; }
296 md-select-menu[multiple] md-option.md-checkbox-enabled[selected] .md-icon {
297 border-color: transparent; }
298 md-select-menu[multiple] md-option.md-checkbox-enabled[selected] .md-icon:after {
299 box-sizing: border-box;
300 transform: rotate(45deg);
301 position: absolute;
302 left: 4px;
303 top: 0px;
304 display: table;
305 width: 6px;
306 height: 12px;
307 border-width: 2px;
308 border-style: solid;
309 border-top: 0;
310 border-left: 0;
311 content: ''; }
312 md-select-menu[multiple] md-option.md-checkbox-enabled[disabled] {
313 cursor: default; }
314 md-select-menu[multiple] md-option.md-checkbox-enabled.md-indeterminate .md-icon:after {
315 box-sizing: border-box;
316 position: absolute;
317 top: 50%;
318 left: 50%;
319 transform: translate(-50%, -50%);
320 display: table;
321 width: 10.8px;
322 height: 2px;
323 border-width: 2px;
324 border-style: solid;
325 border-top: 0;
326 border-left: 0;
327 content: ''; }
328 md-select-menu[multiple] md-option.md-checkbox-enabled .md-container {
329 margin-left: 10.66667px;
330 margin-right: auto; }
331 [dir=rtl] md-select-menu[multiple] md-option.md-checkbox-enabled .md-container {
332 margin-left: auto; }
333 [dir=rtl] md-select-menu[multiple] md-option.md-checkbox-enabled .md-container {
334 margin-right: 10.66667px; }
Note: See TracBrowser for help on using the repository browser.