LuCI - OpenWrt Configuration Interface
Revisão | 320892841a684c628c1c1b5557f4690c17bfd9bf (tree) |
---|---|
Hora | 2022-01-26 17:14:58 |
Autor | Tianling Shen <cnsztl@immo...> |
Commiter | Tianling Shen |
luci-theme-bootstrap-mod: sync with upstream source
Signed-off-by: Tianling Shen <cnsztl@immortalwrt.org>
@@ -1,4 +1,4 @@ | ||
1 | -# Copyright (C) 2018-2020 Lienol <lawlienol@gmail.com> | |
1 | +# Copyright (C) 2018-2022 Lienol <lawlienol@gmail.com> | |
2 | 2 | # |
3 | 3 | # This is free software, licensed under the GNU General Public License v3. |
4 | 4 | # |
@@ -7,8 +7,8 @@ include $(TOPDIR)/rules.mk | ||
7 | 7 | |
8 | 8 | LUCI_TITLE:=Bootstrap Mod Theme By Lienol |
9 | 9 | LUCI_DEPENDS:= |
10 | -PKG_VERSION:=1.12 | |
11 | -PKG_DATE:=20200531 | |
10 | +PKG_VERSION:=20220102 | |
11 | +PKG_RELEASE:=1 | |
12 | 12 | |
13 | 13 | include ../../luci.mk |
14 | 14 |
@@ -1,1574 +0,0 @@ | ||
1 | -html, | |
2 | -body { | |
3 | - height: 100%; | |
4 | -} | |
5 | - | |
6 | -body { | |
7 | - background: #ffffff; | |
8 | - color: #333; | |
9 | - font-family: Helvetica, Arial, sans-serif; | |
10 | - font-size: 14px; | |
11 | - line-height: 1.8; | |
12 | - margin: 0; | |
13 | - /* padding-top: 60px; */ | |
14 | - margin: unset; | |
15 | -} | |
16 | - | |
17 | -a { | |
18 | - color: #118af3; | |
19 | - text-decoration: none; | |
20 | - outline: 0; | |
21 | -} | |
22 | - | |
23 | -a:hover { | |
24 | - opacity: 1; | |
25 | -} | |
26 | - | |
27 | -h1, | |
28 | -h2, | |
29 | -h3, | |
30 | -h4, | |
31 | -h5, | |
32 | -h6, | |
33 | -p, | |
34 | -.cbi-map-descr, | |
35 | -.cbi-section-descr { | |
36 | - color: #19a4e6; | |
37 | - margin-top: 0; | |
38 | - margin-bottom: 10px; | |
39 | -} | |
40 | - | |
41 | -ul, | |
42 | -ol { | |
43 | - margin: 0; | |
44 | - padding: 0; | |
45 | - list-style: none; | |
46 | -} | |
47 | - | |
48 | -tr, | |
49 | -.tr { | |
50 | - display: table-row; | |
51 | -} | |
52 | - | |
53 | -legend { | |
54 | - color: #19a4e6; | |
55 | - font-size: 18px; | |
56 | - font-weight: bold; | |
57 | - padding: 0 0 3px; | |
58 | -} | |
59 | - | |
60 | -.left { | |
61 | - text-align: left !important; | |
62 | -} | |
63 | - | |
64 | -.right { | |
65 | - text-align: right !important; | |
66 | -} | |
67 | - | |
68 | -.center { | |
69 | - text-align: center !important; | |
70 | -} | |
71 | - | |
72 | -.top { | |
73 | - vertical-align: top !important; | |
74 | -} | |
75 | - | |
76 | -.middle { | |
77 | - vertical-align: middle !important; | |
78 | -} | |
79 | - | |
80 | -.bottom { | |
81 | - vertical-align: bottom !important; | |
82 | -} | |
83 | - | |
84 | -.pull-left { | |
85 | - float: left !important; | |
86 | -} | |
87 | - | |
88 | -.pull-right { | |
89 | - float: right !important; | |
90 | -} | |
91 | - | |
92 | -.inline { | |
93 | - display: inline; | |
94 | -} | |
95 | - | |
96 | -.hidden { | |
97 | - display: none; | |
98 | -} | |
99 | - | |
100 | - | |
101 | -/* Style */ | |
102 | - | |
103 | -.container:first-child { | |
104 | - /* min-height: 40px; */ | |
105 | - display: flow-root; | |
106 | -} | |
107 | - | |
108 | -.container { | |
109 | - max-width: 1080px; | |
110 | - margin: 0 auto; | |
111 | -} | |
112 | - | |
113 | -/* Header */ | |
114 | - | |
115 | -header { | |
116 | - font-size: 14px; | |
117 | - /* position: fixed; | |
118 | - top: 0; | |
119 | - left: 0; | |
120 | - right: 0; */ | |
121 | - background: #34aee8; | |
122 | - box-shadow: 0 2px 2px rgba(0, 0, 0, .1); | |
123 | - z-index: 100; | |
124 | - border-bottom: 2px solid #19a4e6; | |
125 | -} | |
126 | - | |
127 | -.brand { | |
128 | - float: left; | |
129 | - color: #ffffff; | |
130 | - font-size: 24px; | |
131 | - font-weight: 700; | |
132 | - line-height: 40px; | |
133 | - margin-right: 20px; | |
134 | - position: absolute; | |
135 | - left: 0; | |
136 | - margin-left: 20px; | |
137 | -} | |
138 | - | |
139 | - | |
140 | -/* .brand { display:none; } */ | |
141 | - | |
142 | -.brand:hover { | |
143 | - opacity: 1; | |
144 | -} | |
145 | - | |
146 | -.nav li { | |
147 | - float: left; | |
148 | -} | |
149 | - | |
150 | -.nav a { | |
151 | - display: block; | |
152 | - color: #fff; | |
153 | - line-height: 40px; | |
154 | - padding: 0 15px; | |
155 | -} | |
156 | - | |
157 | -.nav a:hover {} | |
158 | - | |
159 | - | |
160 | -/* Dropdown */ | |
161 | - | |
162 | -.dropdown { | |
163 | - position: relative; | |
164 | -} | |
165 | - | |
166 | -.dropdown:hover { | |
167 | - background-color: #0088cc; | |
168 | -} | |
169 | - | |
170 | -.dropdown:hover .dropdown-menu { | |
171 | - display: block; | |
172 | -} | |
173 | - | |
174 | -.dropdown-menu { | |
175 | - display: none; | |
176 | - position: absolute; | |
177 | - top: 40px; | |
178 | - background: #34aee8; | |
179 | - border-radius: 5px; | |
180 | - padding: 5px 0px; | |
181 | - z-index: 100; | |
182 | -} | |
183 | - | |
184 | -.dropdown-menu:before { | |
185 | - content: ''; | |
186 | - position: absolute; | |
187 | - top: -6px; | |
188 | - left: 27px; | |
189 | - border-bottom: 6px solid #00aaff; | |
190 | - border-left: 7px solid transparent; | |
191 | - border-right: 7px solid transparent; | |
192 | -} | |
193 | - | |
194 | -.dropdown-menu a { | |
195 | - color: #fff; | |
196 | - line-height: 30px; | |
197 | - min-width: 150px; | |
198 | - padding: 0 20px; | |
199 | - font-size: 14px; | |
200 | -} | |
201 | - | |
202 | -.dropdown-menu a:hover { | |
203 | - background: #118af3; | |
204 | - /* color: #3fc3ef; */ | |
205 | -} | |
206 | - | |
207 | -.cbi-dropdown { | |
208 | - display: inline-block; | |
209 | - width: 210px; | |
210 | - height: 30px; | |
211 | - padding: 4px; | |
212 | - font-size: 13px; | |
213 | - line-height: 18px; | |
214 | - color: #808080; | |
215 | - border: 1px solid #ccc; | |
216 | - border-radius: 3px; | |
217 | - box-sizing: border-box; | |
218 | -} | |
219 | - | |
220 | -.cbi-dropdown { | |
221 | - border: 1px solid #ccc; | |
222 | - border-radius: 3px; | |
223 | - display: inline-flex; | |
224 | - padding: 0; | |
225 | - cursor: pointer; | |
226 | - height: auto; | |
227 | - background: linear-gradient(#fff 0%, #e9e8e6 100%); | |
228 | - position: relative; | |
229 | - color: #404040; | |
230 | -} | |
231 | - | |
232 | -.cbi-dropdown { | |
233 | - /* min-width: 210px; */ | |
234 | - max-width: 400px; | |
235 | - width: auto; | |
236 | -} | |
237 | - | |
238 | -.cbi-dropdown:focus { | |
239 | - outline: 2px solid #4b6e9b; | |
240 | -} | |
241 | - | |
242 | -.cbi-dropdown>ul { | |
243 | - margin: 0 !important; | |
244 | - padding: 0; | |
245 | - list-style: none; | |
246 | - overflow-x: hidden; | |
247 | - overflow-y: auto; | |
248 | - display: flex; | |
249 | - width: 100%; | |
250 | -} | |
251 | - | |
252 | -.cbi-dropdown>ul.preview { | |
253 | - display: none; | |
254 | -} | |
255 | - | |
256 | -.cbi-dropdown>.open, | |
257 | -.cbi-dropdown>.more { | |
258 | - flex-grow: 0; | |
259 | - flex-shrink: 0; | |
260 | - display: flex; | |
261 | - flex-direction: column; | |
262 | - justify-content: center; | |
263 | - text-align: center; | |
264 | - line-height: 2em; | |
265 | - padding: 0 .25em; | |
266 | -} | |
267 | - | |
268 | -.cbi-dropdown>.more, | |
269 | -.cbi-dropdown>ul>li[placeholder] { | |
270 | - color: #777; | |
271 | - font-weight: bold; | |
272 | - text-shadow: 1px 1px 0px #fff; | |
273 | - display: none; | |
274 | -} | |
275 | - | |
276 | -.cbi-dropdown>ul>li { | |
277 | - display: none; | |
278 | - padding: .25em; | |
279 | - white-space: nowrap; | |
280 | - overflow: hidden; | |
281 | - text-overflow: ellipsis; | |
282 | - flex-shrink: 1; | |
283 | - flex-grow: 1; | |
284 | - align-items: center; | |
285 | - align-self: center; | |
286 | - /* color: #404040; */ | |
287 | - min-height: 20px; | |
288 | -} | |
289 | - | |
290 | -.cbi-dropdown>ul>li .hide-open { | |
291 | - display: block; | |
292 | - display: initial; | |
293 | -} | |
294 | - | |
295 | -.cbi-dropdown>ul>li .hide-close { | |
296 | - display: none; | |
297 | -} | |
298 | - | |
299 | -.cbi-dropdown>ul>li[display]:not([display="0"]) { | |
300 | - border-left: 1px solid #ccc; | |
301 | -} | |
302 | - | |
303 | -.cbi-dropdown[empty]>ul { | |
304 | - max-width: 1px; | |
305 | -} | |
306 | - | |
307 | -.cbi-dropdown>ul>li>form { | |
308 | - display: none; | |
309 | - margin: 0; | |
310 | - padding: 0; | |
311 | - pointer-events: none; | |
312 | -} | |
313 | - | |
314 | -.cbi-dropdown>ul>li img { | |
315 | - vertical-align: middle; | |
316 | - margin-right: .25em; | |
317 | -} | |
318 | - | |
319 | -.cbi-dropdown>ul>li>form>input[type="checkbox"] { | |
320 | - margin: 0; | |
321 | -} | |
322 | - | |
323 | -.cbi-dropdown>ul>li input[type="text"] { | |
324 | - height: 20px; | |
325 | -} | |
326 | - | |
327 | -.cbi-dropdown[open] { | |
328 | - position: relative; | |
329 | -} | |
330 | - | |
331 | -.cbi-dropdown[open]>ul.dropdown { | |
332 | - display: block; | |
333 | - background: #f6f6f5; | |
334 | - border: 1px solid #918e8c; | |
335 | - box-shadow: 0 0 4px #918e8c; | |
336 | - position: absolute; | |
337 | - z-index: 1000; | |
338 | - max-width: none; | |
339 | - min-width: 100%; | |
340 | - width: auto; | |
341 | -} | |
342 | - | |
343 | -.cbi-dropdown>ul>li[display], | |
344 | -.cbi-dropdown[open]>ul.preview, | |
345 | -.cbi-dropdown[open]>ul.dropdown>li, | |
346 | -.cbi-dropdown[multiple]>ul>li>label, | |
347 | -.cbi-dropdown[multiple][open]>ul.dropdown>li, | |
348 | -.cbi-dropdown[multiple][more]>.more, | |
349 | -.cbi-dropdown[multiple][empty]>.more { | |
350 | - flex-grow: 1; | |
351 | - display: flex; | |
352 | -} | |
353 | - | |
354 | -.cbi-dropdown[empty]>ul>li, | |
355 | -.cbi-dropdown[optional][open]>ul.dropdown>li[placeholder], | |
356 | -.cbi-dropdown[multiple][open]>ul.dropdown>li>form { | |
357 | - display: block; | |
358 | -} | |
359 | - | |
360 | -.cbi-dropdown[open]>ul.dropdown>li .hide-open { | |
361 | - display: none; | |
362 | -} | |
363 | - | |
364 | -.cbi-dropdown[open]>ul.dropdown>li .hide-close { | |
365 | - display: block; | |
366 | - display: initial; | |
367 | -} | |
368 | - | |
369 | -.cbi-dropdown[open]>ul.dropdown>li { | |
370 | - border-bottom: 1px solid #ccc; | |
371 | -} | |
372 | - | |
373 | -.cbi-dropdown[open]>ul.dropdown>li[selected] { | |
374 | - background: #b0d0f0; | |
375 | -} | |
376 | - | |
377 | -.cbi-dropdown[open]>ul.dropdown>li.focus { | |
378 | - background: linear-gradient(90deg, #a3c2e8 0%, #84aad9 100%); | |
379 | -} | |
380 | - | |
381 | -.cbi-dropdown[open]>ul.dropdown>li:last-child { | |
382 | - margin-bottom: 0; | |
383 | - border-bottom: none; | |
384 | -} | |
385 | - | |
386 | -.cbi-dropdown[disabled] { | |
387 | - pointer-events: none; | |
388 | - opacity: .6; | |
389 | -} | |
390 | - | |
391 | -#maincontent.container { | |
392 | - margin-top: 10px; | |
393 | -} | |
394 | - | |
395 | - | |
396 | -/* Label */ | |
397 | - | |
398 | -.label { | |
399 | - border-radius: 10px !important; | |
400 | - display: inline-block; | |
401 | - background: #bbb; | |
402 | - border-bottom: 2px solid rgba(0, 0, 0, .05); | |
403 | - border-radius: 4px; | |
404 | - color: #fff; | |
405 | - font-size: 14px; | |
406 | - line-height: 24px; | |
407 | - text-transform: uppercase; | |
408 | - margin-top: 6px; | |
409 | - padding: 2px 9px; | |
410 | - cursor: pointer; | |
411 | -} | |
412 | - | |
413 | -.label.success { | |
414 | - background: #118af3; | |
415 | -} | |
416 | - | |
417 | -.label.notice { | |
418 | - background: #118af3; | |
419 | -} | |
420 | - | |
421 | -.label.important { | |
422 | - background: #f00; | |
423 | -} | |
424 | - | |
425 | -.label.warning { | |
426 | - background: #fc0; | |
427 | -} | |
428 | - | |
429 | - | |
430 | -/* Main */ | |
431 | - | |
432 | -h2 a { | |
433 | - color: #333; | |
434 | -} | |
435 | - | |
436 | -h2 a:hover { | |
437 | - opacity: 1; | |
438 | -} | |
439 | - | |
440 | -h2+.cbi-map-descr { | |
441 | - margin-top: -10px; | |
442 | -} | |
443 | - | |
444 | -.alert-message { | |
445 | - position: relative; | |
446 | - padding: 15px; | |
447 | - margin-bottom: 10px; | |
448 | - background: linear-gradient(to bottom, #fceec1, #eedc94) repeat-x; | |
449 | - /* border: 1px solid rgba(0, 0, 0, .1); | |
450 | - border-width: 2px 0; */ | |
451 | - border-radius: 2px; | |
452 | -} | |
453 | - | |
454 | -.alert-message>h4, | |
455 | -p { | |
456 | - margin: 0; | |
457 | -} | |
458 | - | |
459 | -.error, | |
460 | -.errorbox { | |
461 | - display: inline; | |
462 | -} | |
463 | - | |
464 | -.error { | |
465 | - color: #f00; | |
466 | -} | |
467 | - | |
468 | -.errorbox { | |
469 | - color: #3b3; | |
470 | -} | |
471 | - | |
472 | -#maincontainer { | |
473 | - box-shadow: 0 0 2px rgba(0, 0, 0, .3); | |
474 | - border-radius: 4px; | |
475 | - width: 500px; | |
476 | - margin: 120px auto 0; | |
477 | - padding: 30px; | |
478 | -} | |
479 | - | |
480 | -#syslog { | |
481 | - color: #111; | |
482 | - width: 100%; | |
483 | -} | |
484 | - | |
485 | - | |
486 | -/* Change List */ | |
487 | - | |
488 | -.uci-change-legend { | |
489 | - padding-top: 15px; | |
490 | -} | |
491 | - | |
492 | -.uci-change-legend-label { | |
493 | - float: left; | |
494 | - margin-right: 100px; | |
495 | -} | |
496 | - | |
497 | -.uci-change-legend-label>ins, | |
498 | -.uci-change-legend-label>del, | |
499 | -.uci-change-legend-label>var { | |
500 | - float: left; | |
501 | - width: 10px; | |
502 | - height: 10px; | |
503 | - margin-top: 3px; | |
504 | - margin-right: 6px; | |
505 | -} | |
506 | - | |
507 | -.uci-change-list { | |
508 | - font-family: monospace; | |
509 | -} | |
510 | - | |
511 | -.uci-change-list ins, | |
512 | -.uci-change-legend-label ins, | |
513 | -.uci-change-list del, | |
514 | -.uci-change-legend-label del, | |
515 | -.uci-change-list var, | |
516 | -.uci-change-legend-label var { | |
517 | - display: block; | |
518 | - text-decoration: none; | |
519 | - padding: 2px; | |
520 | -} | |
521 | - | |
522 | -.uci-change-list ins, | |
523 | -.uci-change-legend-label ins { | |
524 | - background: #cfc; | |
525 | - border: 2px solid #4f4; | |
526 | -} | |
527 | - | |
528 | -.uci-change-list del, | |
529 | -.uci-change-legend-label del { | |
530 | - background: #fcc; | |
531 | - border: 2px solid #f00; | |
532 | -} | |
533 | - | |
534 | -.uci-change-list var, | |
535 | -.uci-change-legend-label var { | |
536 | - background: #f2f2f2; | |
537 | - border: 2px solid #ccc; | |
538 | -} | |
539 | - | |
540 | -.uci-change-list var ins, | |
541 | -.uci-change-list var del { | |
542 | - border: 0; | |
543 | - white-space: pre; | |
544 | - padding: 0; | |
545 | -} | |
546 | - | |
547 | -.uci-change-legend-label var ins, | |
548 | -.uci-change-legend-label var del { | |
549 | - border: 0; | |
550 | - line-height: 6px; | |
551 | -} | |
552 | - | |
553 | - | |
554 | -/* Tabs */ | |
555 | - | |
556 | -.tabs, | |
557 | -.cbi-tabmenu { | |
558 | - border-bottom: 2px solid #34aee8; | |
559 | - margin-bottom: 20px; | |
560 | -} | |
561 | - | |
562 | -.tabs li, | |
563 | -.cbi-tabmenu li { | |
564 | - display: inline-block; | |
565 | -} | |
566 | - | |
567 | -.tabs a, | |
568 | -.cbi-tabmenu a { | |
569 | - display: block; | |
570 | - color: #19a4e6; | |
571 | - line-height: 34px; | |
572 | - margin-bottom: -2px; | |
573 | - margin-right: 20px; | |
574 | - padding: 0 3px; | |
575 | -} | |
576 | - | |
577 | -.active a, | |
578 | -.cbi-tab a { | |
579 | - border-bottom: 2px solid #111; | |
580 | - color: #111; | |
581 | -} | |
582 | - | |
583 | - | |
584 | -/* Fieldset */ | |
585 | - | |
586 | -fieldset { | |
587 | - border: 0px; | |
588 | - margin: 10px 0; | |
589 | - padding: 0; | |
590 | -} | |
591 | - | |
592 | -fieldset fieldset { | |
593 | - margin: 0; | |
594 | -} | |
595 | - | |
596 | -.cbi-value { | |
597 | - margin-bottom: 1em; | |
598 | - zoom: 1; | |
599 | - clear: both; | |
600 | -} | |
601 | - | |
602 | -table .cbi-value-field, | |
603 | -.table .cbi-value-field { | |
604 | - display: table-cell; | |
605 | -} | |
606 | - | |
607 | -.cbi-value-title { | |
608 | - /* white-space: nowrap; | |
609 | - overflow: hidden; | |
610 | - text-overflow: clip; */ | |
611 | - display: table-cell; | |
612 | - padding-top: 0.4em; | |
613 | - line-height: 1.2em; | |
614 | - float: left; | |
615 | - width: 13em; | |
616 | - margin-right: 1.5em; | |
617 | - text-align: right; | |
618 | - color: #404040; | |
619 | -} | |
620 | - | |
621 | -.cbi-value-field { | |
622 | - color: #811; | |
623 | - display: table-cell; | |
624 | -} | |
625 | - | |
626 | -.cbi-section-table-cell { | |
627 | - white-space: nowrap; | |
628 | -} | |
629 | - | |
630 | -.cbi-section-create { | |
631 | - margin: -3px; | |
632 | - display: inline-flex; | |
633 | - align-items: center; | |
634 | -} | |
635 | - | |
636 | -.cbi-section-create>* { | |
637 | - margin: 3px; | |
638 | - flex: 1 1 auto; | |
639 | -} | |
640 | - | |
641 | - | |
642 | -/* Table */ | |
643 | - | |
644 | - | |
645 | -/* .cbi-section table tbody tr:nth-child(odd) { background-color: #fdfdfd; } */ | |
646 | - | |
647 | -table, | |
648 | -.table { | |
649 | - width: 100%; | |
650 | - display: table; | |
651 | - margin: 0 0 10px !important; | |
652 | - border-radius: 5px; | |
653 | - /* border: 1px solid #a9b1bb26; */ | |
654 | - border-collapse: collapse; | |
655 | - position: relative; | |
656 | -} | |
657 | - | |
658 | - | |
659 | -/* table tr:first-child, .table .tr:first-child { border-top: 1px solid #b0e6b9; } */ | |
660 | - | |
661 | - | |
662 | -/* table tr, .table .tr { border-bottom: 1px solid #b0e6b9; } */ | |
663 | - | |
664 | -table th, | |
665 | -table td, | |
666 | -.table .th, | |
667 | -.table .td { | |
668 | - color: #811; | |
669 | - padding: 3px !important; | |
670 | -} | |
671 | - | |
672 | -table tr+tr td, | |
673 | -.table .tr+.tr .td { | |
674 | - border-top: 1px solid #a9b1bb26; | |
675 | -} | |
676 | - | |
677 | -table th, | |
678 | -.table .th { | |
679 | - text-align: left; | |
680 | - font-weight: bold; | |
681 | -} | |
682 | - | |
683 | -table td:first-child, | |
684 | -.table .td:first-child { | |
685 | - color: #127; | |
686 | -} | |
687 | - | |
688 | -.table[width="33%"], | |
689 | -.th[width="33%"], | |
690 | -.td[width="33%"] { | |
691 | - width: 33%; | |
692 | -} | |
693 | - | |
694 | -.table[width="100%"], | |
695 | -.th[width="100%"], | |
696 | -.td[width="100%"] { | |
697 | - width: 100%; | |
698 | -} | |
699 | - | |
700 | -.table .th, | |
701 | -.table .td { | |
702 | - display: table-cell; | |
703 | - vertical-align: middle; | |
704 | -} | |
705 | - | |
706 | -.table .tr.placeholder { | |
707 | - height: calc(3em + 20px); | |
708 | -} | |
709 | - | |
710 | -.table .tr.placeholder>.td { | |
711 | - position: absolute; | |
712 | - left: 0; | |
713 | - right: 0; | |
714 | - bottom: 0; | |
715 | - text-align: center; | |
716 | - line-height: 3em; | |
717 | -} | |
718 | - | |
719 | -.td.cbi-section-actions>* { | |
720 | - /* display: flex; */ | |
721 | -} | |
722 | - | |
723 | -.td.cbi-section-actions>*>*, | |
724 | -.td.cbi-section-actions>*>form>* { | |
725 | - /* flex: 1 1 4em; | |
726 | - margin: 0 1px; */ | |
727 | -} | |
728 | - | |
729 | -.td.cbi-section-actions>*>.cbi-button-up, | |
730 | -.cbi-input-up { | |
731 | - /* background: unset; */ | |
732 | -} | |
733 | - | |
734 | -.td.cbi-section-actions>*>.cbi-button-down, | |
735 | -.cbi-input-down { | |
736 | - /* background: unset; */ | |
737 | -} | |
738 | - | |
739 | -#cbi-network .tr, | |
740 | -#cbi-wireless .tr, | |
741 | -.tr .tr:first-child, | |
742 | -#cbi-network tr, | |
743 | -#cbi-wireless tr, | |
744 | -tr tr:first-child { | |
745 | - border-top: 0; | |
746 | -} | |
747 | - | |
748 | -#cbi-network .tr, | |
749 | -#cbi-wireless .tr, | |
750 | -.tr .tr, | |
751 | -#cbi-network tr, | |
752 | -#cbi-wireless tr, | |
753 | -tr tr { | |
754 | - border-bottom: 0; | |
755 | -} | |
756 | - | |
757 | -#cpu_free, | |
758 | -#memtotal, | |
759 | -#memfree, | |
760 | -#memcache, | |
761 | -#membuff, | |
762 | -#conns, | |
763 | -#swaptotal, | |
764 | -#swapfree { | |
765 | - line-height: 18px; | |
766 | -} | |
767 | - | |
768 | -#cpu_free>div, | |
769 | -#memtotal>div, | |
770 | -#memfree>div, | |
771 | -#memcache>div, | |
772 | -#membuff>div, | |
773 | -#conns>div, | |
774 | -#swaptotal>div, | |
775 | -#swapfree>div { | |
776 | - border: 1.5px solid #bbb !important; | |
777 | - border-radius: 5px; | |
778 | - width: 240px !important; | |
779 | -} | |
780 | - | |
781 | -#cpu_free>div>div, | |
782 | -#memtotal>div>div, | |
783 | -#memfree>div>div, | |
784 | -#memcache>div>div, | |
785 | -#membuff>div>div, | |
786 | -#conns>div>div, | |
787 | -#swaptotal>div>div, | |
788 | -#swapfree>div>div { | |
789 | - background: #00adff7a !important; | |
790 | - height: 18px !important; | |
791 | - border-radius: 3px; | |
792 | -} | |
793 | - | |
794 | - | |
795 | -/* Form */ | |
796 | - | |
797 | -input, | |
798 | -textarea, | |
799 | -select { | |
800 | - display: inline-block; | |
801 | - width: 16em; | |
802 | - padding: 0.4em; | |
803 | - border: 1px solid #118af3; | |
804 | - border-radius: 5px; | |
805 | - box-sizing: border-box; | |
806 | - color: #111; | |
807 | - font: inherit; | |
808 | - line-height: 18px; | |
809 | -} | |
810 | - | |
811 | -table.cbi-section-table input, | |
812 | -table.cbi-section-table textarea, | |
813 | -table.cbi-section-table select, | |
814 | -.table.cbi-section-table input, | |
815 | -.table.cbi-section-table textarea, | |
816 | -.table.cbi-section-table select { | |
817 | - width: auto; | |
818 | -} | |
819 | - | |
820 | -#cbi-network-switch_vlan select, | |
821 | -#cbi-firewall-zone select, | |
822 | -#cbi-firewall-redirect select { | |
823 | - width: auto; | |
824 | -} | |
825 | - | |
826 | -input:active, | |
827 | -input:focus { | |
828 | - outline: 0; | |
829 | - border-color: #118af3; | |
830 | -} | |
831 | - | |
832 | -input[type=file]:focus, | |
833 | -input[type=checkbox]:focus, | |
834 | -textarea:focus, | |
835 | -select:focus { | |
836 | - outline: 0; | |
837 | -} | |
838 | - | |
839 | -input[type=button], | |
840 | -input[type=reset], | |
841 | -input[type=submit], | |
842 | -button { | |
843 | - width: auto !important; | |
844 | -} | |
845 | - | |
846 | -input[type=checkbox], | |
847 | -input[type=radio] { | |
848 | - width: auto; | |
849 | - margin: 0; | |
850 | - vertical-align: middle; | |
851 | - cursor: pointer; | |
852 | -} | |
853 | - | |
854 | -input[type=file] { | |
855 | - padding: 0; | |
856 | - border: 0; | |
857 | -} | |
858 | - | |
859 | -.cbi-input-invalid, | |
860 | -.cbi-value-error input { | |
861 | - color: #f00; | |
862 | - border-color: #f00 !important; | |
863 | -} | |
864 | - | |
865 | -.cbi-image-button { | |
866 | - margin: 10px 8px; | |
867 | - vertical-align: middle; | |
868 | -} | |
869 | - | |
870 | -.uneditable-input { | |
871 | - background: #fafafa; | |
872 | - border-color: #f2f2f2; | |
873 | - color: #ccc; | |
874 | - cursor: not-allowed; | |
875 | -} | |
876 | - | |
877 | -.uneditable-input:active, | |
878 | -.uneditable-input:focus { | |
879 | - border-color: #f2f2f2; | |
880 | -} | |
881 | - | |
882 | -.cbi-value-description { | |
883 | - /* display: inline; */ | |
884 | - background-image: url(/luci-static/resources/cbi/help.gif); | |
885 | - /* background-position-x: 0px; | |
886 | - background-position-y: 1px; */ | |
887 | - background-position: 0em 0.3em; | |
888 | - background-repeat: no-repeat; | |
889 | - padding: 0 1.2rem; | |
890 | -} | |
891 | - | |
892 | -.cbi-value-description img { | |
893 | - display: none; | |
894 | - vertical-align: sub; | |
895 | -} | |
896 | - | |
897 | -.cbi-page-actions { | |
898 | - text-align: right; | |
899 | - padding: 10px 0px; | |
900 | -} | |
901 | - | |
902 | -.cbi-page-actions.right { | |
903 | - float: inherit; | |
904 | -} | |
905 | - | |
906 | - | |
907 | -/* Button */ | |
908 | - | |
909 | -.cbi-button, | |
910 | -button { | |
911 | - border-radius: 6px !important; | |
912 | - display: inline-block; | |
913 | - background: #fff; | |
914 | - border: 1px solid #118af3; | |
915 | - border-radius: 2px; | |
916 | - box-shadow: 0 2px 2px rgba(0, 0, 0, .05); | |
917 | - color: #333; | |
918 | - line-height: 16px; | |
919 | - padding: 0.5em; | |
920 | - cursor: pointer; | |
921 | - margin-left: 0.2em; | |
922 | -} | |
923 | - | |
924 | -.cbi-button:active, | |
925 | -.cbi-button:focus button:active, | |
926 | -button:focus { | |
927 | - border-color: #bbb; | |
928 | -} | |
929 | - | |
930 | -.cbi-button-up, | |
931 | -.cbi-input-up { | |
932 | - background-position: center; | |
933 | - background-image: url('../resources/cbi/up.gif'), linear-gradient(#ffffff, #ffffff 50%, #e6e6e6); | |
934 | - background-repeat: no-repeat; | |
935 | - padding-left: 15px; | |
936 | - padding-right: 15px; | |
937 | -} | |
938 | - | |
939 | -.cbi-button-down, | |
940 | -.cbi-input-down { | |
941 | - background-position: center; | |
942 | - background-image: url('../resources/cbi/down.gif'), linear-gradient(#ffffff, #ffffff 50%, #e6e6e6); | |
943 | - background-repeat: no-repeat; | |
944 | - padding-left: 15px; | |
945 | - padding-right: 15px; | |
946 | -} | |
947 | - | |
948 | -.cbi-button-add, | |
949 | -.cbi-input-add { | |
950 | - background: #19a4e6; | |
951 | - border-color: #19a4e6; | |
952 | - color: #fff; | |
953 | -} | |
954 | - | |
955 | -.cbi-button-add:active, | |
956 | -.cbi-button-add:focus, | |
957 | -.cbi-input-add:active, | |
958 | -.cbi-input-add:focus { | |
959 | -} | |
960 | - | |
961 | -.cbi-button-remove, | |
962 | -.cbi-input-remove, | |
963 | -.cbi-section-remove input { | |
964 | - border-color: red; | |
965 | - background-color: red; | |
966 | - color: #fff; | |
967 | -} | |
968 | - | |
969 | -.cbi-button-remove:active, | |
970 | -.cbi-button-remove:focus, | |
971 | -.cbi-input-remove:active, | |
972 | -.cbi-input-remove:focus, | |
973 | -.cbi-section-remove input:active, | |
974 | -.cbi-section-remove input:focus { | |
975 | -} | |
976 | - | |
977 | -.cbi-button-reload, | |
978 | -.cbi-input-reload { | |
979 | - background: rgb(148, 143, 225); | |
980 | - border-color: rgb(148, 143, 225); | |
981 | - color: #fff; | |
982 | -} | |
983 | - | |
984 | -.cbi-button-reload:active, | |
985 | -.cbi-button-reload:focus, | |
986 | -.cbi-input-reload:active, | |
987 | -.cbi-input-reload:focus { | |
988 | -} | |
989 | - | |
990 | -.cbi-button-reset, | |
991 | -.cbi-input-reset { | |
992 | - background: #6bde84; | |
993 | - border-color: #6bde84; | |
994 | - color: #fff; | |
995 | -} | |
996 | - | |
997 | -.cbi-button-reset:active, | |
998 | -.cbi-button-reset:focus, | |
999 | -.cbi-input-reset:active, | |
1000 | -.cbi-input-reset:focus { | |
1001 | -} | |
1002 | - | |
1003 | -.cbi-button-edit, | |
1004 | -.cbi-input-edit { | |
1005 | - background: #ff7700; | |
1006 | - border-color: #ff7700; | |
1007 | - color: #fff; | |
1008 | -} | |
1009 | - | |
1010 | -.cbi-button-edit:active, | |
1011 | -.cbi-button-edit:focus, | |
1012 | -.cbi-input-edit:active, | |
1013 | -.cbi-input-edit:focus { | |
1014 | -} | |
1015 | - | |
1016 | -.cbi-button-apply, | |
1017 | -.cbi-input-apply { | |
1018 | - background: rgb(0, 171, 232); | |
1019 | - border-color: rgb(0, 171, 232); | |
1020 | - color: #fff; | |
1021 | -} | |
1022 | - | |
1023 | -.cbi-button-apply:active, | |
1024 | -.cbi-button-apply:focus, | |
1025 | -.cbi-input-apply:active, | |
1026 | -.cbi-input-apply:focus { | |
1027 | -} | |
1028 | - | |
1029 | -.cbi-button-save, | |
1030 | -.cbi-input-save { | |
1031 | - background: rgb(148, 143, 225); | |
1032 | - border-color: rgb(148, 143, 225); | |
1033 | - color: #fff; | |
1034 | -} | |
1035 | - | |
1036 | -.cbi-button-save:active, | |
1037 | -.cbi-button-save:focus, | |
1038 | -.cbi-input-save:active, | |
1039 | -.cbi-input-save:focus { | |
1040 | -} | |
1041 | - | |
1042 | -/* LuCI 18 DynamicList */ | |
1043 | -input[type="text"] + .cbi-button, | |
1044 | -input[type="password"] + .cbi-button, | |
1045 | -select + .cbi-button { | |
1046 | - padding: 4px 8px; | |
1047 | -} | |
1048 | - | |
1049 | - | |
1050 | -/* Input Error */ | |
1051 | - | |
1052 | -.cbi-section-error { | |
1053 | - background: #fee; | |
1054 | - border: 2px solid #f00; | |
1055 | - padding: 10px; | |
1056 | -} | |
1057 | - | |
1058 | -.cbi-section-error ul { | |
1059 | - padding-left: 20px; | |
1060 | -} | |
1061 | - | |
1062 | -.cbi-section-error ul li { | |
1063 | - color: #f00; | |
1064 | - list-style: disc; | |
1065 | -} | |
1066 | - | |
1067 | - | |
1068 | -/* Interface */ | |
1069 | - | |
1070 | -.ifacebox { | |
1071 | - text-align: center; | |
1072 | - margin-right: 60px; | |
1073 | -} | |
1074 | - | |
1075 | -.ifacebox .ifacebox-head { | |
1076 | - border-bottom: 1px solid #ccc; | |
1077 | - padding: 2px; | |
1078 | - background: #eee; | |
1079 | -} | |
1080 | - | |
1081 | -.ifacebox .ifacebox-head.active { | |
1082 | - background: #85d8ff; | |
1083 | -} | |
1084 | - | |
1085 | -.ifacebox .ifacebox-body { | |
1086 | - border: 2px solid #f2f2f2; | |
1087 | - border-top: 0; | |
1088 | - border-radius: 0 0 4px 4px; | |
1089 | - padding: 2px 10px; | |
1090 | -} | |
1091 | - | |
1092 | -.network-status-table .ifacebox-body { | |
1093 | - display: flex; | |
1094 | - flex-direction: column; | |
1095 | - height: 100%; | |
1096 | - text-align: left; | |
1097 | -} | |
1098 | - | |
1099 | -.network-status-table .ifacebox { | |
1100 | - margin: .5em; | |
1101 | - flex-grow: 1; | |
1102 | -} | |
1103 | - | |
1104 | -.ifacebox .ifacebox-body { | |
1105 | - padding: .25em; | |
1106 | -} | |
1107 | - | |
1108 | -.ifacebox { | |
1109 | - background-color: #fff; | |
1110 | - border: 1px solid #ccc; | |
1111 | - margin: 0 10px; | |
1112 | - text-align: center; | |
1113 | - white-space: nowrap; | |
1114 | - background-image: linear-gradient(#fff, #fff 25%, #f9f9f9); | |
1115 | - text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); | |
1116 | - border-radius: 4px; | |
1117 | - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); | |
1118 | - display: inline-flex; | |
1119 | - flex-direction: column; | |
1120 | - line-height: 1.2em; | |
1121 | - min-width: 100px; | |
1122 | -} | |
1123 | - | |
1124 | -.ifacebadge { | |
1125 | - display: inline-block; | |
1126 | - flex-direction: row; | |
1127 | - white-space: nowrap; | |
1128 | - background-color: #fff; | |
1129 | - border: 1px solid #ccc; | |
1130 | - padding: 2px; | |
1131 | - background-image: linear-gradient(#fff, #fff 25%, #f9f9f9); | |
1132 | - text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); | |
1133 | - border-radius: 4px; | |
1134 | - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); | |
1135 | - cursor: default; | |
1136 | - line-height: 1.2em; | |
1137 | -} | |
1138 | - | |
1139 | -.ifacebadge.large, | |
1140 | -.network-status-table .ifacebox-body .ifacebadge { | |
1141 | - display: inline-flex; | |
1142 | - flex: 1; | |
1143 | - padding: .25em; | |
1144 | - min-width: 220px; | |
1145 | - margin: .125em; | |
1146 | - float: left; | |
1147 | -} | |
1148 | - | |
1149 | -.ifacebadge img { | |
1150 | - width: 16px; | |
1151 | - height: 16px; | |
1152 | - vertical-align: middle; | |
1153 | -} | |
1154 | - | |
1155 | -.ifacebadge>*, | |
1156 | -.ifacebadge.large>* { | |
1157 | - margin: 0 .125em; | |
1158 | -} | |
1159 | - | |
1160 | -.ifacebadge>*, | |
1161 | -.ifacebadge.large>* { | |
1162 | - margin: 0 .125em; | |
1163 | -} | |
1164 | - | |
1165 | -.network-status-table { | |
1166 | - display: flex; | |
1167 | - flex-wrap: wrap; | |
1168 | -} | |
1169 | - | |
1170 | -.cbi-tooltip { | |
1171 | - position: absolute; | |
1172 | - z-index: 1000; | |
1173 | - left: -10000px; | |
1174 | - box-shadow: 0 0 2px #ccc; | |
1175 | - border-radius: 3px; | |
1176 | - background: #fff; | |
1177 | - white-space: pre; | |
1178 | - opacity: 0; | |
1179 | - transition: opacity .25s ease-in; | |
1180 | - padding: 2px 5px; | |
1181 | -} | |
1182 | - | |
1183 | -.cbi-tooltip-container { | |
1184 | - /* cursor: help; */ | |
1185 | -} | |
1186 | - | |
1187 | - | |
1188 | -/* Firewall */ | |
1189 | - | |
1190 | -.zonebadge { | |
1191 | - display: inline-block; | |
1192 | - border-radius: 4px; | |
1193 | - color: #333; | |
1194 | - white-space: nowrap; | |
1195 | - padding: 0 8px; | |
1196 | - cursor: pointer; | |
1197 | -} | |
1198 | - | |
1199 | -.zonebadge em, | |
1200 | -.zonebadge strong { | |
1201 | - margin: 0 5px; | |
1202 | -} | |
1203 | - | |
1204 | -.zonebadge-empty { | |
1205 | - border: 2px dashed #ddd; | |
1206 | - color: #ddd; | |
1207 | - font-style: italic; | |
1208 | -} | |
1209 | - | |
1210 | -.zone-forwards { | |
1211 | - display: flex; | |
1212 | - flex-wrap: wrap; | |
1213 | -} | |
1214 | - | |
1215 | -.zone-forwards .zone-src, | |
1216 | -.zone-forwards .zone-dest { | |
1217 | - display: flex; | |
1218 | - flex-direction: column; | |
1219 | -} | |
1220 | - | |
1221 | -.zone-forwards>span { | |
1222 | - flex-basis: 10%; | |
1223 | - text-align: center; | |
1224 | -} | |
1225 | - | |
1226 | -.zone-forwards>* { | |
1227 | - flex: 1 1 40%; | |
1228 | - padding: 1px; | |
1229 | -} | |
1230 | - | |
1231 | - | |
1232 | -/* Footer */ | |
1233 | - | |
1234 | -footer { | |
1235 | - border-top: 1px solid #34aee8; | |
1236 | - color: #111; | |
1237 | - text-align: center; | |
1238 | - padding: 10px 0; | |
1239 | - margin-top: 10px; | |
1240 | -} | |
1241 | - | |
1242 | -footer a { | |
1243 | - color: #118af3; | |
1244 | -} | |
1245 | - | |
1246 | -footer a:hover { | |
1247 | - color: #fff; | |
1248 | -} | |
1249 | - | |
1250 | - | |
1251 | -/* diy */ | |
1252 | - | |
1253 | -#wan4_i, | |
1254 | -#wan6_i { | |
1255 | - vertical-align: top; | |
1256 | - width: 50px !important; | |
1257 | -} | |
1258 | - | |
1259 | -/* login */ | |
1260 | -body.node-main-login { | |
1261 | - /* background: url(bg.jpg); */ | |
1262 | - background: linear-gradient(#8f97f59e,#22b9a4); | |
1263 | - background-repeat: no-repeat; | |
1264 | - background-size: 100% 100%; | |
1265 | - -moz-background-size: 100% 100%; | |
1266 | - padding-top: unset; | |
1267 | -} | |
1268 | - | |
1269 | -body.node-main-login>header { | |
1270 | - background: none; | |
1271 | - border-bottom: none; | |
1272 | -} | |
1273 | - | |
1274 | -body.node-main-login .alert-message { | |
1275 | - z-index: 999; | |
1276 | -} | |
1277 | - | |
1278 | -.node-main-login>.container>form { | |
1279 | - width: 20rem; | |
1280 | - display: inline-block; | |
1281 | - padding: 1rem 1rem; | |
1282 | - border-radius: .375rem; | |
1283 | - text-align: center; | |
1284 | - position: absolute; | |
1285 | - top: 50%; | |
1286 | - left: 50%; | |
1287 | - transform: translate(-50%, -50%); | |
1288 | -} | |
1289 | - | |
1290 | -.node-main-login>.container>form .errorbox { | |
1291 | - color: red; | |
1292 | -} | |
1293 | - | |
1294 | -.node-main-login>.container>form>.cbi-map>h2 { | |
1295 | - width: 100px; | |
1296 | - height: 100px; | |
1297 | - color: #fff; | |
1298 | - text-align: center; | |
1299 | - letter-spacing: 4px; | |
1300 | - display: block; | |
1301 | - margin: -100px auto 15px auto; | |
1302 | - padding: 0; | |
1303 | - text-indent: -500px; | |
1304 | - overflow: hidden; | |
1305 | - border-radius: 60px; | |
1306 | - /* border: #118af3 3px solid; */ | |
1307 | - background-image: url(wifi.png); | |
1308 | - background-size: cover; | |
1309 | - /* box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(156, 39, 176, 0.4); */ | |
1310 | -} | |
1311 | - | |
1312 | -.node-main-login>.container>form input[name='luci_username'], | |
1313 | -.node-main-login>.container>form input[name='luci_password'] { | |
1314 | - background: unset; | |
1315 | - color: #000; | |
1316 | -} | |
1317 | - | |
1318 | -.node-main-login>.container>form>.cbi-map>.cbi-section { | |
1319 | - display: inline-block; | |
1320 | -} | |
1321 | - | |
1322 | -.node-main-login>.container>footer { | |
1323 | - position: absolute; | |
1324 | - top: 40%; | |
1325 | - left: 50%; | |
1326 | - transform: translate(-50%, -50%); | |
1327 | - width: 100%; | |
1328 | - margin-top: 60px; | |
1329 | - display: none; | |
1330 | -} | |
1331 | - | |
1332 | -.node-main-login>.container>form .cbi-page-actions { | |
1333 | - text-align: center !important; | |
1334 | -} | |
1335 | - | |
1336 | -/* luci18 */ | |
1337 | -.cbi-section-table-titles.named::before { | |
1338 | - content: attr(data-title) " "; | |
1339 | - display: table-cell; | |
1340 | - padding: 5px 3px !important; | |
1341 | - line-height: 18px; | |
1342 | - font-weight: bold; | |
1343 | - vertical-align: middle; | |
1344 | - color: #811; | |
1345 | -} | |
1346 | - | |
1347 | -.cbi-section-table-descr.named::before { | |
1348 | - content: attr(data-title) " "; | |
1349 | - display: table-cell; | |
1350 | - padding: 10px 10px 9px; | |
1351 | - line-height: 18px; | |
1352 | - font-weight: bold; | |
1353 | - vertical-align: middle; | |
1354 | -} | |
1355 | - | |
1356 | -.cbi-section-table-row[data-title]::before { | |
1357 | - border-top: 1px solid #a9b1bb26; | |
1358 | - content: attr(data-title) " "; | |
1359 | - display: table-cell; | |
1360 | - padding: 10px 10px 9px; | |
1361 | - line-height: 18px; | |
1362 | - font-weight: bold; | |
1363 | - vertical-align: middle; | |
1364 | -} | |
1365 | - | |
1366 | -/* luci 19 */ | |
1367 | -body.modal-overlay-active { | |
1368 | - overflow: hidden; | |
1369 | - height: 100vh; | |
1370 | -} | |
1371 | - | |
1372 | -body.modal-overlay-active #modal_overlay { | |
1373 | - visibility: visible; | |
1374 | - left: 0; | |
1375 | - right: 0; | |
1376 | - opacity: 1; | |
1377 | -} | |
1378 | - | |
1379 | -body.modal-overlay-active #modal_overlay>.modal { | |
1380 | - align-items: center; | |
1381 | - box-shadow: 0 0 3px #444; | |
1382 | - display: flex; | |
1383 | - flex-wrap: wrap; | |
1384 | - max-height: unset; | |
1385 | - max-width: unset; | |
1386 | - min-height: 32px; | |
1387 | - min-width: 270px; | |
1388 | - background: linear-gradient(to bottom, #fceec1, #eedc94) repeat-x !important; | |
1389 | - border-radius: 3px; | |
1390 | - padding: 1em; | |
1391 | - margin: 0; | |
1392 | - position: absolute; | |
1393 | - top: 15%; | |
1394 | - left: 50%; | |
1395 | - transform: translate(-50%, -15%); | |
1396 | -} | |
1397 | - | |
1398 | -#modal_overlay { | |
1399 | - visibility: hidden; | |
1400 | - position: fixed; | |
1401 | - top: 0; | |
1402 | - bottom: 0; | |
1403 | - left: -10000px; | |
1404 | - right: 10000px; | |
1405 | - background: rgba(0, 0, 0, 0.7); | |
1406 | - z-index: 900; | |
1407 | - overflow-y: scroll; | |
1408 | - -webkit-overflow-scrolling: touch; | |
1409 | - transition: opacity .125s ease-in; | |
1410 | - opacity: 0; | |
1411 | -} | |
1412 | - | |
1413 | -#modal_overlay>.modal.uci-dialog, | |
1414 | -#modal_overlay>.modal.cbi-modal { | |
1415 | - max-width: 900px; | |
1416 | -} | |
1417 | - | |
1418 | -/*.modal.alert-message.notice { | |
1419 | - position: absolute; | |
1420 | - padding: 15px; | |
1421 | - margin-bottom: 10px; | |
1422 | - background: linear-gradient(to bottom, #fceec1, #eedc94) repeat-x; | |
1423 | - border: 1px solid rgba(0, 0, 0, .1); | |
1424 | - border-width: 2px 0; | |
1425 | -}*/ | |
1426 | - | |
1427 | -.modal>* { | |
1428 | - flex-basis: 100%; | |
1429 | - line-height: normal; | |
1430 | - margin-bottom: .5em; | |
1431 | - max-width: 100%; | |
1432 | -} | |
1433 | - | |
1434 | -#modal_overlay .modal>* { | |
1435 | - flex-basis: 100%; | |
1436 | - line-height: normal; | |
1437 | - margin-bottom: .5em; | |
1438 | -} | |
1439 | - | |
1440 | -[data-tab-title] { | |
1441 | - height: 0; | |
1442 | - opacity: 0; | |
1443 | - overflow: hidden; | |
1444 | -} | |
1445 | - | |
1446 | -[data-tab-active="true"], | |
1447 | -.cbi-filebrowser.open { | |
1448 | - height: auto; | |
1449 | - opacity: 1; | |
1450 | - overflow: visible; | |
1451 | - transition: opacity .25s ease-in; | |
1452 | -} | |
1453 | - | |
1454 | -.tabs>li:not(.active), | |
1455 | -.cbi-tabmenu>.cbi-tab-disabled { | |
1456 | - color: #999; | |
1457 | -} | |
1458 | - | |
1459 | -.cbi-dynlist { | |
1460 | - height: auto; | |
1461 | - min-height: 30px; | |
1462 | - display: inline-flex; | |
1463 | - flex-direction: column; | |
1464 | -} | |
1465 | - | |
1466 | -.cbi-dropdown:not(.btn):not(.cbi-button), | |
1467 | -.cbi-dynlist { | |
1468 | - min-width: 210px; | |
1469 | - max-width: 400px; | |
1470 | - width: auto; | |
1471 | - background: white; | |
1472 | - border: 1px solid #118af3; | |
1473 | - border-radius: 5px; | |
1474 | - box-sizing: border-box; | |
1475 | - padding: 0 0.4em !important; | |
1476 | -} | |
1477 | - | |
1478 | -.cbi-dynlist>.item { | |
1479 | - margin-bottom: 4px; | |
1480 | - box-shadow: 0 0 2px #ccc; | |
1481 | - background: #fff; | |
1482 | - border: 1px solid #118af3; | |
1483 | - border-radius: 3px; | |
1484 | - position: relative; | |
1485 | - pointer-events: none; | |
1486 | - padding: 2px 2em 2px 4px; | |
1487 | -} | |
1488 | - | |
1489 | -.cbi-dynlist>.item::after { | |
1490 | - content: "×"; | |
1491 | - position: absolute; | |
1492 | - display: inline-flex; | |
1493 | - align-items: center; | |
1494 | - top: -1px; | |
1495 | - right: -1px; | |
1496 | - bottom: -1px; | |
1497 | - border: 1px solid #ccc; | |
1498 | - border-radius: 0 3px 3px 0; | |
1499 | - font-weight: 700; | |
1500 | - color: #c44; | |
1501 | - pointer-events: auto; | |
1502 | - padding: 0 6px; | |
1503 | -} | |
1504 | - | |
1505 | -.cbi-dynlist>.add-item, | |
1506 | -.td.cbi-section-actions>* { | |
1507 | - /* display: flex; */ | |
1508 | -} | |
1509 | - | |
1510 | -.cbi-dynlist>.add-item>input, | |
1511 | -.cbi-dynlist>.add-item>button { | |
1512 | - flex: 1 1 auto; | |
1513 | - overflow: hidden; | |
1514 | - text-overflow: ellipsis; | |
1515 | - white-space: nowrap; | |
1516 | -} | |
1517 | - | |
1518 | -.cbi-dropdown.btn>.open, | |
1519 | -.cbi-dropdown.cbi-button>.open { | |
1520 | - margin-left: .5em; | |
1521 | - border-left: 1px solid; | |
1522 | - padding: 0 .5em; | |
1523 | -} | |
1524 | - | |
1525 | -.cbi-dropdown.btn>ul:not(.dropdown), | |
1526 | -.cbi-dropdown.cbi-button>ul:not(.dropdown) { | |
1527 | - margin: 0 0 0 13px !important; | |
1528 | -} | |
1529 | - | |
1530 | -.btn.primary, | |
1531 | -.cbi-button-action.important { | |
1532 | - color: #fff; | |
1533 | - background: #118af3; | |
1534 | - border: 1px solid #118af3; | |
1535 | -} | |
1536 | - | |
1537 | -.cbi-dropdown { | |
1538 | - display: inline-flex !important; | |
1539 | - cursor: pointer; | |
1540 | - height: auto; | |
1541 | - position: relative; | |
1542 | - padding: 0 !important; | |
1543 | -} | |
1544 | - | |
1545 | -.cbi-progressbar { | |
1546 | - border: 1px solid #ccc; | |
1547 | - border-radius: 3px; | |
1548 | - position: relative; | |
1549 | - min-width: 170px; | |
1550 | - height: 20px; | |
1551 | - background: #f9f9f9; | |
1552 | - margin: 4px 0; | |
1553 | -} | |
1554 | - | |
1555 | -.cbi-progressbar>div { | |
1556 | - background: #85d8ff; | |
1557 | - height: 100%; | |
1558 | - transition: width .25s ease-in; | |
1559 | - width: 0%; | |
1560 | -} | |
1561 | - | |
1562 | -.cbi-progressbar::after { | |
1563 | - position: absolute; | |
1564 | - bottom: 0; | |
1565 | - top: 0; | |
1566 | - right: 0; | |
1567 | - left: 0; | |
1568 | - text-align: center; | |
1569 | - text-shadow: 0 0 2px #fff; | |
1570 | - content: attr(title); | |
1571 | - white-space: pre; | |
1572 | - overflow: hidden; | |
1573 | - text-overflow: ellipsis; | |
1574 | -} | |
\ No newline at end of file |
@@ -1,3 +0,0 @@ | ||
1 | -// HTML5 Shiv v3 | @jon_neal @afarkas @rem | MIT/GPL2 Licensed | |
2 | -// Uncompressed source: https://github.com/aFarkas/html5shiv | |
3 | -(function(a,b){function f(a){var c,d,e,f;b.documentMode>7?(c=b.createElement("font"),c.setAttribute("data-html5shiv",a.nodeName.toLowerCase())):c=b.createElement("shiv:"+a.nodeName);while(a.firstChild)c.appendChild(a.childNodes[0]);for(d=a.attributes,e=d.length,f=0;f<e;++f)d[f].specified&&c.setAttribute(d[f].nodeName,d[f].nodeValue);c.style.cssText=a.style.cssText,a.parentNode.replaceChild(c,a),c.originalElement=a}function g(a){var b=a.originalElement;while(a.childNodes.length)b.appendChild(a.childNodes[0]);a.parentNode.replaceChild(b,a)}function h(a,b){b=b||"all";var c=-1,d=[],e=a.length,f,g;while(++c<e){f=a[c],g=f.media||b;if(f.disabled||!/print|all/.test(g))continue;d.push(h(f.imports,g),f.cssText)}return d.join("")}function i(c){var d=new RegExp("(^|[\\s,{}])("+a.html5.elements.join("|")+")","gi"),e=c.split("{"),f=e.length,g=-1;while(++g<f)e[g]=e[g].split("}"),b.documentMode>7?e[g][e[g].length-1]=e[g][e[g].length-1].replace(d,'$1font[data-html5shiv="$2"]'):e[g][e[g].length-1]=e[g][e[g].length-1].replace(d,"$1shiv\\:$2"),e[g]=e[g].join("}");return e.join("{")}var c=function(a){return a.innerHTML="<x-element></x-element>",a.childNodes.length===1}(b.createElement("a")),d=function(a,b,c){return b.appendChild(a),(c=(c?c(a):a.currentStyle).display)&&b.removeChild(a)&&c==="block"}(b.createElement("nav"),b.documentElement,a.getComputedStyle),e={elements:"abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output progress section summary time video".split(" "),shivDocument:function(a){a=a||b;if(a.documentShived)return;a.documentShived=!0;var f=a.createElement,g=a.createDocumentFragment,h=a.getElementsByTagName("head")[0],i=function(a){f(a)};c||(e.elements.join(" ").replace(/\w+/g,i),a.createElement=function(a){var b=f(a);return b.canHaveChildren&&e.shivDocument(b.document),b},a.createDocumentFragment=function(){return e.shivDocument(g())});if(!d&&h){var j=f("div");j.innerHTML=["x<style>","article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display:block}","audio{display:none}","canvas,video{display:inline-block;*display:inline;*zoom:1}","[hidden]{display:none}audio[controls]{display:inline-block;*display:inline;*zoom:1}","mark{background:#FF0;color:#000}","</style>"].join(""),h.insertBefore(j.lastChild,h.firstChild)}return a}};e.shivDocument(b),a.html5=e;if(c||!a.attachEvent)return;a.attachEvent("onbeforeprint",function(){if(a.html5.supportsXElement||!b.namespaces)return;b.namespaces.shiv||b.namespaces.add("shiv");var c=-1,d=new RegExp("^("+a.html5.elements.join("|")+")$","i"),e=b.getElementsByTagName("*"),g=e.length,j,k=i(h(function(a,b){var c=[],d=a.length;while(d)c.unshift(a[--d]);d=b.length;while(d)c.unshift(b[--d]);c.sort(function(a,b){return a.sourceIndex-b.sourceIndex}),d=c.length;while(d)c[--d]=c[d].styleSheet;return c}(b.getElementsByTagName("style"),b.getElementsByTagName("link"))));while(++c<g)j=e[c],d.test(j.nodeName)&&f(j);b.appendChild(b._shivedStyleSheet=b.createElement("style")).styleSheet.cssText=k}),a.attachEvent("onafterprint",function(){if(a.html5.supportsXElement||!b.namespaces)return;var c=-1,d=b.getElementsByTagName("*"),e=d.length,f;while(++c<e)f=d[c],f.originalElement&&g(f);b._shivedStyleSheet&&b._shivedStyleSheet.parentNode.removeChild(b._shivedStyleSheet)})})(this,document) | |
\ No newline at end of file |
@@ -1,78 +0,0 @@ | ||
1 | -@media screen and (max-width: 1600px) { | |
2 | - | |
3 | - header h3 a, | |
4 | - header .brand { | |
5 | - display: none !important; | |
6 | - } | |
7 | -} | |
8 | - | |
9 | -@media screen and (max-width: 1600px) { | |
10 | - .container>.pull-right>* { | |
11 | - position: absolute; | |
12 | - right: 0.5rem; | |
13 | - cursor: pointer; | |
14 | - } | |
15 | -} | |
16 | - | |
17 | -@media screen and (max-width: 1024px) { | |
18 | - body { | |
19 | - font-size: 12px; | |
20 | - } | |
21 | - | |
22 | - header { | |
23 | - font-size: 13px; | |
24 | - } | |
25 | - | |
26 | - legend { | |
27 | - font-size: 14px; | |
28 | - } | |
29 | - | |
30 | - .dropdown-menu a { | |
31 | - font-size: 13px; | |
32 | - min-width: 130px; | |
33 | - padding: 0 15px; | |
34 | - } | |
35 | - | |
36 | - .mobile-hide { | |
37 | - display: none; | |
38 | - } | |
39 | - | |
40 | - #maincontent.container { | |
41 | - padding: 0px 10px; | |
42 | - } | |
43 | - | |
44 | - div.cbi-section, | |
45 | - fieldset { | |
46 | - min-width: inherit; | |
47 | - overflow-x: auto; | |
48 | - overflow-y: hidden; | |
49 | - } | |
50 | - | |
51 | - .cbi-value {} | |
52 | - | |
53 | - .cbi-value-title { | |
54 | - width: 30%; | |
55 | - min-width: 0rem !important; | |
56 | - margin-right: 1em; | |
57 | - /* text-align: left; | |
58 | - padding-left: 1em; */ | |
59 | - } | |
60 | - | |
61 | - .cbi-value-field { | |
62 | - width: 55%; | |
63 | - } | |
64 | - | |
65 | - .cbi-value-description { | |
66 | - width: 75%; | |
67 | - display: inline-table; | |
68 | - padding: 1px 1.2rem; | |
69 | - background-position-y: 3px; | |
70 | - } | |
71 | - | |
72 | - .cbi-value-field .cbi-input-select, | |
73 | - .cbi-value input[type="password"], | |
74 | - .cbi-value input[type="text"] { | |
75 | - min-width: unset; | |
76 | - /* width: 95%; */ | |
77 | - } | |
78 | -} | |
\ No newline at end of file |
@@ -6,8 +6,8 @@ body { | ||
6 | 6 | body { |
7 | 7 | background: #ffffff; |
8 | 8 | color: #333; |
9 | - font-family: Helvetica, Arial, sans-serif; | |
10 | - font-size: 14px; | |
9 | + font-family: "Helvetica Neue, Helvetica, Arial, sans-serif"; | |
10 | + font-size: 13px; | |
11 | 11 | line-height: 1.8; |
12 | 12 | margin: 0; |
13 | 13 | /* padding-top: 60px; */ |
@@ -122,6 +122,7 @@ header { | ||
122 | 122 | box-shadow: 0 2px 2px rgba(0, 0, 0, .1); |
123 | 123 | z-index: 100; |
124 | 124 | border-bottom: 2px solid #ccc; |
125 | + background-image: linear-gradient(to bottom, #333333, #222222); | |
125 | 126 | } |
126 | 127 | |
127 | 128 | .brand { |
@@ -556,23 +557,23 @@ p { | ||
556 | 557 | |
557 | 558 | .tabs, |
558 | 559 | .cbi-tabmenu { |
559 | - border-bottom: 2px solid #ddd; | |
560 | - margin-bottom: 20px; | |
560 | + border-bottom: 1px solid #ddd; | |
561 | + margin-bottom: 15px; | |
561 | 562 | } |
562 | 563 | |
563 | 564 | .tabs li, |
564 | 565 | .cbi-tabmenu li { |
565 | 566 | display: inline-block; |
567 | + margin-bottom: -1px; | |
566 | 568 | } |
567 | 569 | |
568 | 570 | .tabs a, |
569 | 571 | .cbi-tabmenu a { |
570 | 572 | display: block; |
571 | - color: #404040; | |
573 | + /* color: #404040; */ | |
572 | 574 | line-height: 34px; |
573 | - margin-bottom: -2px; | |
574 | - margin-right: 20px; | |
575 | - padding: 0 3px; | |
575 | + margin-right: 3px; | |
576 | + padding: 0 15px; | |
576 | 577 | } |
577 | 578 | |
578 | 579 | .active a, |
@@ -581,6 +582,13 @@ p { | ||
581 | 582 | color: #111; |
582 | 583 | } |
583 | 584 | |
585 | +.tabs>li>a:hover, | |
586 | +.cbi-tabmenu>li>a:hover { | |
587 | + text-decoration: none; | |
588 | + background-color: #eee; | |
589 | + border-color: #eee #eee #ddd; | |
590 | +} | |
591 | + | |
584 | 592 | |
585 | 593 | /* Fieldset */ |
586 | 594 |
@@ -603,6 +611,7 @@ fieldset fieldset { | ||
603 | 611 | table .cbi-value-field, |
604 | 612 | .table .cbi-value-field { |
605 | 613 | display: table-cell; |
614 | + width: unset; | |
606 | 615 | } |
607 | 616 | |
608 | 617 | .cbi-value-title { |
@@ -613,7 +622,7 @@ table .cbi-value-field, | ||
613 | 622 | padding-top: 0.4em; |
614 | 623 | line-height: 1.2em; |
615 | 624 | float: left; |
616 | - width: 13em; | |
625 | + width: 14em; | |
617 | 626 | margin-right: 1.5em; |
618 | 627 | text-align: right; |
619 | 628 | color: #404040; |
@@ -622,6 +631,7 @@ table .cbi-value-field, | ||
622 | 631 | .cbi-value-field { |
623 | 632 | color: #811; |
624 | 633 | display: table-cell; |
634 | + width: 0.1%; | |
625 | 635 | } |
626 | 636 | |
627 | 637 | .cbi-section-table-cell { |
@@ -808,6 +818,17 @@ select { | ||
808 | 818 | line-height: 18px; |
809 | 819 | } |
810 | 820 | |
821 | +input[disabled], | |
822 | +select[disabled], | |
823 | +textarea[disabled], | |
824 | +input[readonly], | |
825 | +select[readonly], | |
826 | +textarea[readonly] { | |
827 | + background-color: #f5f5f5; | |
828 | + border-color: #ddd; | |
829 | + color: unset; | |
830 | +} | |
831 | + | |
811 | 832 | table.cbi-section-table input, |
812 | 833 | table.cbi-section-table textarea, |
813 | 834 | table.cbi-section-table select, |
@@ -880,11 +901,11 @@ input[type=file] { | ||
880 | 901 | } |
881 | 902 | |
882 | 903 | .cbi-value-description { |
883 | - /* display: inline; */ | |
904 | + display: inline; | |
884 | 905 | background-image: url(/luci-static/resources/cbi/help.gif); |
885 | 906 | /* background-position-x: 0px; |
886 | 907 | background-position-y: 1px; */ |
887 | - background-position: 0em 0.3em; | |
908 | + background-position: 0em 0.2em; | |
888 | 909 | background-repeat: no-repeat; |
889 | 910 | padding: 0 1.2rem; |
890 | 911 | } |
@@ -908,12 +929,11 @@ input[type=file] { | ||
908 | 929 | |
909 | 930 | .cbi-button, |
910 | 931 | button { |
911 | - border-radius: 6px !important; | |
932 | + border-radius: 4px; | |
912 | 933 | display: inline-block; |
913 | - background: #fff; | |
934 | + background: linear-gradient(#fff, #fff 25%, #e6e6e6) no-repeat; | |
914 | 935 | border: 1px solid #ccc; |
915 | - border-radius: 2px; | |
916 | - box-shadow: 0 2px 2px rgba(0, 0, 0, .05); | |
936 | + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); | |
917 | 937 | color: #333; |
918 | 938 | line-height: 16px; |
919 | 939 | padding: 0.5em; |
@@ -947,23 +967,20 @@ button:focus { | ||
947 | 967 | |
948 | 968 | .cbi-button-add, |
949 | 969 | .cbi-input-add { |
950 | - background: #404040; | |
951 | - border-color: #404040; | |
952 | - color: #fff; | |
970 | + border-color: #4a4; | |
971 | + color: #4a4; | |
953 | 972 | } |
954 | 973 | |
955 | 974 | .cbi-button-add:active, |
956 | 975 | .cbi-button-add:focus, |
957 | 976 | .cbi-input-add:active, |
958 | -.cbi-input-add:focus { | |
959 | -} | |
977 | +.cbi-input-add:focus {} | |
960 | 978 | |
961 | 979 | .cbi-button-remove, |
962 | 980 | .cbi-input-remove, |
963 | 981 | .cbi-section-remove input { |
964 | - border-color: red; | |
965 | - background-color: red; | |
966 | - color: #fff; | |
982 | + border-color: #c44; | |
983 | + color: #c44; | |
967 | 984 | } |
968 | 985 | |
969 | 986 | .cbi-button-remove:active, |
@@ -971,79 +988,74 @@ button:focus { | ||
971 | 988 | .cbi-input-remove:active, |
972 | 989 | .cbi-input-remove:focus, |
973 | 990 | .cbi-section-remove input:active, |
974 | -.cbi-section-remove input:focus { | |
975 | -} | |
991 | +.cbi-section-remove input:focus {} | |
976 | 992 | |
977 | 993 | .cbi-button-reload, |
978 | 994 | .cbi-input-reload { |
979 | - background: rgb(148, 143, 225); | |
980 | 995 | border-color: rgb(148, 143, 225); |
981 | - color: #fff; | |
996 | + color: rgb(148, 143, 225); | |
982 | 997 | } |
983 | 998 | |
984 | 999 | .cbi-button-reload:active, |
985 | 1000 | .cbi-button-reload:focus, |
986 | 1001 | .cbi-input-reload:active, |
987 | -.cbi-input-reload:focus { | |
988 | -} | |
1002 | +.cbi-input-reload:focus {} | |
989 | 1003 | |
990 | 1004 | .cbi-button-reset, |
991 | 1005 | .cbi-input-reset { |
992 | - background: #6bde84; | |
993 | - border-color: #6bde84; | |
994 | - color: #fff; | |
1006 | + border-color: #4a4; | |
1007 | + color: #4a4; | |
995 | 1008 | } |
996 | 1009 | |
997 | 1010 | .cbi-button-reset:active, |
998 | 1011 | .cbi-button-reset:focus, |
999 | 1012 | .cbi-input-reset:active, |
1000 | -.cbi-input-reset:focus { | |
1001 | -} | |
1013 | +.cbi-input-reset:focus {} | |
1002 | 1014 | |
1003 | 1015 | .cbi-button-edit, |
1004 | 1016 | .cbi-input-edit { |
1005 | - background: #ff7700; | |
1006 | 1017 | border-color: #ff7700; |
1007 | - color: #fff; | |
1018 | + color: #ff7700; | |
1008 | 1019 | } |
1009 | 1020 | |
1010 | 1021 | .cbi-button-edit:active, |
1011 | 1022 | .cbi-button-edit:focus, |
1012 | 1023 | .cbi-input-edit:active, |
1013 | -.cbi-input-edit:focus { | |
1014 | -} | |
1024 | +.cbi-input-edit:focus {} | |
1015 | 1025 | |
1016 | 1026 | .cbi-button-apply, |
1017 | 1027 | .cbi-input-apply { |
1018 | - color: #fff; | |
1019 | - background: #0069d6; | |
1020 | - border: 1px solid #0069d6; | |
1028 | + border-color: #0069d6; | |
1029 | + color: #0069d6; | |
1021 | 1030 | } |
1022 | 1031 | |
1023 | 1032 | .cbi-button-apply:active, |
1024 | 1033 | .cbi-button-apply:focus, |
1025 | 1034 | .cbi-input-apply:active, |
1026 | -.cbi-input-apply:focus { | |
1027 | -} | |
1035 | +.cbi-input-apply:focus {} | |
1028 | 1036 | |
1029 | 1037 | .cbi-button-save, |
1030 | 1038 | .cbi-input-save { |
1031 | - background: rgb(148, 143, 225); | |
1032 | 1039 | border-color: rgb(148, 143, 225); |
1033 | - color: #fff; | |
1040 | + color: rgb(148, 143, 225); | |
1034 | 1041 | } |
1035 | 1042 | |
1036 | 1043 | .cbi-button-save:active, |
1037 | 1044 | .cbi-button-save:focus, |
1038 | 1045 | .cbi-input-save:active, |
1039 | -.cbi-input-save:focus { | |
1040 | -} | |
1046 | +.cbi-input-save:focus {} | |
1041 | 1047 | |
1042 | 1048 | /* LuCI 18 DynamicList */ |
1043 | -input[type="text"] + .cbi-button, | |
1044 | -input[type="password"] + .cbi-button, | |
1045 | -select + .cbi-button { | |
1046 | - padding: 4px 8px; | |
1049 | +input[type="text"]+.cbi-button, | |
1050 | +input[type="password"]+.cbi-button, | |
1051 | +select+.cbi-button { | |
1052 | + vertical-align: top; | |
1053 | + padding: 0.4em; | |
1054 | + border-color: #ccc; | |
1055 | + margin: 0 0 1px -3px; | |
1056 | + font-size: 14px; | |
1057 | + line-height: 18px; | |
1058 | + border-radius: 5px; | |
1047 | 1059 | } |
1048 | 1060 | |
1049 | 1061 |
@@ -1115,9 +1127,9 @@ select + .cbi-button { | ||
1115 | 1127 | text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); |
1116 | 1128 | border-radius: 4px; |
1117 | 1129 | box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); |
1118 | - display: inline-flex; | |
1130 | + /* display: inline-flex; */ | |
1119 | 1131 | flex-direction: column; |
1120 | - line-height: 1.2em; | |
1132 | + line-height: 1.6em; | |
1121 | 1133 | min-width: 100px; |
1122 | 1134 | } |
1123 | 1135 |
@@ -1253,8 +1265,7 @@ footer a { | ||
1253 | 1265 | |
1254 | 1266 | /* login */ |
1255 | 1267 | body.node-main-login { |
1256 | - /* background: url(bg.jpg); */ | |
1257 | - background: linear-gradient(#22b9a4, #9a87d4); | |
1268 | + background: rgba(0, 0, 0, 0.7); | |
1258 | 1269 | background-repeat: no-repeat; |
1259 | 1270 | background-size: 100% 100%; |
1260 | 1271 | -moz-background-size: 100% 100%; |
@@ -1266,8 +1277,13 @@ body.node-main-login>header { | ||
1266 | 1277 | border-bottom: none; |
1267 | 1278 | } |
1268 | 1279 | |
1280 | +body.node-main-login>header .brand { | |
1281 | + display: none; | |
1282 | +} | |
1283 | + | |
1269 | 1284 | body.node-main-login .alert-message { |
1270 | 1285 | z-index: 999; |
1286 | + display: none; | |
1271 | 1287 | } |
1272 | 1288 | |
1273 | 1289 | .node-main-login>.container>form { |
@@ -1277,32 +1293,18 @@ body.node-main-login .alert-message { | ||
1277 | 1293 | border-radius: .375rem; |
1278 | 1294 | text-align: center; |
1279 | 1295 | position: absolute; |
1280 | - top: 50%; | |
1296 | + top: 30%; | |
1281 | 1297 | left: 50%; |
1282 | 1298 | transform: translate(-50%, -50%); |
1299 | + background: #fff; | |
1283 | 1300 | } |
1284 | 1301 | |
1285 | -.node-main-login>.container>form .errorbox { | |
1286 | - color: red; | |
1302 | +.node-main-login>.container>form .errorbox, | |
1303 | +.node-main-login>.container>form .errorbox>p { | |
1304 | + color: red !important; | |
1287 | 1305 | } |
1288 | 1306 | |
1289 | -.node-main-login>.container>form>.cbi-map>h2 { | |
1290 | - width: 100px; | |
1291 | - height: 100px; | |
1292 | - color: #fff; | |
1293 | - text-align: center; | |
1294 | - letter-spacing: 4px; | |
1295 | - display: block; | |
1296 | - margin: -100px auto 15px auto; | |
1297 | - padding: 0; | |
1298 | - text-indent: -500px; | |
1299 | - overflow: hidden; | |
1300 | - border-radius: 60px; | |
1301 | - /* border: #ccc 3px solid; */ | |
1302 | - background-image: url(wifi.png); | |
1303 | - background-size: cover; | |
1304 | - /* box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(156, 39, 176, 0.4); */ | |
1305 | -} | |
1307 | +.node-main-login>.container>form>.cbi-map>h2 {} | |
1306 | 1308 | |
1307 | 1309 | .node-main-login>.container>form input[name='luci_username'], |
1308 | 1310 | .node-main-login>.container>form input[name='luci_password'] { |
@@ -1328,6 +1330,14 @@ body.node-main-login .alert-message { | ||
1328 | 1330 | text-align: center !important; |
1329 | 1331 | } |
1330 | 1332 | |
1333 | +.node-main-login>.container .cbi-button-apply { | |
1334 | + width: 100% !important; | |
1335 | +} | |
1336 | + | |
1337 | +.node-main-login>.container .cbi-button-reset { | |
1338 | + display: none; | |
1339 | +} | |
1340 | + | |
1331 | 1341 | /* luci18 */ |
1332 | 1342 | .cbi-section-table-titles.named::before { |
1333 | 1343 | content: attr(data-title) " "; |
@@ -1359,6 +1369,10 @@ body.node-main-login .alert-message { | ||
1359 | 1369 | } |
1360 | 1370 | |
1361 | 1371 | /* luci 19 */ |
1372 | +.node-main-login>header .nav { | |
1373 | + display: none; | |
1374 | +} | |
1375 | + | |
1362 | 1376 | body.modal-overlay-active { |
1363 | 1377 | overflow: hidden; |
1364 | 1378 | height: 100vh; |
@@ -1524,9 +1538,8 @@ body.modal-overlay-active #modal_overlay>.modal { | ||
1524 | 1538 | |
1525 | 1539 | .btn.primary, |
1526 | 1540 | .cbi-button-action.important { |
1527 | - color: #fff; | |
1528 | - background: #0069d6; | |
1529 | - border: 1px solid #0069d6; | |
1541 | + border-color: #ff7700; | |
1542 | + color: #ff7700; | |
1530 | 1543 | } |
1531 | 1544 | |
1532 | 1545 | .cbi-dropdown { |
@@ -1,63 +0,0 @@ | ||
1 | -<%# | |
2 | - Copyright 2008 Steven Barth <steven@midlink.org> | |
3 | - Copyright 2008 Jo-Philipp Wich <jow@openwrt.org> | |
4 | - Copyright 2012 David Menting <david@nut-bolt.nl> | |
5 | - Copyright 2018-2020 Lienol <lawlienol@gmail.com> | |
6 | - Licensed to the public under the Apache License 2.0. | |
7 | --%> | |
8 | - | |
9 | -<% | |
10 | - local ver = require "luci.version" | |
11 | - local disp = require "luci.dispatcher" | |
12 | - local request = disp.context.path | |
13 | - local category = request[1] | |
14 | - local tree = disp.node() | |
15 | - local categories = disp.node_childs(tree) | |
16 | -%> | |
17 | - <footer> | |
18 | - <a href="https://github.com/openwrt/luci">Powered by <%= ver.luciname %></a> / <%= ver.distversion %> | |
19 | - <% if #categories > 1 then %> | |
20 | - <ul class="breadcrumb pull-right" id="modemenu"> | |
21 | - <% for i, r in ipairs(categories) do %> | |
22 | - <li<% if request[1] == r then %> class="active"<%end%>><a href="<%=controller%>/<%=r%>/"><%=striptags(translate(tree.nodes[r].title))%></a> <span class="divider">|</span></li> | |
23 | - <% end %> | |
24 | - </ul> | |
25 | - <% end %> | |
26 | - </footer> | |
27 | - </div> | |
28 | - </div> | |
29 | - </body> | |
30 | - <script> | |
31 | - window.onload = function(){ | |
32 | - var content = document.getElementsByName("content"); | |
33 | - var luci_username = document.getElementsByName("luci_username"); | |
34 | - var luci_password = document.getElementsByName("luci_password"); | |
35 | - if (content.length == 1 && luci_username.length == 1 && luci_password.length == 1) { | |
36 | - //需要登录 | |
37 | - document.body.classList.add('node-main-login'); | |
38 | - luci_username[0].parentElement.parentElement.classList.add('luci_username_div'); | |
39 | - luci_username[0].parentElement.parentElement.children[0].style.display = "none"; | |
40 | - luci_password[0].parentElement.parentElement.classList.add('luci_password_div'); | |
41 | - luci_password[0].parentElement.parentElement.children[0].style.display = "none"; | |
42 | - | |
43 | - var errorbox = document.getElementsByClassName("errorbox"); | |
44 | - var alert_message = document.getElementsByClassName("alert-message"); | |
45 | - if (errorbox.length == 1) { | |
46 | - var tips = document.getElementsByClassName("cbi-map-descr"); | |
47 | - if (tips.length == 1) { | |
48 | - tips[0].innerHTML = errorbox[0].innerHTML; | |
49 | - tips[0].classList.add('errorbox'); | |
50 | - errorbox[0].style.display = "none"; | |
51 | - } | |
52 | - } else if (alert_message.length == 1) { | |
53 | - var tips = document.getElementsByClassName("cbi-map-descr"); | |
54 | - if (tips.length == 1) { | |
55 | - tips[0].innerHTML = alert_message[0].innerHTML; | |
56 | - tips[0].classList.add('errorbox'); | |
57 | - alert_message[0].style.display = "none"; | |
58 | - } | |
59 | - } | |
60 | - } | |
61 | - } | |
62 | - </script> | |
63 | -</html> |
@@ -1,220 +0,0 @@ | ||
1 | -<%# | |
2 | - Copyright 2008 Steven Barth <steven@midlink.org> | |
3 | - Copyright 2008 Jo-Philipp Wich <jow@openwrt.org> | |
4 | - Copyright 2012 David Menting <david@nut-bolt.nl> | |
5 | - Copyright 2018-2019 Lienol <lawlienol@gmail.com> | |
6 | - Licensed to the public under the Apache License 2.0. | |
7 | --%> | |
8 | - | |
9 | -<% | |
10 | - local sys = require "luci.sys" | |
11 | - local util = require "luci.util" | |
12 | - local http = require "luci.http" | |
13 | - local disp = require "luci.dispatcher" | |
14 | - | |
15 | - local boardinfo = util.ubus("system", "board") | |
16 | - | |
17 | - local request = disp.context.path | |
18 | - local request2 = disp.context.request | |
19 | - | |
20 | - local category = request[1] | |
21 | - local cattree = category and disp.node(category) | |
22 | - | |
23 | - local leaf = request2[#request2] | |
24 | - | |
25 | - local tree = disp.node() | |
26 | - local node = disp.context.dispatched | |
27 | - | |
28 | - local categories = disp.node_childs(tree) | |
29 | - | |
30 | - local c = tree | |
31 | - local i, r | |
32 | - | |
33 | - -- tag all nodes leading to this page | |
34 | - for i, r in ipairs(request) do | |
35 | - if c.nodes and c.nodes[r] then | |
36 | - c = c.nodes[r] | |
37 | - c._menu_selected = true | |
38 | - end | |
39 | - end | |
40 | - | |
41 | - -- send as HTML5 | |
42 | - http.prepare_content("text/html") | |
43 | - | |
44 | - local function nodeurl(prefix, name, query) | |
45 | - local u = url(prefix, name) | |
46 | - if query then | |
47 | - u = u .. http.build_querystring(query) | |
48 | - end | |
49 | - return pcdata(u) | |
50 | - end | |
51 | - | |
52 | - local function render_tabmenu(prefix, node, level) | |
53 | - if not level then | |
54 | - level = 1 | |
55 | - end | |
56 | - | |
57 | - local childs = disp.node_childs(node) | |
58 | - if #childs > 0 then | |
59 | - if level > 2 then | |
60 | - write('<ul class="tabs">') | |
61 | - end | |
62 | - | |
63 | - local selected_node | |
64 | - local selected_name | |
65 | - local i, v | |
66 | - | |
67 | - for i, v in ipairs(childs) do | |
68 | - local nnode = node.nodes[v] | |
69 | - if nnode._menu_selected then | |
70 | - selected_node = nnode | |
71 | - selected_name = v | |
72 | - end | |
73 | - | |
74 | - if level > 2 then | |
75 | - write('<li class="tabmenu-item-%s %s"><a href="%s">%s</a></li>' %{ | |
76 | - v, (nnode._menu_selected or (node.leaf and v == leaf)) and 'active' or '', | |
77 | - nodeurl(prefix, v, nnode.query), | |
78 | - striptags(translate(nnode.title)) | |
79 | - }) | |
80 | - end | |
81 | - end | |
82 | - | |
83 | - if level > 2 then | |
84 | - write('</ul>') | |
85 | - end | |
86 | - | |
87 | - if selected_node then | |
88 | - render_tabmenu(prefix .. "/" .. selected_name, selected_node, level + 1) | |
89 | - end | |
90 | - end | |
91 | - end | |
92 | - | |
93 | - local function render_submenu(prefix, node) | |
94 | - local childs = disp.node_childs(node) | |
95 | - if #childs > 0 then | |
96 | - write('<ul class="dropdown-menu">') | |
97 | - | |
98 | - for i, r in ipairs(childs) do | |
99 | - local nnode = node.nodes[r] | |
100 | - write('<li><a href="%s">%s</a></li>' %{ | |
101 | - nodeurl(prefix, r, nnode.query), | |
102 | - pcdata(striptags(translate(nnode.title))) | |
103 | - }) | |
104 | - end | |
105 | - | |
106 | - write('</ul>') | |
107 | - end | |
108 | - end | |
109 | - | |
110 | - local function render_topmenu() | |
111 | - local childs = disp.node_childs(cattree) | |
112 | - if #childs > 0 then | |
113 | - write('<ul class="nav">') | |
114 | - | |
115 | - for i, r in ipairs(childs) do | |
116 | - local nnode = cattree.nodes[r] | |
117 | - local grandchildren = disp.node_childs(nnode) | |
118 | - | |
119 | - if #grandchildren > 0 then | |
120 | - write('<li class="dropdown"><a class="menu" href="#">%s</a>' % pcdata(striptags(translate(nnode.title)))) | |
121 | - render_submenu(category .. "/" .. r, nnode) | |
122 | - write('</li>') | |
123 | - else | |
124 | - write('<li><a href="%s">%s</a></li>' %{ | |
125 | - nodeurl(category, r, nnode.query), | |
126 | - pcdata(striptags(translate(nnode.title))) | |
127 | - }) | |
128 | - end | |
129 | - end | |
130 | - | |
131 | - write('</ul>') | |
132 | - end | |
133 | - end | |
134 | - | |
135 | - local function render_changes() | |
136 | - local file = io.open("/usr/lib/lua/luci/view/admin_uci/changes.htm", "rb") | |
137 | - if file then file:close() end | |
138 | - if file ~= nil then | |
139 | - -- calculate the number of unsaved changes | |
140 | - if tree.nodes[category] and tree.nodes[category].ucidata then | |
141 | - local ucichanges = 0 | |
142 | - | |
143 | - for i, j in pairs(require("luci.model.uci").cursor():changes()) do | |
144 | - for k, l in pairs(j) do | |
145 | - for m, n in pairs(l) do | |
146 | - ucichanges = ucichanges + 1; | |
147 | - end | |
148 | - end | |
149 | - end | |
150 | - | |
151 | - if ucichanges > 0 then | |
152 | - write('<a class="uci_change_indicator label notice" href="%s?redir=%s">%s: %d</a>' %{ | |
153 | - url(category, 'uci/changes'), | |
154 | - http.urlencode(http.formvalue('redir') or table.concat(disp.context.request, "/")), | |
155 | - translate('Unsaved Changes'), | |
156 | - ucichanges | |
157 | - }) | |
158 | - end | |
159 | - end | |
160 | - end | |
161 | - end | |
162 | --%> | |
163 | -<!DOCTYPE html> | |
164 | -<html lang="<%=luci.i18n.context.lang%>"> | |
165 | - <head> | |
166 | - <meta charset="utf-8"> | |
167 | - <title><%=striptags( (boardinfo.hostname or "?") .. ( (node and node.title) and ' - ' .. translate(node.title) or '')) %> - LuCI</title> | |
168 | - <!--[if lt IE 9]><script src="<%=media%>/html5.js"></script><![endif]--> | |
169 | - <meta name="viewport" content="initial-scale=1.0"> | |
170 | - <link rel="stylesheet" href="<%=media%>/cascade.css"> | |
171 | - <link rel="stylesheet" media="only screen and (max-width: 1600px)" href="<%=media%>/mobile.css" type="text/css" /> | |
172 | - <link rel="shortcut icon" href="<%=media%>/favicon.ico"> | |
173 | - <% if node and node.css then %> | |
174 | - <link rel="stylesheet" href="<%=resource%>/<%=node.css%>"> | |
175 | - <% end -%> | |
176 | - <% if css then %> | |
177 | - <style title="text/css"><%= css %></style> | |
178 | - <% end -%> | |
179 | - | |
180 | - <!-- <script src="<%=url('admin/translations', luci.i18n.context.lang)%>"></script> --> | |
181 | - <script src="<%=resource%>/cbi.js"></script> | |
182 | - <script src="<%=resource%>/xhr.js"></script> | |
183 | - </head> | |
184 | - | |
185 | - <body class="lang_<%=luci.i18n.context.lang%> <% if node then %><%= striptags( node.title ) %><%- end %>" data-page="<%= table.concat(disp.context.requestpath, "-") %>"> | |
186 | - <header> | |
187 | - <div class="fill"> | |
188 | - <div class="container"> | |
189 | - <a class="brand" href="#"><%=boardinfo.hostname or "?"%></a> | |
190 | - <% render_topmenu() %> | |
191 | - <div class="pull-right"> | |
192 | - <% render_changes() %> | |
193 | - <span id="xhr_poll_status" style="display:none" onclick="XHR.running() ? XHR.halt() : XHR.run()"> | |
194 | - <span class="label success" id="xhr_poll_status_on"><span class="mobile-hide"><%:Auto Refresh%> </span><%:on%></span> | |
195 | - <span class="label" id="xhr_poll_status_off" style="display:none"><span class="mobile-hide"><%:Auto Refresh%> </span><%:off%></span> | |
196 | - </span> | |
197 | - </div> | |
198 | - </div> | |
199 | - </div> | |
200 | - </header> | |
201 | - | |
202 | - <%- if luci.sys.process.info("uid") == 0 and luci.sys.user.getuser("root") and not luci.sys.user.getpasswd("root") then -%> | |
203 | - <div class="container"> | |
204 | - <div class="alert-message warning"> | |
205 | - <h4><%:No password set!%></h4> | |
206 | - <%:There is no password set on this router. Please configure a root password to protect the web interface and enable SSH.%><br> | |
207 | - <a href="<%=pcdata(luci.dispatcher.build_url("admin/system/admin"))%>"><%:Go to password configuration...%></a> | |
208 | - </div> | |
209 | - </div> | |
210 | - <%- end -%> | |
211 | - | |
212 | - <noscript> | |
213 | - <div class="alert-message warning"> | |
214 | - <strong><%:JavaScript required!%></strong><br /> | |
215 | - <%:You must enable JavaScript in your browser or LuCI will not work properly.%> | |
216 | - </div> | |
217 | - </noscript> | |
218 | - | |
219 | - <div id="maincontent" class="container"> | |
220 | - <% if category then render_tabmenu(category, cattree) end %> |
@@ -28,7 +28,18 @@ | ||
28 | 28 | </div> |
29 | 29 | </body> |
30 | 30 | <script> |
31 | - window.onload = function(){ | |
31 | + function addLoadEvent(func) { | |
32 | + var oldonload = window.onload; | |
33 | + if (typeof window.onload != 'function') { | |
34 | + window.onload = func; | |
35 | + } else { | |
36 | + window.onload = function () { | |
37 | + oldonload(); | |
38 | + func(); | |
39 | + } | |
40 | + } | |
41 | + } | |
42 | + addLoadEvent(function(){ | |
32 | 43 | var content = document.getElementsByName("content"); |
33 | 44 | var luci_username = document.getElementsByName("luci_username"); |
34 | 45 | var luci_password = document.getElementsByName("luci_password"); |
@@ -58,6 +69,6 @@ | ||
58 | 69 | } |
59 | 70 | } |
60 | 71 | } |
61 | - } | |
72 | + }); | |
62 | 73 | </script> |
63 | 74 | </html> |
@@ -133,29 +133,25 @@ | ||
133 | 133 | end |
134 | 134 | |
135 | 135 | local function render_changes() |
136 | - local file = io.open("/usr/lib/lua/luci/view/admin_uci/changes.htm", "rb") | |
137 | - if file then file:close() end | |
138 | - if file ~= nil then | |
139 | - -- calculate the number of unsaved changes | |
140 | - if tree.nodes[category] and tree.nodes[category].ucidata then | |
141 | - local ucichanges = 0 | |
142 | - | |
143 | - for i, j in pairs(require("luci.model.uci").cursor():changes()) do | |
144 | - for k, l in pairs(j) do | |
145 | - for m, n in pairs(l) do | |
146 | - ucichanges = ucichanges + 1; | |
147 | - end | |
136 | + -- calculate the number of unsaved changes | |
137 | + if tree.nodes[category] and tree.nodes[category].ucidata then | |
138 | + local ucichanges = 0 | |
139 | + | |
140 | + for i, j in pairs(require("luci.model.uci").cursor():changes()) do | |
141 | + for k, l in pairs(j) do | |
142 | + for m, n in pairs(l) do | |
143 | + ucichanges = ucichanges + 1; | |
148 | 144 | end |
149 | 145 | end |
146 | + end | |
150 | 147 | |
151 | - if ucichanges > 0 then | |
152 | - write('<a class="uci_change_indicator label notice" href="%s?redir=%s">%s: %d</a>' %{ | |
153 | - url(category, 'uci/changes'), | |
154 | - http.urlencode(http.formvalue('redir') or table.concat(disp.context.request, "/")), | |
155 | - translate('Unsaved Changes'), | |
156 | - ucichanges | |
157 | - }) | |
158 | - end | |
148 | + if ucichanges > 0 then | |
149 | + write('<a class="uci_change_indicator label notice" href="%s?redir=%s">%s: %d</a>' %{ | |
150 | + url(category, 'uci/changes'), | |
151 | + http.urlencode(http.formvalue('redir') or table.concat(disp.context.request, "/")), | |
152 | + translate('Unsaved Changes'), | |
153 | + ucichanges | |
154 | + }) | |
159 | 155 | end |
160 | 156 | end |
161 | 157 | end |
@@ -1,8 +1,6 @@ | ||
1 | 1 | #!/bin/sh |
2 | 2 | uci batch <<-EOF |
3 | 3 | set luci.themes.Bootstrap_Mod=/luci-static/bootstrap_mod |
4 | - set luci.themes.Bootstrap_Blue=/luci-static/bootstrap_blue | |
5 | - set luci.main.mediaurlbase=/luci-static/bootstrap_mod | |
6 | 4 | commit luci |
7 | 5 | EOF |
8 | 6 | exit 0 |