|
1 /* |
|
2 * Menus styles |
|
3 */ |
|
4 |
|
5 @import "colors.less"; |
|
6 |
|
7 nav { |
|
8 padding-top: 40px; |
|
9 |
|
10 ul { |
|
11 width: 100%; |
|
12 //padding: 40px 28px 25px 0; |
|
13 padding: 0; |
|
14 margin: 0; |
|
15 font-size: 13px; |
|
16 line-height: .5em; |
|
17 list-style: none; |
|
18 position: relative; |
|
19 background-color: @navBgColor; |
|
20 |
|
21 li { |
|
22 overflow: hidden; |
|
23 |
|
24 &.divider { |
|
25 height: 20px; |
|
26 border: 0; |
|
27 |
|
28 &:first-child, |
|
29 &:last-child, |
|
30 & + li.divider { |
|
31 display: none; |
|
32 } |
|
33 } |
|
34 &.header { |
|
35 font-family: "Ubuntu-Light", Arial, Helvetica, sans-serif; |
|
36 font-size: 14px; |
|
37 font-weight: bold; |
|
38 color: #eee; |
|
39 background-color: @navHeaderBgColor; |
|
40 padding: 4px 10px 4px 20px; |
|
41 line-height: 18px; |
|
42 |
|
43 &:not(:first-child) { |
|
44 margin-top: 10px; |
|
45 } |
|
46 .minified #left-panel & { |
|
47 padding: 5px; |
|
48 color: @navHeaderBgColor; |
|
49 line-height: 0; |
|
50 max-height: 10px; |
|
51 overflow: hidden; |
|
52 } |
|
53 } |
|
54 a { |
|
55 line-height: normal; |
|
56 font-size: 14px; |
|
57 padding: 10px 10px 10px 11px; |
|
58 color: @navLinkColor; |
|
59 display: block; |
|
60 font-weight: 400; |
|
61 text-decoration: none!important; |
|
62 position: relative; |
|
63 } |
|
64 a:active { |
|
65 background: @navLinkActiveColor!important; |
|
66 } |
|
67 a:focus { |
|
68 color: @navLinkFocusColor; |
|
69 } |
|
70 a:hover { |
|
71 color: @navLinkHoverColor; |
|
72 text-decoration: none; |
|
73 } |
|
74 &.active { |
|
75 >a { |
|
76 background-color: @navBgColor; |
|
77 color: @navLinkHoverColor!important; |
|
78 position: relative; |
|
79 |
|
80 &:before { |
|
81 content: "\f0d9"; |
|
82 font-family: FontAwesome; |
|
83 display: block; |
|
84 height: 27px; |
|
85 line-height: 14px; |
|
86 width: 27px; |
|
87 position: absolute; |
|
88 right: -21px; |
|
89 font-size: 20px; |
|
90 color: @navLinkPipeColor; |
|
91 } |
|
92 } |
|
93 &.open >a { |
|
94 &:before { |
|
95 content: ""; |
|
96 } |
|
97 &.active:before { |
|
98 content: "\f0d9"; |
|
99 } |
|
100 } |
|
101 } |
|
102 li { |
|
103 border-bottom: 0; |
|
104 position: relative; |
|
105 } |
|
106 } |
|
107 .active >a { |
|
108 color: @navActiveMenuLinkColor!important; |
|
109 position: relative; |
|
110 } |
|
111 &.active { |
|
112 li.active { |
|
113 >a { |
|
114 cursor: default; |
|
115 |
|
116 &.open { |
|
117 cursor: pointer; |
|
118 |
|
119 &.active { |
|
120 cursor: default; |
|
121 background-color: @navSubMenuActiveLinkBgColor; |
|
122 transition: background-color ease 2s; |
|
123 } |
|
124 } |
|
125 } |
|
126 } |
|
127 } |
|
128 b { |
|
129 float: right; |
|
130 font-size: 14px; |
|
131 margin-top: -1px; |
|
132 } |
|
133 span.menu-item-parent { |
|
134 display: inline-block; |
|
135 margin: 0; |
|
136 padding: 0; |
|
137 } |
|
138 ul { |
|
139 margin: 0; |
|
140 display: none; |
|
141 background: @navSubMenuBgColor; |
|
142 padding: 2px 0; |
|
143 |
|
144 >li:hover b { |
|
145 color: @navSubMenuLinkHoverBoldColor; |
|
146 } |
|
147 li { |
|
148 margin: 0; |
|
149 padding: 0; |
|
150 |
|
151 &.divider { |
|
152 height: 1px; |
|
153 margin-left: 30px; |
|
154 padding: 0; |
|
155 } |
|
156 >a { |
|
157 padding-left: 42px; |
|
158 font-size: 12px; |
|
159 font-weight: 400; |
|
160 outline: 0; |
|
161 |
|
162 &:hover { |
|
163 background-color: @navSubMenuLinkHoverBgColor; |
|
164 color: @navLinkHoverColor; |
|
165 } |
|
166 &.active { |
|
167 margin-left: 30px; |
|
168 padding-left: 12px; |
|
169 background-color: @navSubMenuActiveLinkBgColor; |
|
170 transition: background-color ease 2s; |
|
171 |
|
172 .minified & { |
|
173 margin-left: 0; |
|
174 } |
|
175 } |
|
176 } |
|
177 } |
|
178 ul { |
|
179 background: 0 0; |
|
180 padding: 0; |
|
181 |
|
182 li a { |
|
183 color: @navSubSubMenuLinkColor; |
|
184 padding: 8px 10px 8px 60px; |
|
185 font-size: 11px; |
|
186 |
|
187 &:hover { |
|
188 background-color: @navSubSubMenuLinkHoverBgColor; |
|
189 color: @navLinkHoverColor; |
|
190 } |
|
191 &.active { |
|
192 margin-left: 50px; |
|
193 padding-left: 10px; |
|
194 } |
|
195 } |
|
196 ul { |
|
197 li a { |
|
198 padding-left: 90px; |
|
199 |
|
200 &.active { |
|
201 margin-left: 80px; |
|
202 padding-left: 10px; |
|
203 } |
|
204 } |
|
205 ul { |
|
206 li a { |
|
207 padding-left: 110px; |
|
208 |
|
209 &.active { |
|
210 margin-left: 100px; |
|
211 padding-left: 10px; |
|
212 } |
|
213 } |
|
214 ul li a { |
|
215 padding-left: 130px; |
|
216 |
|
217 &.active { |
|
218 margin-left: 120px; |
|
219 padding-left: 10px; |
|
220 } |
|
221 } |
|
222 } |
|
223 } |
|
224 } |
|
225 b { |
|
226 color: @navSubSubMenuBoldColor; |
|
227 } |
|
228 } |
|
229 } |
|
230 |
|
231 >ul { |
|
232 >li { |
|
233 &:hover >ul::before, |
|
234 &:hover >ul >li::before { |
|
235 border-color: @navSubMenuLinkHoverBorderColor!important; |
|
236 } |
|
237 &:not(.active) { |
|
238 >a:hover { |
|
239 background-color: @navLinkActiveColor; |
|
240 } |
|
241 } |
|
242 &.active { |
|
243 >a { |
|
244 .minified & { |
|
245 background-color: @navSubMenuActiveLinkBgColor; |
|
246 transition: background-color ease 2s; |
|
247 } |
|
248 } |
|
249 } |
|
250 >a { |
|
251 >.badge.pull-right { |
|
252 margin-right: 15px; |
|
253 |
|
254 .minified & { |
|
255 position: absolute; |
|
256 margin-right: 0; |
|
257 top: 0.4em; |
|
258 right: 5px; |
|
259 } |
|
260 } |
|
261 b { |
|
262 position: absolute!important; |
|
263 visibility: hidden; |
|
264 right: 10px; |
|
265 top: 10px; |
|
266 } |
|
267 >i { |
|
268 margin-right: 5px; |
|
269 width: 15px; |
|
270 display: inline-block; |
|
271 text-align: center; |
|
272 position: relative; |
|
273 |
|
274 >em { |
|
275 font-size: 9px; |
|
276 display: block; |
|
277 padding: 2px; |
|
278 position: absolute; |
|
279 top: -8px; |
|
280 right: -6px; |
|
281 text-decoration: none; |
|
282 font-style: normal; |
|
283 background-color: @navSubSubMenuLinkEmBgColor; |
|
284 color: @navLinkHoverColor; |
|
285 min-width: 13px; |
|
286 border-radius: 50%; |
|
287 max-height: 13px; |
|
288 line-height: 8px; |
|
289 font-weight: 700; |
|
290 vertical-align: baseline; |
|
291 white-space: nowrap; |
|
292 text-align: center; |
|
293 border: 1px solid @navSubSubMenuLinkEmBorderColor; |
|
294 } |
|
295 } |
|
296 } |
|
297 &:not(.open), |
|
298 &.open:not(.active) { |
|
299 >a { |
|
300 &:hover b { |
|
301 visibility: visible; |
|
302 } |
|
303 } |
|
304 } |
|
305 >ul::before { |
|
306 content: ""; |
|
307 display: block; |
|
308 position: absolute; |
|
309 z-index: 1; |
|
310 left: 23px; |
|
311 top: 0; |
|
312 bottom: 13px; |
|
313 border-left: 1px solid @navSubSubMenuLinkPipeColor; |
|
314 } |
|
315 >ul >li >a, |
|
316 >ul >li >ul >li >a { |
|
317 padding-top: 5px; |
|
318 padding-bottom: 5px; |
|
319 } |
|
320 } |
|
321 ul { |
|
322 li { |
|
323 a i { |
|
324 font-size: 14px!important; |
|
325 width: 18px!important; |
|
326 text-align: center!important; |
|
327 } |
|
328 &::before { |
|
329 content: ""; |
|
330 display: block; |
|
331 position: absolute; |
|
332 width: 8px; |
|
333 left: 23px; |
|
334 top: 13px; |
|
335 border-top: 1px solid @navSubSubMenuLinkPipeColor; |
|
336 z-index: 1; |
|
337 } |
|
338 } |
|
339 ul li::before { |
|
340 content: ""; |
|
341 display: block; |
|
342 position: absolute; |
|
343 width: 18px; |
|
344 left: 10px; |
|
345 top: 17px; |
|
346 border-top: 1px solid transparent; |
|
347 } |
|
348 } |
|
349 } |
|
350 } |
|
351 |
|
352 .navbar-nav >li >a { |
|
353 @media (min-width: 768px) { |
|
354 padding-top: 17px; |
|
355 padding-bottom: 15px; |
|
356 } |
|
357 } |
|
358 |
|
359 .ui-menu { |
|
360 display: block; |
|
361 width: 155px; |
|
362 padding: 2px; |
|
363 -webkit-box-shadow: 0 2px 4px rgba(30, 30, 100, .25); |
|
364 box-shadow: 0 2px 4px rgba(30, 30, 100, .25); |
|
365 background: #fff; |
|
366 border: 1px solid rgba(0, 0, 0, .2); |
|
367 z-index: 1; |
|
368 list-style: none; |
|
369 margin: 0; |
|
370 margin-bottom: 2em; |
|
371 outline: 0; |
|
372 |
|
373 .ui-menu { |
|
374 margin-top: -3px; |
|
375 position: absolute; |
|
376 list-style: none; |
|
377 } |
|
378 .ui-menu-item { |
|
379 margin: 0; |
|
380 padding: 0; |
|
381 width: 100%; |
|
382 list-style: none; |
|
383 list-style-image: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7); |
|
384 |
|
385 a { |
|
386 text-decoration: none; |
|
387 display: block; |
|
388 padding: 2px .4em; |
|
389 line-height: 1.5; |
|
390 min-height: 0; |
|
391 font-weight: 400; |
|
392 |
|
393 &.ui-corner-all { |
|
394 border-radius: 0; |
|
395 } |
|
396 &.ui-state-active, |
|
397 &.ui-state-focus, |
|
398 &.ui-widget-content { |
|
399 font-weight: 700; |
|
400 margin: 0; |
|
401 background-color: #428BCA; |
|
402 border-color: #357EBD; |
|
403 color: #FFF; |
|
404 display: block; |
|
405 white-space: nowrap; |
|
406 } |
|
407 &.ui-state-active { |
|
408 padding: 1px .4em; |
|
409 } |
|
410 .ui-menu-icon { |
|
411 width: auto; |
|
412 height: auto; |
|
413 top: 0; |
|
414 left: auto; |
|
415 right: auto; |
|
416 bottom: auto; |
|
417 text-indent: 0; |
|
418 } |
|
419 } |
|
420 } |
|
421 .ui-menu-divider { |
|
422 margin: 5px -2px 5px -2px; |
|
423 height: 0; |
|
424 font-size: 0; |
|
425 line-height: 0; |
|
426 border-width: 1px 0 0; |
|
427 } |
|
428 .ui-state-disabled { |
|
429 margin: .4em 0 .2em!important; |
|
430 background: none!important; |
|
431 color: #999!important; |
|
432 font-weight: 400!important; |
|
433 cursor: default; |
|
434 line-height: 1.5; |
|
435 |
|
436 a { |
|
437 cursor: default; |
|
438 } |
|
439 } |
|
440 .ui-menu-icons { |
|
441 position: relative; |
|
442 |
|
443 .ui-menu-item a { |
|
444 position: relative; |
|
445 padding-left: 2em; |
|
446 } |
|
447 } |
|
448 .ui-icon { |
|
449 position: absolute; |
|
450 top: .2em; |
|
451 left: .2em; |
|
452 } |
|
453 .ui-menu-icon { |
|
454 position: static; |
|
455 float: right; |
|
456 } |
|
457 } |
|
458 |
|
459 .dropdown { |
|
460 &-menu { |
|
461 max-height: ~"calc(100vh - 200px)"; |
|
462 overflow-y: auto; |
|
463 |
|
464 >li { |
|
465 >a:hover { |
|
466 background-color: #e0e0e0; |
|
467 } |
|
468 li { |
|
469 a { |
|
470 display: block; |
|
471 padding: 0; |
|
472 clear: both; |
|
473 font-weight: normal; |
|
474 line-height: 1.42857143; |
|
475 color: #333; |
|
476 white-space: nowrap; |
|
477 } |
|
478 } |
|
479 } |
|
480 .open >& { |
|
481 -webkit-animation-name: flipInX; |
|
482 animation-name: flipInX; |
|
483 -webkit-animation-duration: .4s; |
|
484 animation-duration: .4s; |
|
485 -webkit-animation-fill-mode: both; |
|
486 animation-fill-mode: both; |
|
487 } |
|
488 .small { |
|
489 &.divider { |
|
490 margin: 3px 0; |
|
491 } |
|
492 } |
|
493 } |
|
494 &-menu-xs { |
|
495 min-width: 37px; |
|
496 |
|
497 >li >a { |
|
498 padding: 3px 10px; |
|
499 |
|
500 &:hover i { |
|
501 color: #fff!important; |
|
502 } |
|
503 } |
|
504 } |
|
505 &-submenu { |
|
506 position: relative; |
|
507 |
|
508 >.dropdown-menu { |
|
509 top: 0; |
|
510 left: 100%; |
|
511 margin-top: -6px; |
|
512 margin-left: -1px; |
|
513 } |
|
514 &:hover >.dropdown-menu { |
|
515 display: block; |
|
516 } |
|
517 >a:after { |
|
518 display: block; |
|
519 content: " "; |
|
520 float: right; |
|
521 width: 0; |
|
522 height: 0; |
|
523 border-color: transparent; |
|
524 border-style: solid; |
|
525 border-width: 5px 0 5px 5px; |
|
526 border-left-color: #bfbfbf; |
|
527 margin-top: 5px; |
|
528 margin-right: -10px; |
|
529 } |
|
530 &:hover >a:after { |
|
531 border-left-color: #fff; |
|
532 } |
|
533 &.pull-left { |
|
534 float: none; |
|
535 |
|
536 >.dropdown-menu { |
|
537 left: -100%; |
|
538 margin-left: 10px; |
|
539 } |
|
540 } |
|
541 } |
|
542 } |
|
543 |
|
544 #user-activity .ajax-dropdown { |
|
545 position: absolute; |
|
546 display: none; |
|
547 z-index: 1003; |
|
548 top: 48px; |
|
549 left: 16px; |
|
550 width: 344px; |
|
551 height: 452px; |
|
552 border-radius: 0; |
|
553 -webkit-box-shadow: 0 2px 4px rgba(30, 30, 100, .25); |
|
554 box-shadow: 0 2px 4px rgba(30, 30, 100, .25); |
|
555 padding: 10px; |
|
556 background: #fff; |
|
557 border: 1px solid #b3b3b3; |
|
558 |
|
559 @media only screen and (min-width:320px) and (max-width:479px) { |
|
560 width: 299px; |
|
561 height: 337px; |
|
562 left: 0; |
|
563 top: 49px; |
|
564 } |
|
565 &:after, |
|
566 &:before { |
|
567 bottom: 100%; |
|
568 border: solid transparent; |
|
569 content: " "; |
|
570 height: 0; |
|
571 width: 0; |
|
572 position: absolute; |
|
573 pointer-events: none; |
|
574 } |
|
575 &:before { |
|
576 border-color: rgba(131, 131, 131, 0); |
|
577 border-bottom-color: #838383; |
|
578 border-width: 8px; |
|
579 right: 8px; |
|
580 margin-left: -8px; |
|
581 |
|
582 @media only screen and (min-width:320px) and (max-width:479px) { |
|
583 margin-left: -14px; |
|
584 right: 13px; |
|
585 } |
|
586 } |
|
587 &:after { |
|
588 border-color: rgba(255, 255, 255, 0); |
|
589 border-bottom-color: #fff; |
|
590 border-width: 7px; |
|
591 right: 9px; |
|
592 margin-left: -7px; |
|
593 |
|
594 @media only screen and (min-width:320px) and (max-width:479px) { |
|
595 margin-left: -13px; |
|
596 right: 14px; |
|
597 } |
|
598 } |
|
599 >:last-child { |
|
600 font-size: 13px; |
|
601 display: block; |
|
602 padding: 5px 0; |
|
603 line-height: 20px; |
|
604 font-weight: 400; |
|
605 } |
|
606 >:first-child { |
|
607 margin: 0 0 3px; |
|
608 padding: 0 0 9px; |
|
609 } |
|
610 .fa-4x.fa-border { |
|
611 border-width: 3px; |
|
612 border-radius: 50%; |
|
613 display: block; |
|
614 margin: 0 auto; |
|
615 width: 80px; |
|
616 text-align: center; |
|
617 color: #D1D1D1; |
|
618 border-color: #D1D1D1; |
|
619 } |
|
620 .btn-group .btn { |
|
621 font-weight: 700; |
|
622 text-transform: capitalize; |
|
623 } |
|
624 .btn-group >:nth-child(2) { |
|
625 border-right-width: 0; |
|
626 border-left-width: 0; |
|
627 } |
|
628 .btn-group .btn:active { |
|
629 top: 0; |
|
630 left: 0; |
|
631 } |
|
632 .active + & { |
|
633 -webkit-animation-name: flipInY; |
|
634 animation-name: flipInY; |
|
635 -webkit-animation-duration: .7s; |
|
636 animation-duration: .7s; |
|
637 -webkit-animation-fill-mode: both; |
|
638 animation-fill-mode: both; |
|
639 } |
|
640 } |
|
641 |
|
642 .dropdown-large { |
|
643 position: static!important; |
|
644 } |
|
645 .dropdown-menu-large { |
|
646 margin-left: 16px; |
|
647 margin-right: 16px; |
|
648 padding: 20px 0; |
|
649 |
|
650 >li >ul { |
|
651 padding: 0; |
|
652 margin: 0; |
|
653 |
|
654 >li { |
|
655 list-style: none; |
|
656 |
|
657 >a { |
|
658 display: block; |
|
659 padding: 3px 20px; |
|
660 clear: both; |
|
661 font-weight: 400; |
|
662 line-height: 1.428571429; |
|
663 color: #333; |
|
664 white-space: normal; |
|
665 } |
|
666 } |
|
667 } |
|
668 >li ul >li >a:focus, |
|
669 >li ul >li >a:hover { |
|
670 text-decoration: none; |
|
671 color: #262626; |
|
672 background-color: #f5f5f5; |
|
673 } |
|
674 .disabled >a, |
|
675 .disabled >a:focus, |
|
676 .disabled >a:hover { |
|
677 color: #999; |
|
678 } |
|
679 .disabled >a:focus, |
|
680 .disabled >a:hover { |
|
681 text-decoration: none; |
|
682 background-color: transparent; |
|
683 background-image: none; |
|
684 filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); |
|
685 cursor: not-allowed; |
|
686 } |
|
687 .dropdown-header { |
|
688 color: #428bca; |
|
689 font-size: 18px; |
|
690 } |
|
691 |
|
692 @media (max-width:768px) { |
|
693 margin-left: 0; |
|
694 margin-right: 0; |
|
695 |
|
696 >li { |
|
697 margin-bottom: 30px; |
|
698 |
|
699 &:last-child { |
|
700 margin-bottom: 0; |
|
701 } |
|
702 } |
|
703 .dropdown-header { |
|
704 padding: 3px 15px!important; |
|
705 } |
|
706 } |
|
707 } |
|
708 |
|
709 |
|
710 .wijmo-wijmenu { |
|
711 padding: 0 20px; |
|
712 background-color: #222; |
|
713 background-repeat: repeat-x; |
|
714 background-image: -webkit-linear-gradient(top, #333, #222); |
|
715 background-image: -webkit-gradient(linear, top left, bottom left, from(#333), to(#222)); |
|
716 background-image: -webkit-linear-gradient(top, #333, #222); |
|
717 background-image: linear-gradient(top, #333, #222); |
|
718 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#222222', GradientType=0); |
|
719 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .25), inset 0 -1px 0 rgba(0, 0, 0, .1); |
|
720 box-shadow: 0 1px 3px rgba(0, 0, 0, .25), inset 0 -1px 0 rgba(0, 0, 0, .1); |
|
721 |
|
722 .ui-state-default .wijmo-wijmenu-text { |
|
723 color: #bfbfbf; |
|
724 } |
|
725 .ui-state-hover { |
|
726 background: #444; |
|
727 background: rgba(255, 255, 255, .05); |
|
728 |
|
729 .wijmo-wijmenu-text { |
|
730 color: #fff; |
|
731 } |
|
732 } |
|
733 .ui-widget-header h3 { |
|
734 position: relative; |
|
735 margin-top: 1px; |
|
736 padding: 0; |
|
737 } |
|
738 h3 a { |
|
739 color: #fff; |
|
740 display: block; |
|
741 float: left; |
|
742 font-size: 20px; |
|
743 font-weight: 200; |
|
744 line-height: 1; |
|
745 margin-left: -20px; |
|
746 margin-top: 1px; |
|
747 padding: 8px 20px 12px; |
|
748 |
|
749 &:hover { |
|
750 background-color: rgba(255, 255, 255, .05); |
|
751 color: #fff; |
|
752 text-decoration: none; |
|
753 } |
|
754 } |
|
755 .ui-widget-header { |
|
756 border: 0; |
|
757 } |
|
758 .wijmo-wijmenu-parent .wijmo-wijmenu-child { |
|
759 padding: .3em 0; |
|
760 } |
|
761 .wijmo-wijmenu-item { |
|
762 margin: 0; |
|
763 border: 0; |
|
764 |
|
765 .wijmo-wijmenu-child { |
|
766 background: #333; |
|
767 border: 0; |
|
768 margin: 0; |
|
769 padding: 6px 0; |
|
770 width: 160px; |
|
771 border-radius: 0 0 6px 6px; |
|
772 -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, .2); |
|
773 box-shadow: 0 2px 4px rgba(0, 0, 0, .2); |
|
774 } |
|
775 } |
|
776 a.wijmo-wijmenu-link { |
|
777 margin: 0; |
|
778 line-height: 19px; |
|
779 padding: 10px 10px 11px; |
|
780 border: 0; |
|
781 border-radius: 0; |
|
782 } |
|
783 .wijmo-wijmenu-child .wijmo-wijmenu-link { |
|
784 display: block; |
|
785 float: none; |
|
786 padding: 4px 15px; |
|
787 width: auto; |
|
788 } |
|
789 .wijmo-wijmenu-child .wijmo-wijmenu-text { |
|
790 float: none; |
|
791 } |
|
792 .wijmo-wijmenu-item { |
|
793 .wijmo-wijmenu-child .ui-state-hover { |
|
794 background: #191919; |
|
795 } |
|
796 .wijmo-wijmenu-separator { |
|
797 padding: 5px 0; |
|
798 background-image: none; |
|
799 background-color: #222; |
|
800 border-top: 1px solid #444; |
|
801 border-bottom: 0; |
|
802 border-left: 0; |
|
803 border-right: 0; |
|
804 } |
|
805 input { |
|
806 -moz-transition: none 0s ease 0s; |
|
807 background-color: rgba(255, 255, 255, .3); |
|
808 border: 1px solid #111; |
|
809 border-radius: 4px; |
|
810 -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .1) inset, 0 1px 0 rgba(255, 255, 255, .25); |
|
811 box-shadow: 0 1px 2px rgba(0, 0, 0, .1) inset, 0 1px 0 rgba(255, 255, 255, .25); |
|
812 color: rgba(255, 255, 255, .75); |
|
813 font-family: Ubuntu, Helvetica, Arial, sans-serif; |
|
814 line-height: 1; |
|
815 margin: 5px 10px 0; |
|
816 padding: 4px 9px; |
|
817 width: 100px; |
|
818 |
|
819 &:hover { |
|
820 background-color: rgba(255, 255, 255, .5); |
|
821 color: #fff; |
|
822 } |
|
823 &:focus { |
|
824 background-color: #fff; |
|
825 border: 0 none; |
|
826 -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, .15); |
|
827 box-shadow: 0 0 3px rgba(0, 0, 0, .15); |
|
828 color: #404040; |
|
829 outline: 0 none; |
|
830 padding: 5px 10px; |
|
831 text-shadow: 0 1px 0 #fff; |
|
832 } |
|
833 } |
|
834 } |
|
835 .ui-state-default { |
|
836 text-shadow: none; |
|
837 -webkit-box-shadow: none; |
|
838 box-shadow: none; |
|
839 color: #bfbfbf; |
|
840 -webkit-filter: none; |
|
841 filter: none; |
|
842 } |
|
843 } |