1 | .menu_min() {
|
---|
2 | &.sidebar {
|
---|
3 | width:@sidebar-min-width;
|
---|
4 | &:before {
|
---|
5 | width:@sidebar-min-width;
|
---|
6 | }
|
---|
7 | + .main-content {
|
---|
8 | margin-left:(@sidebar-min-width);
|
---|
9 | .breadcrumbs.fixed , .breadcrumbs.breadcrumbs-fixed { left:(@sidebar-min-width); }
|
---|
10 | }
|
---|
11 | }
|
---|
12 |
|
---|
13 | .nav-list a {
|
---|
14 | .badge , .label {
|
---|
15 | position:relative;
|
---|
16 | top:-1px;
|
---|
17 | right:auto;
|
---|
18 | left:4px;
|
---|
19 | }
|
---|
20 | }
|
---|
21 |
|
---|
22 | .nav-list .submenu .submenu a {
|
---|
23 | .badge , .label {
|
---|
24 | top:0;
|
---|
25 | }
|
---|
26 | }
|
---|
27 |
|
---|
28 |
|
---|
29 | .nav-list > li {
|
---|
30 | > a {
|
---|
31 | position:relative;
|
---|
32 | > .menu-text {
|
---|
33 | display:none;
|
---|
34 |
|
---|
35 | position:absolute;
|
---|
36 | left:(@sidebar-min-width - 1);
|
---|
37 | top:-2px;
|
---|
38 | width:(@sidebar-width - 16);
|
---|
39 | height:40px;
|
---|
40 |
|
---|
41 | line-height:38px;
|
---|
42 | background-color:@menumin-bg;
|
---|
43 | z-index:121;
|
---|
44 |
|
---|
45 | .box-shadow(@menumin-shadow);
|
---|
46 | border:1px solid @menumin-border;
|
---|
47 |
|
---|
48 | padding-left:12px;
|
---|
49 | }
|
---|
50 | &.dropdown-toggle > .menu-text {
|
---|
51 | .box-shadow(none);
|
---|
52 | border:none;
|
---|
53 | top:-1px; left:@sidebar-min-width;
|
---|
54 | width:(@sidebar-width - 16);
|
---|
55 | border-bottom:1px solid @menumin-text-border;
|
---|
56 | }
|
---|
57 | .arrow {
|
---|
58 | display:none;
|
---|
59 | }
|
---|
60 |
|
---|
61 | &:hover:before {/* the right side border on hover */
|
---|
62 | width:2px;
|
---|
63 | }
|
---|
64 | }
|
---|
65 |
|
---|
66 | &:hover > a {
|
---|
67 | color:@menu-focus-color;
|
---|
68 | > .menu-text {
|
---|
69 | display:block;
|
---|
70 | }
|
---|
71 | }
|
---|
72 | &.active > a > .menu-text {
|
---|
73 | border-left-color:@menu-focus-color;
|
---|
74 | }
|
---|
75 | &.open > a {
|
---|
76 | background-color:@menu-open-bg;
|
---|
77 | color:@menu-color;
|
---|
78 | }
|
---|
79 | &.open.active > a {
|
---|
80 | background-color:@menu-active-bg;
|
---|
81 | }
|
---|
82 | &.open:hover > a {
|
---|
83 | color:@menu-focus-color;
|
---|
84 | }
|
---|
85 | &.active > a {
|
---|
86 | color:@menu-active-color;
|
---|
87 | }
|
---|
88 |
|
---|
89 | &.active > a:after { /* the caret */
|
---|
90 | border-width:10px 6px;
|
---|
91 | top:8px;
|
---|
92 | }
|
---|
93 | &.active.open > a:after {
|
---|
94 | display:block;
|
---|
95 | }
|
---|
96 | &.active.open li.active > a:after {
|
---|
97 | display:none;
|
---|
98 | }
|
---|
99 |
|
---|
100 |
|
---|
101 |
|
---|
102 | > .submenu {
|
---|
103 | background:@submenu-bg;
|
---|
104 | position:absolute; z-index:120;
|
---|
105 | left:(@sidebar-min-width - 1); top:-2px;
|
---|
106 |
|
---|
107 | width:(@sidebar-width - 14);
|
---|
108 | border:1px solid @menumin-border;
|
---|
109 |
|
---|
110 | .box-shadow(@menumin-shadow);
|
---|
111 |
|
---|
112 | padding-top:40px;
|
---|
113 | padding-bottom:2px;
|
---|
114 |
|
---|
115 | display:none !important;
|
---|
116 |
|
---|
117 | &:before {
|
---|
118 | /* hide the tree like submenu in minimized mode */
|
---|
119 | display:none;
|
---|
120 | }
|
---|
121 |
|
---|
122 | li {
|
---|
123 | &:before {
|
---|
124 | display:none;
|
---|
125 | }
|
---|
126 |
|
---|
127 | > a {
|
---|
128 | //border-left:none;
|
---|
129 | margin-left:0;
|
---|
130 | padding-left:24px;
|
---|
131 | > [class*="icon-"]:first-child {
|
---|
132 | left:4px;
|
---|
133 | }
|
---|
134 | }
|
---|
135 |
|
---|
136 | }
|
---|
137 | }
|
---|
138 |
|
---|
139 |
|
---|
140 |
|
---|
141 | &:hover > .submenu {
|
---|
142 | display:block !important;
|
---|
143 | }
|
---|
144 | &.active > .submenu {
|
---|
145 | border-left-color:@menu-active-color;
|
---|
146 | }
|
---|
147 | }
|
---|
148 |
|
---|
149 |
|
---|
150 |
|
---|
151 |
|
---|
152 |
|
---|
153 | //sidebar shortcuts
|
---|
154 | .sidebar-shortcuts {
|
---|
155 | position:relative;
|
---|
156 | }
|
---|
157 | .sidebar-shortcuts-mini {
|
---|
158 | display:block;
|
---|
159 | }
|
---|
160 |
|
---|
161 | .sidebar-shortcuts-large {
|
---|
162 | display:none;
|
---|
163 | position:absolute;
|
---|
164 | z-index:20;
|
---|
165 | top:-1px;
|
---|
166 | left:@sidebar-min-width - 1;
|
---|
167 |
|
---|
168 | width:(@sidebar-width - 8);
|
---|
169 |
|
---|
170 | padding:0 2px 1px;
|
---|
171 |
|
---|
172 | background-color:@submenu-bg;
|
---|
173 | .box-shadow(@menumin-shadow);
|
---|
174 | border:1px solid @menumin-border;
|
---|
175 | }
|
---|
176 | .sidebar-shortcuts:hover .sidebar-shortcuts-large{
|
---|
177 | display:block;
|
---|
178 | }
|
---|
179 |
|
---|
180 | .sidebar-collapse { /* minimized collapse button */
|
---|
181 | &:before {
|
---|
182 | left:5px; right:5px;
|
---|
183 | }
|
---|
184 | > [class*="icon-"] {
|
---|
185 | font-size:13px;
|
---|
186 | padding:0 4px;
|
---|
187 | line-height:15px;
|
---|
188 |
|
---|
189 | border-width:1px;
|
---|
190 | border-color:darken(@menumin-icon-border, 5%);
|
---|
191 | }
|
---|
192 | }
|
---|
193 |
|
---|
194 |
|
---|
195 |
|
---|
196 |
|
---|
197 | .nav-list > li > .submenu {
|
---|
198 | li > .submenu > li {
|
---|
199 | > a {/*3rd level*/
|
---|
200 | margin-left:0px;
|
---|
201 | padding-left:30px;
|
---|
202 | }
|
---|
203 | > .submenu > li > a {/*4th level*/
|
---|
204 | margin-left:0px;
|
---|
205 | padding-left:45px;
|
---|
206 | }
|
---|
207 | }
|
---|
208 |
|
---|
209 | li.active > a:after {
|
---|
210 | display:none;
|
---|
211 | }
|
---|
212 | }
|
---|
213 |
|
---|
214 |
|
---|
215 | .nav-list li.active.open > .submenu > li.active > a:after {
|
---|
216 | display: none;
|
---|
217 | }
|
---|
218 | }
|
---|
219 |
|
---|
220 |
|
---|
221 |
|
---|
222 |
|
---|
223 | .menu-min {
|
---|
224 | .menu_min();
|
---|
225 | }
|
---|