Administrator
2022-09-14 58d006e05dcf2a20d0ec5367dd03d66a61db6849
提交 | 用户 | 时间
58d006 1 @highlight-menu-border-color: #C8D8E2;
A 2 @highlight-menu-active-bg: #F2F6F9;
3 @highlight-h-sidebar-color: lighten(#4D96CB, 10%);
4
5
6 .enable_highlight_active_no_skin() when(@enable-highlight-active = true) {
7  //hide submenu active item caret
8  .nav-list li.highlight li.active > a,
9  .nav-list li li.highlight.active > a {
10     &:after , &:before {
11         display: none;// !important;
12     }
13  }
14
15  //show first-level active item caret
16  .nav-list > li.highlight.active > a {
17     &:after, &:before {
18         display: block;// !important;
19     }
20  }
21
22  
23
24
25 //only for default body.no-skin
26 .no-skin {
27
28 .nav-list > li.highlight {
29  &:hover , &.active {
30     border-color: @highlight-menu-border-color;
31     + li {
32         border-top-color: @highlight-menu-border-color;
33     }
34     > a {
35         background-color: #FFF;
36     }
37  }
38
39  &.active {
40     &:after {
41         display: none;
42     }
43     &:before {
44         display: block;
45         background-color: darken(@nav-item-hover-indicator , 5%);
46     }
47  
48     > a  {
49         background-color: @highlight-menu-active-bg !important;
50         &:before, &:after {
51             display: block;
52             content: "";
53             position: absolute;
54
55             top: -1px;
56             right: -1*ceil(@nav-item-height / 4);
57             bottom: auto;
58             z-index: 1;
59
60             border-style: solid;
61             border-width: ceil(@nav-item-height / 2) 0 ceil(@nav-item-height / 2)+1 ceil(@nav-item-height / 4);
62             border-color: transparent;
63         }
64         &:before {
65             border-left-color: darken(@highlight-menu-border-color, 12%);
66             -moz-border-left-colors: darken(@highlight-menu-border-color, 12%);
67             
68             right: -1*ceil(@nav-item-height / 4) - 1;
69         }
70         &:after {
71             border-left-color: @highlight-menu-active-bg;
72             -moz-border-left-colors: @highlight-menu-active-bg;
73         }
74     }
75  }
76 }
77
78
79
80
81 //don't display the active item caret for submenu items, show just for the parent .nav-list > li item
82 .nav-list li li.highlight.active > a {
83     background-color: @highlight-menu-active-bg;
84 }
85 .nav-list li li.highlight.active.open > a {
86     background-color: #FFF;
87     &:hover {
88         background-color: @submenu-item-background-hover;
89     }
90 }
91
92
93
94 .enable_horizontal_menu_highlight_no_skin() when(@enable-horizontal-menu = true) {
95  @media (min-width: @grid-float-breakpoint) {
96  .sidebar.h-sidebar {
97     .nav-list > li.highlight.active > a:after {
98         display: block;
99         content: "";
100         position: absolute;
101         
102         left: 0;
103         top: auto;
104         right: auto;
105         bottom: -2px;
106         
107         left: 50%;
108         margin-left: -7px;
109         
110         border-color: transparent;
111         -moz-border-right-colors: none;
112         -moz-border-left-colors: none;
113         -moz-border-top-colors: none;
114
115         border-width: 8px 7px;
116         border-bottom-color: #FFF;
117         -moz-border-bottom-colors: #FFF;
118      }
119      .nav-list > li.highlight.active > a:before {
120          display: block;
121         content:"";
122         position: absolute;
123         
124         display: block;
125         left: 0;
126         top: auto;
127         right: auto;
128         
129         bottom: -1px;
130         
131         left: 50%;
132         margin-left: -7px;
133         
134         border-width: 8px;
135
136         border-color: transparent;
137         -moz-border-right-colors: none;
138         -moz-border-left-colors: none;
139         -moz-border-top-colors: none;
140
141         border-bottom-color: @highlight-h-sidebar-color;
142         -moz-border-bottom-colors: @highlight-h-sidebar-color;
143      }
144      
145      .nav-list > li.highlight.active:hover > a,  .nav-list > li.highlight.active.hover-show > a {
146         &:after, &:before {
147             display: none;
148         }
149      }
150   }
151
152  }
153 }
154  .enable_horizontal_menu_highlight_no_skin();
155
156 }
157
158
159 .enable_compact_menu_highlight_no_skin() when (@enable-compact-menu = true) {
160  @media (min-width: @screen-compact-menu) {
161   .sidebar.compact .nav-list li.highlight.active > a {
162     &:after , &:before {
163         display: none;// !important;
164     }
165   }
166   .sidebar.compact.menu-min .nav-list li.highlight.active > a {
167     &:after , &:before {
168         display: block;// !important;
169     }
170   }
171  }
172
173  .enable_horizontal_menu_highlight_compact() when(@enable-horizontal-menu = true) {
174   @media (min-width: @grid-float-breakpoint) {
175    .sidebar.h-sidebar {
176     .nav-list li.highlight.active > a {
177         &:after , &:before {
178             display: block;// !important;
179             border-width: 8px !important;//to override .rtl .menu-min
180             
181             -moz-border-left-colors: none !important;//
182             -moz-border-right-colors: none !important;
183             
184             border-left-color: transparent !important;
185             border-right-color: transparent !important;
186         }
187      }
188     .nav-list > li.highlight.active:hover > a {
189         &:after, &:before {
190             display: none !important;
191         }
192      }
193    }
194   }
195  }
196  .enable_horizontal_menu_highlight_compact();
197
198
199 }
200 .enable_compact_menu_highlight_no_skin();
201
202
203 .menu_min_highlight_no_skin() {
204     .nav-list > li.highlight.active > a {
205         &:after , &:before {
206             display: block;
207             top: -1px;
208             border-width: ceil(@nav-item-height / 2) 0 ceil(@nav-item-height / 2)+1 ceil(@nav-item-height / 4);
209         }
210     }
211 }
212
213
214 .enable_sidebar_collapse_highlight_no_skin() when (@enable-sidebar-collapse = true) {
215  .sidebar.menu-min, .sidebar.menu-min.compact {
216     .menu_min_highlight_no_skin();
217  }
218 }
219 //.enable_sidebar_collapse_highlight_no_skin();
220
221 .enable_minimized_responsive_menu_highlight_no_skin() when (@enable-minimized-responsive-menu = true) {
222  @media (max-width: @grid-float-breakpoint-max) {
223     .sidebar.responsive-min, .sidebar.responsive-min.compact {
224         .menu_min_highlight_no_skin();
225     }
226  }
227 }
228 //.enable_minimized_responsive_menu_highlight_no_skin();
229
230
231  
232  //hide active item caret inside scrollbars
233  .sidebar-scroll {
234    .nav-list > li.active.highlight > a {
235     &:after, &:before {
236         display: none !important;
237     }
238    }
239  }
240
241 }
242
243 .enable_highlight_active_no_skin();