source: S-port/trunk/www/style.css@ 1

Last change on this file since 1 was 1, checked in by AlexLir, 3 years ago
File size: 11.1 KB
Line 
1body{
2 font-family : sans-serif;
3 font-style: normal;
4 font-size: 12px;
5 margin-top: 2px;
6 background: #1f4e6bfa;
7 background: linear-gradient(90deg, rgb(31 78 107 / 90%) 0%, rgb(0, 61, 130, 1) 50%, rgb(31 78 107 / 90%) 100%);
8}
9
10input, select{
11 outline:none;
12 border:0.1em solid #AAA;
13 border-radius: 2px;
14}
15
16td{
17 white-space: nowrap;
18}
19
20fieldset{
21 border: 1px solid #AAA;
22 border-radius:2px;
23 margin: 0.5em 0.5em 0em 0em;
24}
25
26#adc{
27 justify-self: center;
28 padding-bottom: 1em;
29}
30
31#adc img{
32 height: 4em;
33}
34
35.mainSection{
36 text-align: -webkit-center;
37 text-align: center;
38}
39
40.mainSection *{
41 text-align: initial;
42}
43
44.hidden{
45 display: none;
46}
47
48.login{
49 text-align: center;
50 width: fit-content;
51 display: inline-grid;
52 padding: 1em 3.5em 1em 3.5em;
53 display: block;
54 padding: 15px;
55}
56
57.login input{
58 display: grid;
59 margin: 0em 0em 4px 0em;
60 border: 0.1em solid lightgray;
61 height: 1.5em;
62 border-radius: 0.3em;
63 width: 15em;
64}
65
66.login button{
67 background: #526994;
68 color: white;
69 border: none;
70 margin-top: 1em;
71}
72
73.login button:hover{
74 opacity: 0.75;
75}
76
77#timePoll{
78 width: 3.1em;
79}
80#boardName{
81 text-align: center;
82 font-size: 24px;
83 font-weight: 600;
84 color: #1f4e6b;
85}
86
87.tableHeader{
88 width: auto;
89 height: 6em;
90 background: white;
91 padding-bottom: 1em;
92 width: -webkit-fill-available;
93 width: -moz-available;
94}
95
96.tableHeader #adc{
97 padding: 0em;
98 text-align-last: center;
99 margin-right: 0.5em;
100}
101
102.clock_head{
103 display: block;
104 background: #1f4e6b;
105 margin: 0px;
106 border:1px solid #1f4e6b;
107 padding: 3px;
108 font-size: 14px;
109 color: white;
110 text-align:center;
111}
112
113#pc-date, #pc-time, #rtc-date, #rtc-time, #rtc-cor{
114 display: block;
115 border:1px solid #1f4e6b;
116 margin: 0px;
117 padding: 3px;
118 font-size: 14px;
119 text-align:center;
120 margin-bottom:1px;
121}
122
123.rtc-bat{
124 display: none;
125 border:1px solid #1f4e6b;
126 margin: 0px;
127 padding: 3px;
128 font-size: 14px;
129 color:red;
130 text-align:center;
131}
132
133.clock table td{
134 vertical-align: top;
135}
136
137.clock{
138 overflow:auto;
139 display:flex;
140 justify-content:center;
141}
142
143.clock fieldset{
144 width: 220px;
145
146}
147
148#sync{
149 width: 2em;
150 font-size: 16px;
151 height: max-content;
152}
153
154.edit_button{
155 height: max-content;
156 margin: 4px;
157}
158
159.sync-time .header{
160 background: #1f4e6b;
161 margin: 0px;
162 padding: 3px;
163 color:white;
164 width:45%;
165 text-align:center;
166 font-size: 14px;
167}
168
169.sync-time td{
170 border:1px solid #1f4e6b;
171 margin: 0px;
172 padding: 3px;
173 text-align:center;
174 font-size: 14px;
175}
176
177.serv{
178 width:18px;
179 height:18px;
180 float:left;
181 cursor:pointer;
182 padding-bottom:10px;
183}
184
185.main-LeftBlock{
186 width:110px;
187 min-width: 110px;
188 float:left
189}
190
191.main-RightBlock{
192 background: #F8F8F8;
193 border: 1px solid #CCC;
194 min-height:300px;
195 margin: 5px 0 0 109px;
196 padding: 5px 5px 10px 5px;
197 min-width: 750px;
198 border-radius:3px;
199}
200
201.section{
202 display: -moz-inline-stack;
203 display: inline-block;
204 zoom: 1;
205 max-width: max-content;
206 min-width: max-content;
207 background: white;
208 border-radius: 0px 0px 5px 5px;
209 padding: 10px;
210}
211
212.section:first-child{
213 border:1px
214}
215
216.units-LeftBlock{
217 width:140px;
218 min-width: 150px;
219 float:left
220}
221
222.units-RightBlock{
223 background: #F9F9F9;
224 border: 1px solid #AAA;
225 min-height:150px;
226 margin: 5px 0 0 149px;
227 border-radius:5px;
228 padding-top: 10px;
229}
230
231.units-RightBlock .section{
232 background: #F9F9F9;
233}
234
235ul.PLC-tabs-units{
236 list-style:none;
237 line-height: 25px;
238 margin: 2px 0 0 0;
239 padding: 5px 0 0 5px;
240}
241
242.PLC-tabs-units li{
243 color: #777;
244 background-color:#FAFAFA;
245 border-top-left-radius: 5px;
246 border-bottom-left-radius: 5px;
247 display: block;
248 border: 1px solid #d4d4d4;
249 padding: 0 8px;
250 margin: 2px 0 0 -5px;
251 margin-bottom: 0px;
252 cursor: pointer;
253 background:white;
254 border-right: 1px solid #AAA;
255}
256
257.PLC-tabs-units li:hover{
258 color: #1f4e6b;
259 border-top: 1px solid #1f4e6b90;
260 border-left: 1px solid #1f4e6b90;
261 border-bottom: 1px solid #1f4e6b90;
262 background: #1f4e6b20;
263}
264
265.PLC-tabs-units li.current-units{
266 cursor:default;
267 color: #000;
268 background: #F9F9F9;
269 padding: 0 8px 2px;
270 border: 1px solid #AAA;
271 border-right: none;
272}
273
274.PLC-tabs-units p{
275 margin: 0;
276 display: flex;
277 justify-content: flex-start;
278}
279
280#blockBtn{
281 display: flex;
282 place-content: center;
283}
284
285#PLC_addBlock{
286 border: 0;
287 background: inherit;
288 width: min-content;
289}
290
291#PLC_addBlock p{
292 font-size: x-large;
293 margin: 0em;
294}
295
296.plc_btn_act img{
297 cursor:pointer;
298 width:20px;
299 height:20px;
300}
301
302.box.visible{
303 display: -moz-inline-stack;
304 display: inline-block;
305 zoom: 1;
306 *display: inline;
307}
308
309#auto_update, #survey_of_block{
310 margin: 1em;
311}
312
313#date, #time, #sysDate, #sysTime{
314 pointer-events: none;
315}
316
317#readBlock{
318 margin-left: 2em;
319 height: 10green
320}
321
322.units-table{
323 width:100%;
324 border: 0px solid #000;
325 color:#000;
326}
327
328.units-combo{
329 float:left;
330 width:230px;
331 display:inline-block;
332 border: 1px solid #AAA;
333 border-radius:2px;
334}
335ul.tabs{
336 height: 23px;
337 line-height: 20px;
338 list-style: none;
339 margin: 0 0 0 0;
340 padding: 0 0 0 30px;
341 white-space: nowrap;
342}
343
344.tabs li{
345 display: -moz-inline-stack;
346 display: inline-block;
347 zoom: 1;
348 *display: inline;
349 margin: 0px 0px 0px 0px;
350 padding: 0 25px 1px;
351 color: #777;
352 cursor: pointer;
353 background: #FFF;
354 border: 1px solid #d4d4d4;
355 border-bottom-color: #FAFAFA;
356 position: relative;
357 -webkit-border-top-right-radius: 2px;
358 -webkit-border-top-left-radius: 2px;
359 -moz-border-radius-topright: 2px;
360 border-top-right-radius: 5px;
361 border-top-left-radius: 5px;
362}
363
364.tabs li:hover{
365 color: #1f4e6b;
366 border-top: 1px solid #1f4e6b90;
367 border-left: 1px solid #1f4e6b90;
368 border-right: 1px solid #1f4e6b90;
369 border-bottom: 1px solid #1f4e6b20;
370 background: #1f4e6b20;
371}
372
373.tabs li.current{
374 cursor:default;
375 color: #000;
376 background: #F9F9F9;
377 padding:0px 25px 2px;
378 margin:0px 0px 0px 0px;
379 border: 1px solid #AAA;
380 border-bottom: none;
381 padding-bottom: 0.23em;
382}
383
384.tabs li.notice{
385 background: red;
386 color: white;
387 padding: 2px;
388 position: relative;
389 font-size: 80%;
390 top: -0.7em;
391}
392
393.box{
394 display: none;
395 border-width: 0 1px 1px;
396 background: #F9F9F9;
397 padding: 12px 12px 12px 12px;
398 border-radius: 0em 0em 0.5em 0.5em;
399 min-width: 780px;
400 min-height: 20px;
401 border: 1px solid #AAA;
402}
403
404button{
405 height:30px;
406 min-width:80px;
407 margin-right:5px;
408 margin-left:5px;
409 border-radius:3px;
410 border: 1px solid #AAA;
411 cursor: pointer;
412 text-align-last: center;
413}
414
415button:hover{
416 background:#fff;
417}
418
419.backgr{
420 background:#00000050;
421 position: fixed;
422 top: 0;
423 left: 0;
424 width: 100%;
425 height: 1000000px;
426 z-index: 10;
427 zoom: 1;
428}
429
430.overlay{
431 position: absolute;
432 left: 0;
433 top: 0;
434 z-index: 10;
435}
436
437.popup_header{
438 background: #1f4e6b;
439 text-align: center;
440 padding: 5px 15px 5px 15px;
441 border-bottom: 1px solid #191919;
442 font-size: 15px;
443 font-weight: 600;
444 color: white;
445 border-radius: 2px 2px 0px 0px;
446 user-select: none;
447 cursor: default;
448}
449
450.popup_body{
451 padding: 25px;
452 display: inline-block;
453 align-items: center;
454}
455
456.middle{
457 float: left;
458 vertical-align: middle;
459}
460
461.middle.content{
462 margin-left: 12px;
463 text-align: center;
464 font-size: 14px;
465 margin-top: 15px;
466}
467
468.middle img{
469 width:48px;
470 height:48px;
471}
472
473.popup_footer{
474 padding: 5px;
475 border-top: 1px solid #191919;
476 text-align: center;
477}
478
479.popup{
480 box-shadow: 0px 0em 0.4em 0px rgb(255 255 255);
481 padding: 0;
482 width-min: 300px;
483 background: #efefef;
484 border-radius: 3px;
485 border: 1px solid #191919;
486 display: -moz-inline-stack;
487 display: inline-block;
488 zoom: 1;
489 *display: inline;
490}
491
492#ticker{
493 cursor: default;
494 width:24px;
495 height:24px;
496 float: right;
497 padding: 5px;
498 margin-right: 5px;
499}
500
501.other_butt{
502 margin-left: 5px;
503 border: 2px solid #CCC;
504 width: 65px;
505 height: 100px;
506 padding: 5px 5px 0px 5px;
507 border-radius: 3px;
508 cursor: pointer;
509 border-color: #adadad #555555 #555555 #adadad;
510 background: -webkit-linear-gradient(#ffffff, #355f7a4a);
511 color: #1f4e6b;
512 position: relative;
513}
514
515.other_butt:hover{
516 border-color: #555555 #adadad #adadad #555555;
517}
518
519.other_butt img{
520 position: absolute;
521 display: block;
522 margin-left: auto;
523 margin-right: auto;
524 height: 64px;
525 width:64px;
526}
527
528.other_butt div{
529 position: absolute;
530 text-align: center;
531 text-decoration: underline;
532 bottom: 5px;
533 width: 100%;
534 left: 0;
535}
536
537.btn_route img{
538 width:16px;
539 height:16px;
540 cursor:pointer;
541}
542
543.cell_route{
544 font-size: 14px;
545 display: inline-flex;
546}
547
548#common_settings img{
549 width:16px;
550 height:16px;
551 cursor:pointer;
552 float:right;
553 margin-right:15px;
554}
555
556#route_name{
557 display:inline-block;
558 margin:auto;
559 margin-left: 5px;
560}
561
562#state_block{
563 border-radius: 11px;
564 width: 15px;
565 height: 15px;
566 box-shadow: 0px 0em 0.2em 0px rgb(50 50 50),
567 inset rgba(0,0,0,.5) -3px -3px 4px,
568 inset rgba(255,255,255,.9) 3px 3px 8px,
569 rgba(0,0,0,.8) 3px 3px 8px -5px;
570 margin-top: 5px;
571 margin-right: 5px;
572}
573
574/*.users th {
575 font-family: sans-serif;
576 text-align: center;
577 background-color: #d0d6d6;
578 position: relative;
579 border: 1px solid #EEE;
580 padding: 4px;
581}
582
583.users td {
584 text-align: center;
585 white-space: nowrap;
586 border: 1px solid #EEE;
587 padding: 2px;
588}
589
590.users {
591 position: relative;
592 border: 1px solid #EEE;
593 border-collapse: collapse;
594}
595
596.users img {
597 width:20px;
598 height:20px;
599 cursor:pointer;
600}*/
601
602.menu{
603 border: 1px solid #fff;
604 margin-left: -30px;
605 height: 24px;
606 width: 24px;
607 cursor: pointer;
608 border-radius: 5px;
609}
610
611.menu:hover{
612 border: 1px solid #1f4e6b;
613}
614
615#plc h3{
616 text-align: center;
617 border: 1px solid;
618 background: darkred;
619 color: #fff;
620 border-radius: 3px;
621 padding: 3px;
622 margin: auto;
623}
624
625ul.parent > li{
626 position:relative;
627 float:left;
628 list-style:none;
629 margin:1px;
630}
631
632ul.child{
633 background: #f6f6f6;
634 z-index: 1;
635 position: absolute;
636 left: 0;
637 padding: 0;
638 list-style: none;
639 display: none;
640 padding: 5px;
641 margin-left: -30px;
642 margin-top: -1px;
643 border: 1px solid #1f4e6b;
644 border-radius: 5px;
645 line-height: 20px;
646}
647
648.child li{
649 cursor:pointer;
650 border-radius: 5px;
651 padding: inherit;
652}
653
654.child a{
655 height: 100%;
656 display: block;
657 text-decoration:none;
658 color:#000;
659}
660
661.child li:hover, .child li:hover a{
662 background:#1f4e6b;
663 color:#fff;
664}
665
666label.error{
667 background-color: #1f4e6be6;
668 color: white;
669 display: block;
670 position: absolute;
671 white-space: normal;
672 padding: 10px;
673 -webkit-border-radius: 3px;
674 -moz-border-radius: 3px;
675 border-radius: 3px;
676 box-shadow: 2px 2px 4px black;
677 margin-top: 2px;
678 z-index: 20;
679 width: 120px;
680}
681
682.sect_name{
683 display:inline-flex;
684}
685
Note: See TracBrowser for help on using the repository browser.