_dropdown.scss
1.79 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
.dropdown-menu {
border: 0;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
.divider {
background-color: rgba(0, 0, 0, .12);
}
li > a{
font-size: $mdb-dropdown-font-size;
padding: 10px 20px;
margin: 0 5px;
border-radius: $border-radius-small;
@include transition($fast-transition-time, $transition-linear);
&:hover,
&:focus {
@include shadow-8dp();
}
}
&.dropdown-with-icons{
li > a{
padding: 12px 20px 12px 12px;
.material-icons{
vertical-align: middle;
font-size: 24px;
position: relative;
margin-top: -4px;
top: 1px;
margin-right: 12px;
opacity: .5;
}
}
}
li {
position: relative;
a:hover,
a:focus,
a:active {
background-color: $brand-primary;
color: #FFFFFF;
}
}
.divider{
margin: 5px 0;
}
.navbar &,
.navbar.navbar-default &{
li{
a:hover,
a:focus,
a:active {
background-color: $brand-primary;
color: #FFFFFF;
@include shadow-big-color($brand-primary);
}
}
}
}
.navbar-nav > li > .dropdown-menu,
.dropdown .dropdown-menu,
.dropdown-menu.bootstrap-datetimepicker-widget{
@include transition($fast-transition-time, $transition-linear);
margin-top: -20px;
visibility: hidden;
display: block;
@include opacity(0);
}
.navbar-nav > li.open > .dropdown-menu,
.dropdown.open .dropdown-menu,
.dropdown-menu.bootstrap-datetimepicker-widget.open{
@include opacity(1);
visibility: visible;
margin-top: 0px;
}