Show More
@@ -1,752 +1,753 b'' | |||||
1 | // navigation.less |
|
1 | // navigation.less | |
2 | // For use in RhodeCode applications; |
|
2 | // For use in RhodeCode applications; | |
3 | // see style guide documentation for guidelines. |
|
3 | // see style guide documentation for guidelines. | |
4 |
|
4 | |||
5 | // TOP MAIN DARK NAVIGATION |
|
5 | // TOP MAIN DARK NAVIGATION | |
6 |
|
6 | |||
7 | .header .main_nav.horizontal-list { |
|
7 | .header .main_nav.horizontal-list { | |
8 | float: right; |
|
8 | float: right; | |
9 | color: @grey4; |
|
9 | color: @grey4; | |
10 | > li { |
|
10 | > li { | |
11 | a { |
|
11 | a { | |
12 | color: @grey4; |
|
12 | color: @grey4; | |
13 | } |
|
13 | } | |
14 | } |
|
14 | } | |
15 | } |
|
15 | } | |
16 |
|
16 | |||
17 | // HEADER NAVIGATION |
|
17 | // HEADER NAVIGATION | |
18 |
|
18 | |||
19 | .horizontal-list { |
|
19 | .horizontal-list { | |
20 | display: block; |
|
20 | display: block; | |
21 | margin: 0; |
|
21 | margin: 0; | |
22 | padding: 0; |
|
22 | padding: 0; | |
23 | -webkit-padding-start: 0; |
|
23 | -webkit-padding-start: 0; | |
24 | text-align: left; |
|
24 | text-align: left; | |
25 | font-size: @navigation-fontsize; |
|
25 | font-size: @navigation-fontsize; | |
26 | color: @grey6; |
|
26 | color: @grey6; | |
27 | z-index:10; |
|
27 | z-index:10; | |
28 |
|
28 | |||
29 | li { |
|
29 | li { | |
30 | line-height: 1em; |
|
30 | line-height: 1em; | |
31 | list-style-type: none; |
|
31 | list-style-type: none; | |
32 | margin: 0 20px 0 0; |
|
32 | margin: 0 20px 0 0; | |
33 |
|
33 | |||
34 | a { |
|
34 | a { | |
35 | padding: 0 .5em; |
|
35 | padding: 0 .5em; | |
36 |
|
36 | |||
37 | &.menu_link_notifications { |
|
37 | &.menu_link_notifications { | |
38 | .pill(7px,@rcblue); |
|
38 | .pill(7px,@rcblue); | |
39 | display: inline; |
|
39 | display: inline; | |
40 | margin: 0 7px 0 .7em; |
|
40 | margin: 0 7px 0 .7em; | |
41 | font-size: @basefontsize; |
|
41 | font-size: @basefontsize; | |
42 | color: white; |
|
42 | color: white; | |
43 |
|
43 | |||
44 | &.empty { |
|
44 | &.empty { | |
45 | background-color: @grey4; |
|
45 | background-color: @grey4; | |
46 | } |
|
46 | } | |
47 |
|
47 | |||
48 | &:hover { |
|
48 | &:hover { | |
49 | background-color: @rcdarkblue; |
|
49 | background-color: @rcdarkblue; | |
50 | } |
|
50 | } | |
51 | } |
|
51 | } | |
52 | } |
|
52 | } | |
53 | .pill_container { |
|
53 | .pill_container { | |
54 | margin: 1.25em 0px 0px 0px; |
|
54 | margin: 1.25em 0px 0px 0px; | |
55 | float: right; |
|
55 | float: right; | |
56 | } |
|
56 | } | |
57 |
|
57 | |||
58 | &#quick_login_li { |
|
58 | &#quick_login_li { | |
59 | &:hover { |
|
59 | &:hover { | |
60 | color: @grey5; |
|
60 | color: @grey5; | |
61 | } |
|
61 | } | |
62 |
|
62 | |||
63 | a.menu_link_notifications { |
|
63 | a.menu_link_notifications { | |
64 | color: white; |
|
64 | color: white; | |
65 | } |
|
65 | } | |
66 |
|
66 | |||
67 | .user { |
|
67 | .user { | |
68 | padding-bottom: 10px; |
|
68 | padding-bottom: 10px; | |
69 | } |
|
69 | } | |
70 | } |
|
70 | } | |
71 |
|
71 | |||
72 | &:before { content: none; } |
|
72 | &:before { content: none; } | |
73 |
|
73 | |||
74 | &:last-child { |
|
74 | &:last-child { | |
75 | .menulabel { |
|
75 | .menulabel { | |
76 | padding-right: 0; |
|
76 | padding-right: 0; | |
77 | border-right: none; |
|
77 | border-right: none; | |
78 |
|
78 | |||
79 | .show_more { |
|
79 | .show_more { | |
80 | padding-right: 0; |
|
80 | padding-right: 0; | |
81 | } |
|
81 | } | |
82 | } |
|
82 | } | |
83 |
|
83 | |||
84 | &> a { |
|
84 | &> a { | |
85 | border-bottom: none; |
|
85 | border-bottom: none; | |
86 | } |
|
86 | } | |
87 | } |
|
87 | } | |
88 |
|
88 | |||
89 | &.open { |
|
89 | &.open { | |
90 |
|
90 | |||
91 | a { |
|
91 | a { | |
92 | color: white; |
|
92 | color: white; | |
93 | } |
|
93 | } | |
94 | } |
|
94 | } | |
95 |
|
95 | |||
96 | &:focus { |
|
96 | &:focus { | |
97 | outline: none; |
|
97 | outline: none; | |
98 | } |
|
98 | } | |
99 |
|
99 | |||
100 | ul li { |
|
100 | ul li { | |
101 | display: block; |
|
101 | display: block; | |
102 |
|
102 | |||
103 | &:last-child> a { |
|
103 | &:last-child> a { | |
104 | border-bottom: none; |
|
104 | border-bottom: none; | |
105 | } |
|
105 | } | |
106 |
|
106 | |||
107 | ul li:last-child a { |
|
107 | ul li:last-child a { | |
108 | /* we don't expect more then 3 levels of submenu and the third |
|
108 | /* we don't expect more then 3 levels of submenu and the third | |
109 | level can have different html structure */ |
|
109 | level can have different html structure */ | |
110 | border-bottom: none; |
|
110 | border-bottom: none; | |
111 | } |
|
111 | } | |
112 | } |
|
112 | } | |
113 | } |
|
113 | } | |
114 |
|
114 | |||
115 | > li { |
|
115 | > li { | |
116 | float: left; |
|
116 | float: left; | |
117 | display: block; |
|
117 | display: block; | |
118 | padding: 0; |
|
118 | padding: 0; | |
119 |
|
119 | |||
120 | > a, |
|
120 | > a, | |
121 | &.has_select2 a { |
|
121 | &.has_select2 a { | |
122 | display: block; |
|
122 | display: block; | |
123 | padding: 10px 0; |
|
123 | padding: 10px 0; | |
124 | } |
|
124 | } | |
125 |
|
125 | |||
126 | .menulabel { |
|
126 | .menulabel { | |
127 | line-height: 1em; |
|
127 | line-height: 1em; | |
128 | // for this specifically we do not use a variable |
|
128 | // for this specifically we do not use a variable | |
129 | } |
|
129 | } | |
130 |
|
130 | |||
131 | .pr_notifications { |
|
131 | .pr_notifications { | |
132 | padding-left: .5em; |
|
132 | padding-left: .5em; | |
133 | } |
|
133 | } | |
134 |
|
134 | |||
135 | .pr_notifications + .menulabel { |
|
135 | .pr_notifications + .menulabel { | |
136 | display:inline; |
|
136 | display:inline; | |
137 | padding-left: 0; |
|
137 | padding-left: 0; | |
138 | } |
|
138 | } | |
139 |
|
139 | |||
140 | &:hover, |
|
140 | &:hover, | |
141 | &.open, |
|
141 | &.open, | |
142 | &.active { |
|
142 | &.active { | |
143 | a { |
|
143 | a { | |
144 | color: @rcblue; |
|
144 | color: @rcblue; | |
145 | } |
|
145 | } | |
146 | } |
|
146 | } | |
147 | } |
|
147 | } | |
148 |
|
148 | |||
149 | pre { |
|
149 | pre { | |
150 | margin: 0; |
|
150 | margin: 0; | |
151 | padding: 0; |
|
151 | padding: 0; | |
152 | } |
|
152 | } | |
153 |
|
153 | |||
154 | .select2-container, |
|
154 | .select2-container, | |
155 | .menulink.childs { |
|
155 | .menulink.childs { | |
156 | position: relative; |
|
156 | position: relative; | |
157 | } |
|
157 | } | |
158 |
|
158 | |||
159 | #quick_login { |
|
159 | #quick_login { | |
160 |
|
160 | |||
161 | li a { |
|
161 | li a { | |
162 | padding: .5em 0; |
|
162 | padding: .5em 0; | |
163 | border-bottom: none; |
|
163 | border-bottom: none; | |
164 | color: @grey2; |
|
164 | color: @grey2; | |
165 |
|
165 | |||
166 | &:hover { color: @grey1; } |
|
166 | &:hover { color: @grey1; } | |
167 | } |
|
167 | } | |
168 | } |
|
168 | } | |
169 |
|
169 | |||
170 | #quick_login_link { |
|
170 | #quick_login_link { | |
171 | display: inline-block; |
|
171 | display: inline-block; | |
172 |
|
172 | |||
173 | .gravatar { |
|
173 | .gravatar { | |
174 | border: 1px solid @grey5; |
|
174 | border: 1px solid @grey5; | |
175 | } |
|
175 | } | |
176 |
|
176 | |||
177 | .gravatar-login { |
|
177 | .gravatar-login { | |
178 | height: 20px; |
|
178 | height: 20px; | |
179 | width: 20px; |
|
179 | width: 20px; | |
180 | margin: -8px 0; |
|
180 | margin: -8px 0; | |
181 | padding: 0; |
|
181 | padding: 0; | |
182 | } |
|
182 | } | |
183 |
|
183 | |||
184 | &:hover .user { |
|
184 | &:hover .user { | |
185 | color: @grey6; |
|
185 | color: @grey6; | |
186 | } |
|
186 | } | |
187 | } |
|
187 | } | |
188 | } |
|
188 | } | |
189 | .header .horizontal-list { |
|
189 | .header .horizontal-list { | |
190 |
|
190 | |||
191 | li { |
|
191 | li { | |
192 |
|
192 | |||
193 | &#quick_login_li { |
|
193 | &#quick_login_li { | |
194 | padding-left: .5em; |
|
194 | padding-left: .5em; | |
195 |
|
195 | |||
196 | &:hover #quick_login_link { |
|
196 | &:hover #quick_login_link { | |
197 | color: inherit; |
|
197 | color: inherit; | |
198 | } |
|
198 | } | |
199 |
|
199 | |||
200 | .menu_link_user { |
|
200 | .menu_link_user { | |
201 | padding: 0 2px; |
|
201 | padding: 0 2px; | |
202 | } |
|
202 | } | |
203 | } |
|
203 | } | |
204 | list-style-type: none; |
|
204 | list-style-type: none; | |
205 | } |
|
205 | } | |
206 |
|
206 | |||
207 | > li { |
|
207 | > li { | |
208 |
|
208 | |||
209 | a { |
|
209 | a { | |
210 | padding: 18px 0 12px 0; |
|
210 | padding: 18px 0 12px 0; | |
211 | color: @nav-grey; |
|
211 | color: @nav-grey; | |
212 |
|
212 | |||
213 | &.menu_link_notifications { |
|
213 | &.menu_link_notifications { | |
214 | padding: 1px 8px; |
|
214 | padding: 1px 8px; | |
215 | } |
|
215 | } | |
216 | } |
|
216 | } | |
217 |
|
217 | |||
218 | &:hover, |
|
218 | &:hover, | |
219 | &.open, |
|
219 | &.open, | |
220 | &.active { |
|
220 | &.active { | |
221 | .pill_container a { |
|
221 | .pill_container a { | |
222 | // don't select text for the pill container, it has it' own |
|
222 | // don't select text for the pill container, it has it' own | |
223 | // hover behaviour |
|
223 | // hover behaviour | |
224 | color: @nav-grey; |
|
224 | color: @nav-grey; | |
225 | } |
|
225 | } | |
226 | } |
|
226 | } | |
227 |
|
227 | |||
228 | &:hover, |
|
228 | &:hover, | |
229 | &.open, |
|
229 | &.open, | |
230 | &.active { |
|
230 | &.active { | |
231 | a { |
|
231 | a { | |
232 | color: @grey6; |
|
232 | color: @grey6; | |
233 | } |
|
233 | } | |
234 | } |
|
234 | } | |
235 |
|
235 | |||
236 | .select2-dropdown-open a { |
|
236 | .select2-dropdown-open a { | |
237 | color: @grey6; |
|
237 | color: @grey6; | |
238 | } |
|
238 | } | |
239 |
|
239 | |||
240 | .repo-switcher { |
|
240 | .repo-switcher { | |
241 | padding-left: 0; |
|
241 | padding-left: 0; | |
242 |
|
242 | |||
243 | .menulabel { |
|
243 | .menulabel { | |
244 | padding-left: 0; |
|
244 | padding-left: 0; | |
245 | } |
|
245 | } | |
246 | } |
|
246 | } | |
247 | } |
|
247 | } | |
248 |
|
248 | |||
249 | li ul li { |
|
249 | li ul li { | |
250 | background-color:@grey2; |
|
250 | background-color:@grey2; | |
251 |
|
251 | |||
252 | a { |
|
252 | a { | |
253 | padding: .5em 0; |
|
253 | padding: .5em 0; | |
254 | border-bottom: @border-thickness solid @border-default-color; |
|
254 | border-bottom: @border-thickness solid @border-default-color; | |
255 | color: @grey6; |
|
255 | color: @grey6; | |
256 | } |
|
256 | } | |
257 |
|
257 | |||
258 | &:last-child a, &.last a{ |
|
258 | &:last-child a, &.last a{ | |
259 | border-bottom: none; |
|
259 | border-bottom: none; | |
260 | } |
|
260 | } | |
261 |
|
261 | |||
262 | &:hover { |
|
262 | &:hover { | |
263 | background-color: @grey3; |
|
263 | background-color: @grey3; | |
264 | } |
|
264 | } | |
265 | } |
|
265 | } | |
266 |
|
266 | |||
267 | .submenu { |
|
267 | .submenu { | |
268 | margin-top: 5px; |
|
268 | margin-top: 5px; | |
269 | } |
|
269 | } | |
270 | } |
|
270 | } | |
271 |
|
271 | |||
272 | // SUBMENUS |
|
272 | // SUBMENUS | |
273 | .navigation .submenu { |
|
273 | .navigation .submenu { | |
274 | display: none; |
|
274 | display: none; | |
275 | } |
|
275 | } | |
276 |
|
276 | |||
277 | .navigation li.open { |
|
277 | .navigation li.open { | |
278 | .submenu { |
|
278 | .submenu { | |
279 | display: block; |
|
279 | display: block; | |
280 | } |
|
280 | } | |
281 | } |
|
281 | } | |
282 |
|
282 | |||
283 | .navigation li:last-child .submenu { |
|
283 | .navigation li:last-child .submenu { | |
284 | right: -20px; |
|
284 | right: -20px; | |
285 | left: auto; |
|
285 | left: auto; | |
286 | } |
|
286 | } | |
287 |
|
287 | |||
288 | .submenu { |
|
288 | .submenu { | |
289 | position: absolute; |
|
289 | position: absolute; | |
290 | top: 100%; |
|
290 | top: 100%; | |
291 | left: 0; |
|
291 | left: 0; | |
292 | min-width: 150px; |
|
292 | min-width: 150px; | |
293 | margin: 6px 0 0; |
|
293 | margin: 6px 0 0; | |
294 | padding: 0; |
|
294 | padding: 0; | |
295 | text-align: left; |
|
295 | text-align: left; | |
296 | font-family: @text-light; |
|
296 | font-family: @text-light; | |
297 | border-radius: @border-radius; |
|
297 | border-radius: @border-radius; | |
298 | z-index: 20; |
|
298 | z-index: 20; | |
299 |
|
299 | |||
300 | li { |
|
300 | li { | |
301 | display: block; |
|
301 | display: block; | |
302 | margin: 0; |
|
302 | margin: 0; | |
303 | padding: 0 .5em; |
|
303 | padding: 0 .5em; | |
304 | line-height: 1em; |
|
304 | line-height: 1em; | |
305 | color: @grey3; |
|
305 | color: @grey3; | |
306 | background-color: @grey6; |
|
306 | background-color: @grey6; | |
307 | list-style-type: none; |
|
307 | list-style-type: none; | |
308 |
|
308 | |||
309 | a { |
|
309 | a { | |
310 | display: block; |
|
310 | display: block; | |
311 | width: 100%; |
|
311 | width: 100%; | |
312 | padding: .5em 0; |
|
312 | padding: .5em 0; | |
313 | border-right: none; |
|
313 | border-right: none; | |
314 | border-bottom: @border-thickness solid white; |
|
314 | border-bottom: @border-thickness solid white; | |
315 | color: @grey3; |
|
315 | color: @grey3; | |
316 | } |
|
316 | } | |
317 |
|
317 | |||
318 | ul { |
|
318 | ul { | |
319 | display: none; |
|
319 | display: none; | |
320 | position: absolute; |
|
320 | position: absolute; | |
321 | top: 0; |
|
321 | top: 0; | |
322 | right: 100%; |
|
322 | right: 100%; | |
323 | padding: 0; |
|
323 | padding: 0; | |
324 | z-index: 30; |
|
324 | z-index: 30; | |
325 | } |
|
325 | } | |
326 | &:hover { |
|
326 | &:hover { | |
327 | background-color: @grey5; |
|
327 | background-color: @grey5; | |
328 | -webkit-transition: background .3s; |
|
328 | -webkit-transition: background .3s; | |
329 | -moz-transition: background .3s; |
|
329 | -moz-transition: background .3s; | |
330 | -o-transition: background .3s; |
|
330 | -o-transition: background .3s; | |
331 | transition: background .3s; |
|
331 | transition: background .3s; | |
332 |
|
332 | |||
333 | ul { |
|
333 | ul { | |
334 | display: block; |
|
334 | display: block; | |
335 | } |
|
335 | } | |
336 | } |
|
336 | } | |
337 | } |
|
337 | } | |
338 |
|
338 | |||
339 | } |
|
339 | } | |
340 |
|
340 | |||
341 |
|
341 | |||
342 |
|
342 | |||
343 |
|
343 | |||
344 | // repo dropdown |
|
344 | // repo dropdown | |
345 | .quick_repo_menu { |
|
345 | .quick_repo_menu { | |
346 | width: 15px; |
|
346 | width: 15px; | |
347 | text-align: center; |
|
347 | text-align: center; | |
348 | position: relative; |
|
348 | position: relative; | |
349 | cursor: pointer; |
|
349 | cursor: pointer; | |
350 |
|
350 | |||
351 | div { |
|
351 | div { | |
352 | overflow: visible !important; |
|
352 | overflow: visible !important; | |
353 | } |
|
353 | } | |
354 |
|
354 | |||
355 | &.sorting { |
|
355 | &.sorting { | |
356 | cursor: auto; |
|
356 | cursor: auto; | |
357 | } |
|
357 | } | |
358 |
|
358 | |||
359 | &:hover { |
|
359 | &:hover { | |
360 | .menu_items_container { |
|
360 | .menu_items_container { | |
361 | position: absolute; |
|
361 | position: absolute; | |
362 | display: block; |
|
362 | display: block; | |
363 | } |
|
363 | } | |
364 | .menu_items { |
|
364 | .menu_items { | |
365 | display: block; |
|
365 | display: block; | |
366 | } |
|
366 | } | |
367 | } |
|
367 | } | |
368 |
|
368 | |||
369 | i { |
|
369 | i { | |
370 | margin: 0; |
|
370 | margin: 0; | |
371 | color: @grey4; |
|
371 | color: @grey4; | |
372 | } |
|
372 | } | |
373 |
|
373 | |||
374 | .menu_items_container { |
|
374 | .menu_items_container { | |
375 | position: absolute; |
|
375 | position: absolute; | |
376 | top: 0; |
|
376 | top: 0; | |
377 | left: 100%; |
|
377 | left: 100%; | |
378 | margin: 0; |
|
378 | margin: 0; | |
379 | padding: 0; |
|
379 | padding: 0; | |
380 | list-style: none; |
|
380 | list-style: none; | |
381 | background-color: @grey6; |
|
381 | background-color: @grey6; | |
382 | z-index: 999; |
|
382 | z-index: 999; | |
383 | text-align: left; |
|
383 | text-align: left; | |
384 |
|
384 | |||
385 | a { |
|
385 | a { | |
386 | color: @grey2; |
|
386 | color: @grey2; | |
387 | } |
|
387 | } | |
388 |
|
388 | |||
389 | ul.menu_items { |
|
389 | ul.menu_items { | |
390 | margin: 0; |
|
390 | margin: 0; | |
391 | padding: 0; |
|
391 | padding: 0; | |
392 | } |
|
392 | } | |
393 |
|
393 | |||
394 | li { |
|
394 | li { | |
395 | margin: 0; |
|
395 | margin: 0; | |
396 | padding: 0; |
|
396 | padding: 0; | |
397 | line-height: 1em; |
|
397 | line-height: 1em; | |
398 | list-style-type: none; |
|
398 | list-style-type: none; | |
399 |
|
399 | |||
400 | a { |
|
400 | a { | |
401 | display: block; |
|
401 | display: block; | |
402 | height: 16px; |
|
402 | height: 16px; | |
403 | padding: 8px; //must add up to td height (28px) |
|
403 | padding: 8px; //must add up to td height (28px) | |
404 | width: 120px; // set width |
|
404 | width: 120px; // set width | |
405 |
|
405 | |||
406 | &:hover { |
|
406 | &:hover { | |
407 | background-color: @grey5; |
|
407 | background-color: @grey5; | |
408 | -webkit-transition: background .3s; |
|
408 | -webkit-transition: background .3s; | |
409 | -moz-transition: background .3s; |
|
409 | -moz-transition: background .3s; | |
410 | -o-transition: background .3s; |
|
410 | -o-transition: background .3s; | |
411 | transition: background .3s; |
|
411 | transition: background .3s; | |
412 | } |
|
412 | } | |
413 | } |
|
413 | } | |
414 | } |
|
414 | } | |
415 | } |
|
415 | } | |
416 | } |
|
416 | } | |
417 |
|
417 | |||
418 | // Header Repository Switcher |
|
418 | // Header Repository Switcher | |
419 | // Select2 Dropdown |
|
419 | // Select2 Dropdown | |
420 | #select2-drop.select2-drop.repo-switcher-dropdown { |
|
420 | #select2-drop.select2-drop.repo-switcher-dropdown { | |
421 | width: auto !important; |
|
421 | width: auto !important; | |
422 | margin-top: 5px; |
|
422 | margin-top: 5px; | |
423 | padding: 1em 0; |
|
423 | padding: 1em 0; | |
424 | text-align: left; |
|
424 | text-align: left; | |
425 | .border-radius-bottom(@border-radius); |
|
425 | .border-radius-bottom(@border-radius); | |
426 | border-color: transparent; |
|
426 | border-color: transparent; | |
427 | color: @grey6; |
|
427 | color: @grey6; | |
428 | background-color: @grey2; |
|
428 | background-color: @grey2; | |
429 |
|
429 | |||
430 | input { |
|
430 | input { | |
431 | min-width: 90%; |
|
431 | min-width: 90%; | |
432 | } |
|
432 | } | |
433 |
|
433 | |||
434 | ul.select2-result-sub { |
|
434 | ul.select2-result-sub { | |
435 |
|
435 | |||
436 | li { |
|
436 | li { | |
437 | line-height: 1em; |
|
437 | line-height: 1em; | |
438 |
|
438 | |||
439 | &:hover, |
|
439 | &:hover, | |
440 | &.select2-highlighted { |
|
440 | &.select2-highlighted { | |
441 | background-color: @grey3; |
|
441 | background-color: @grey3; | |
442 | } |
|
442 | } | |
443 | } |
|
443 | } | |
444 |
|
444 | |||
445 | &:before { content: none; } |
|
445 | &:before { content: none; } | |
446 | } |
|
446 | } | |
447 |
|
447 | |||
448 | ul.select2-results { |
|
448 | ul.select2-results { | |
449 | min-width: 200px; |
|
449 | min-width: 200px; | |
450 | margin: 0; |
|
450 | margin: 0; | |
451 | padding: 0; |
|
451 | padding: 0; | |
452 | list-style-type: none; |
|
452 | list-style-type: none; | |
453 | overflow-x: visible; |
|
453 | overflow-x: visible; | |
454 | overflow-y: scroll; |
|
454 | overflow-y: scroll; | |
455 |
|
455 | |||
456 | li { |
|
456 | li { | |
457 | padding: 0 8px; |
|
457 | padding: 0 8px; | |
458 | line-height: 1em; |
|
458 | line-height: 1em; | |
459 | color: @grey6; |
|
459 | color: @grey6; | |
460 |
|
460 | |||
461 | &>.select2-result-label { |
|
461 | &>.select2-result-label { | |
462 | padding: 8px 0; |
|
462 | padding: 8px 0; | |
463 | border-bottom: @border-thickness solid @grey3; |
|
463 | border-bottom: @border-thickness solid @grey3; | |
464 | white-space: nowrap; |
|
464 | white-space: nowrap; | |
465 | color: @grey5; |
|
465 | color: @grey5; | |
466 | cursor: pointer; |
|
466 | cursor: pointer; | |
467 | } |
|
467 | } | |
468 |
|
468 | |||
469 | &.select2-result-with-children { |
|
469 | &.select2-result-with-children { | |
470 | margin: 0; |
|
470 | margin: 0; | |
471 | padding: 0; |
|
471 | padding: 0; | |
472 | } |
|
472 | } | |
473 |
|
473 | |||
474 | &.select2-result-unselectable > .select2-result-label { |
|
474 | &.select2-result-unselectable > .select2-result-label { | |
475 | margin: 0 8px; |
|
475 | margin: 0 8px; | |
476 | } |
|
476 | } | |
477 |
|
477 | |||
478 | } |
|
478 | } | |
479 | } |
|
479 | } | |
480 |
|
480 | |||
481 | ul.select2-result-sub { |
|
481 | ul.select2-result-sub { | |
482 | margin: 0; |
|
482 | margin: 0; | |
483 | padding: 0; |
|
483 | padding: 0; | |
484 |
|
484 | |||
485 | li { |
|
485 | li { | |
486 | display: block; |
|
486 | display: block; | |
487 | margin: 0; |
|
487 | margin: 0; | |
488 | border-right: none; |
|
488 | border-right: none; | |
489 | line-height: 1em; |
|
489 | line-height: 1em; | |
490 | font-family: @text-light; |
|
490 | font-family: @text-light; | |
491 | color: @grey2; |
|
491 | color: @grey2; | |
492 | list-style-type: none; |
|
492 | list-style-type: none; | |
493 |
|
493 | |||
494 | &:hover { |
|
494 | &:hover { | |
495 | background-color: @grey3; |
|
495 | background-color: @grey3; | |
496 | } |
|
496 | } | |
497 | } |
|
497 | } | |
498 | } |
|
498 | } | |
499 | } |
|
499 | } | |
500 |
|
500 | |||
501 |
|
501 | |||
502 | #context-bar { |
|
502 | #context-bar { | |
503 | display: block; |
|
503 | display: block; | |
504 | margin: 0 auto 20px 0; |
|
504 | margin: 0 auto 20px 0; | |
505 | padding: 0 @header-padding; |
|
505 | padding: 0 @header-padding; | |
506 | background-color: @grey7; |
|
506 | background-color: @grey7; | |
|
507 | border-bottom: 1px solid @grey5; | |||
507 |
|
508 | |||
508 | .clear { |
|
509 | .clear { | |
509 | clear: both; |
|
510 | clear: both; | |
510 | } |
|
511 | } | |
511 | } |
|
512 | } | |
512 |
|
513 | |||
513 | ul#context-pages { |
|
514 | ul#context-pages { | |
514 | li { |
|
515 | li { | |
515 | list-style-type: none; |
|
516 | list-style-type: none; | |
516 |
|
517 | |||
517 | a { |
|
518 | a { | |
518 |
color: @grey |
|
519 | color: @grey2; | |
519 |
|
520 | |||
520 | &:hover { |
|
521 | &:hover { | |
521 |
color: @grey |
|
522 | color: @grey1; | |
522 | } |
|
523 | } | |
523 | } |
|
524 | } | |
524 |
|
525 | |||
525 | &.active { |
|
526 | &.active { | |
526 | // special case, non-variable color |
|
527 | // special case, non-variable color | |
527 | border-bottom: 2px solid @rcblue; |
|
528 | border-bottom: 2px solid @rcblue; | |
528 |
|
529 | |||
529 | a { |
|
530 | a { | |
530 | color: @rcblue; |
|
531 | color: @rcblue; | |
531 | } |
|
532 | } | |
532 | } |
|
533 | } | |
533 | } |
|
534 | } | |
534 | } |
|
535 | } | |
535 |
|
536 | |||
536 | // PAGINATION |
|
537 | // PAGINATION | |
537 |
|
538 | |||
538 | .pagination { |
|
539 | .pagination { | |
539 | border: @border-thickness solid @grey5; |
|
540 | border: @border-thickness solid @grey5; | |
540 | color: @grey2; |
|
541 | color: @grey2; | |
541 | box-shadow: @button-shadow; |
|
542 | box-shadow: @button-shadow; | |
542 |
|
543 | |||
543 | .current { |
|
544 | .current { | |
544 | color: @grey4; |
|
545 | color: @grey4; | |
545 | } |
|
546 | } | |
546 | } |
|
547 | } | |
547 |
|
548 | |||
548 | .dataTables_processing { |
|
549 | .dataTables_processing { | |
549 | text-align: center; |
|
550 | text-align: center; | |
550 | font-size: 1.1em; |
|
551 | font-size: 1.1em; | |
551 | position: relative; |
|
552 | position: relative; | |
552 | top: 95px; |
|
553 | top: 95px; | |
553 | } |
|
554 | } | |
554 |
|
555 | |||
555 | .dataTables_paginate, .pagination-wh { |
|
556 | .dataTables_paginate, .pagination-wh { | |
556 | text-align: left; |
|
557 | text-align: left; | |
557 | display: inline-block; |
|
558 | display: inline-block; | |
558 | border-left: 1px solid @grey5; |
|
559 | border-left: 1px solid @grey5; | |
559 | float: none; |
|
560 | float: none; | |
560 | overflow: hidden; |
|
561 | overflow: hidden; | |
561 | box-shadow: @button-shadow; |
|
562 | box-shadow: @button-shadow; | |
562 |
|
563 | |||
563 | .paginate_button, .pager_curpage, |
|
564 | .paginate_button, .pager_curpage, | |
564 | .pager_link, .pg-previous, .pg-next, .pager_dotdot { |
|
565 | .pager_link, .pg-previous, .pg-next, .pager_dotdot { | |
565 | display: inline-block; |
|
566 | display: inline-block; | |
566 | padding: @menupadding/4 @menupadding; |
|
567 | padding: @menupadding/4 @menupadding; | |
567 | border: 1px solid @grey5; |
|
568 | border: 1px solid @grey5; | |
568 | border-left: 0; |
|
569 | border-left: 0; | |
569 | color: @grey2; |
|
570 | color: @grey2; | |
570 | cursor: pointer; |
|
571 | cursor: pointer; | |
571 | float: left; |
|
572 | float: left; | |
572 |
|
573 | |||
573 | &:hover { |
|
574 | &:hover { | |
574 | color: @rcdarkblue; |
|
575 | color: @rcdarkblue; | |
575 | } |
|
576 | } | |
576 | } |
|
577 | } | |
577 |
|
578 | |||
578 | .paginate_button.disabled, |
|
579 | .paginate_button.disabled, | |
579 | .disabled { |
|
580 | .disabled { | |
580 | color: @grey3; |
|
581 | color: @grey3; | |
581 | cursor: default; |
|
582 | cursor: default; | |
582 | opacity: 0.5; |
|
583 | opacity: 0.5; | |
583 | } |
|
584 | } | |
584 |
|
585 | |||
585 | .paginate_button.current, .pager_curpage { |
|
586 | .paginate_button.current, .pager_curpage { | |
586 | background: @rcblue; |
|
587 | background: @rcblue; | |
587 | border-color: @rcblue; |
|
588 | border-color: @rcblue; | |
588 | color: @white; |
|
589 | color: @white; | |
589 | } |
|
590 | } | |
590 |
|
591 | |||
591 | .ellipsis { |
|
592 | .ellipsis { | |
592 | display: inline-block; |
|
593 | display: inline-block; | |
593 | text-align: left; |
|
594 | text-align: left; | |
594 | padding: @menupadding/4 @menupadding; |
|
595 | padding: @menupadding/4 @menupadding; | |
595 | border: 1px solid @grey5; |
|
596 | border: 1px solid @grey5; | |
596 | border-left: 0; |
|
597 | border-left: 0; | |
597 | float: left; |
|
598 | float: left; | |
598 | } |
|
599 | } | |
599 | } |
|
600 | } | |
600 |
|
601 | |||
601 | // SIDEBAR |
|
602 | // SIDEBAR | |
602 |
|
603 | |||
603 | .sidebar { |
|
604 | .sidebar { | |
604 | .block-left; |
|
605 | .block-left; | |
605 | clear: left; |
|
606 | clear: left; | |
606 | max-width: @sidebar-width; |
|
607 | max-width: @sidebar-width; | |
607 | margin-right: @sidebarpadding; |
|
608 | margin-right: @sidebarpadding; | |
608 | padding-right: @sidebarpadding; |
|
609 | padding-right: @sidebarpadding; | |
609 | font-family: @text-regular; |
|
610 | font-family: @text-regular; | |
610 | color: @grey1; |
|
611 | color: @grey1; | |
611 |
|
612 | |||
612 | &#graph_nodes { |
|
613 | &#graph_nodes { | |
613 | clear:both; |
|
614 | clear:both; | |
614 | width: auto; |
|
615 | width: auto; | |
615 | margin-left: -100px; |
|
616 | margin-left: -100px; | |
616 | padding: 0; |
|
617 | padding: 0; | |
617 | border: none; |
|
618 | border: none; | |
618 | } |
|
619 | } | |
619 |
|
620 | |||
620 | .nav-pills { |
|
621 | .nav-pills { | |
621 | margin: 0; |
|
622 | margin: 0; | |
622 | } |
|
623 | } | |
623 |
|
624 | |||
624 | .nav { |
|
625 | .nav { | |
625 | list-style: none; |
|
626 | list-style: none; | |
626 | padding: 0; |
|
627 | padding: 0; | |
627 |
|
628 | |||
628 | li { |
|
629 | li { | |
629 | padding-bottom: @menupadding; |
|
630 | padding-bottom: @menupadding; | |
630 | line-height: 1em; |
|
631 | line-height: 1em; | |
631 | color: @grey4; |
|
632 | color: @grey4; | |
632 | list-style-type: none; |
|
633 | list-style-type: none; | |
633 |
|
634 | |||
634 | &.active a { |
|
635 | &.active a { | |
635 | color: @grey2; |
|
636 | color: @grey2; | |
636 | } |
|
637 | } | |
637 |
|
638 | |||
638 | a { |
|
639 | a { | |
639 | color: @grey4; |
|
640 | color: @grey4; | |
640 | } |
|
641 | } | |
641 | } |
|
642 | } | |
642 |
|
643 | |||
643 | } |
|
644 | } | |
644 | } |
|
645 | } | |
645 |
|
646 | |||
646 | .main_filter_help_box { |
|
647 | .main_filter_help_box { | |
647 | padding: 7px 7px; |
|
648 | padding: 7px 7px; | |
648 | display: inline-block; |
|
649 | display: inline-block; | |
649 | vertical-align: top; |
|
650 | vertical-align: top; | |
650 | background: inherit; |
|
651 | background: inherit; | |
651 | position: absolute; |
|
652 | position: absolute; | |
652 | right: 0; |
|
653 | right: 0; | |
653 | top: 9px; |
|
654 | top: 9px; | |
654 | } |
|
655 | } | |
655 |
|
656 | |||
656 | .main_filter_input_box { |
|
657 | .main_filter_input_box { | |
657 | display: inline-block; |
|
658 | display: inline-block; | |
658 |
|
659 | |||
659 | .searchItems { |
|
660 | .searchItems { | |
660 | display:flex; |
|
661 | display:flex; | |
661 | background: @black; |
|
662 | background: @black; | |
662 | padding: 0px; |
|
663 | padding: 0px; | |
663 | border-radius: 3px; |
|
664 | border-radius: 3px; | |
664 | border: 1px solid @black; |
|
665 | border: 1px solid @black; | |
665 |
|
666 | |||
666 | a { |
|
667 | a { | |
667 | border: none !important; |
|
668 | border: none !important; | |
668 | } |
|
669 | } | |
669 | } |
|
670 | } | |
670 |
|
671 | |||
671 | .searchTag { |
|
672 | .searchTag { | |
672 | line-height: 28px; |
|
673 | line-height: 28px; | |
673 | padding: 0 5px; |
|
674 | padding: 0 5px; | |
674 |
|
675 | |||
675 | .tag { |
|
676 | .tag { | |
676 | color: @grey5; |
|
677 | color: @grey5; | |
677 | border-color: @grey2; |
|
678 | border-color: @grey2; | |
678 | background: @grey1; |
|
679 | background: @grey1; | |
679 | } |
|
680 | } | |
680 | } |
|
681 | } | |
681 |
|
682 | |||
682 | .searchTagFilter { |
|
683 | .searchTagFilter { | |
683 | background-color: @black !important; |
|
684 | background-color: @black !important; | |
684 | margin-right: 0; |
|
685 | margin-right: 0; | |
685 | } |
|
686 | } | |
686 |
|
687 | |||
687 | .searchTagHelp { |
|
688 | .searchTagHelp { | |
688 | background-color: @grey1 !important; |
|
689 | background-color: @grey1 !important; | |
689 | margin: 0; |
|
690 | margin: 0; | |
690 | } |
|
691 | } | |
691 | .searchTagHelp:hover { |
|
692 | .searchTagHelp:hover { | |
692 | background-color: @grey1 !important; |
|
693 | background-color: @grey1 !important; | |
693 | } |
|
694 | } | |
694 | .searchTagInput { |
|
695 | .searchTagInput { | |
695 | background-color: @grey1 !important; |
|
696 | background-color: @grey1 !important; | |
696 | margin-right: 0; |
|
697 | margin-right: 0; | |
697 | } |
|
698 | } | |
698 | } |
|
699 | } | |
699 |
|
700 | |||
700 | .main_filter_box { |
|
701 | .main_filter_box { | |
701 | margin: 9px 0 0 0; |
|
702 | margin: 9px 0 0 0; | |
702 | } |
|
703 | } | |
703 |
|
704 | |||
704 | #main_filter_help { |
|
705 | #main_filter_help { | |
705 | background: @grey3; |
|
706 | background: @grey3; | |
706 | border: 1px solid black; |
|
707 | border: 1px solid black; | |
707 | position: absolute; |
|
708 | position: absolute; | |
708 | white-space: pre; |
|
709 | white-space: pre; | |
709 | z-index: 9999; |
|
710 | z-index: 9999; | |
710 | color: @nav-grey; |
|
711 | color: @nav-grey; | |
711 | margin: 1px 7px; |
|
712 | margin: 1px 7px; | |
712 | padding: 0 10px; |
|
713 | padding: 0 10px; | |
713 | } |
|
714 | } | |
714 |
|
715 | |||
715 | input { |
|
716 | input { | |
716 |
|
717 | |||
717 | &.main_filter_input { |
|
718 | &.main_filter_input { | |
718 | padding: 5px 10px; |
|
719 | padding: 5px 10px; | |
719 | min-width: 260px; |
|
720 | min-width: 260px; | |
720 | color: @grey7; |
|
721 | color: @grey7; | |
721 | background: @black; |
|
722 | background: @black; | |
722 | min-height: 18px; |
|
723 | min-height: 18px; | |
723 | border: 0; |
|
724 | border: 0; | |
724 |
|
725 | |||
725 | &:active { |
|
726 | &:active { | |
726 | color: @grey2 !important; |
|
727 | color: @grey2 !important; | |
727 | background: white !important; |
|
728 | background: white !important; | |
728 | } |
|
729 | } | |
729 | &:focus { |
|
730 | &:focus { | |
730 | color: @grey2 !important; |
|
731 | color: @grey2 !important; | |
731 | background: white !important; |
|
732 | background: white !important; | |
732 | } |
|
733 | } | |
733 | } |
|
734 | } | |
734 | } |
|
735 | } | |
735 |
|
736 | |||
736 |
|
737 | |||
737 |
|
738 | |||
738 | .main_filter_input::placeholder { |
|
739 | .main_filter_input::placeholder { | |
739 | color: @nav-grey; |
|
740 | color: @nav-grey; | |
740 | opacity: 1; |
|
741 | opacity: 1; | |
741 | } |
|
742 | } | |
742 |
|
743 | |||
743 | .notice-box { |
|
744 | .notice-box { | |
744 | display:block !important; |
|
745 | display:block !important; | |
745 | padding: 9px 0 !important; |
|
746 | padding: 9px 0 !important; | |
746 | } |
|
747 | } | |
747 |
|
748 | |||
748 | .menulabel-notice { |
|
749 | .menulabel-notice { | |
749 | border: 1px solid @color5; |
|
750 | border: 1px solid @color5; | |
750 | padding:7px 10px; |
|
751 | padding:7px 10px; | |
751 | color: @color5; |
|
752 | color: @color5; | |
752 | } |
|
753 | } |
General Comments 0
You need to be logged in to leave comments.
Login now