Diff -- /var/www/vhosts/3dshawn.com/abforge.3dshawn.com/assets/css/theme.css
Diff

/var/www/vhosts/3dshawn.com/abforge.3dshawn.com/assets/css/theme.css

added on local at 2026-07-01 16:01:00

Added
+1651
lines
Removed
-0
lines
Context
0
unchanged
Blobs
from
to 640a00b5b12e
Restore this content →
Unified diff
Naive LCS-based line diff. Additions in emerald, deletions in rose. Both sides decompressed live from BLOB_STORE.
1[[css_variables]]
2
3 /* -------------------- Page Defaults ---------------------- */
4 [[top_page_styles]]
5
6 .page_header_top{
7 background-color: var(--top_header_color);
8 }
9 .page_header_bottom{
10 background-color: var(--bottom_header_color);
11 }
12 .page_header_text{
13 color: var(--page_header_text);
14 }
15 .body{
16 -webkit-text-size-adjust: none;
17 }
18 /* -------------------- Page Defaults ---------------------- */
19
20
21 /* -------------------- Top Menu Objects ------------------- */
22
23 .menu_option_text_position{
24 position:relative;
25 top: 8px;
26 }
27 /* -------------------- Top Menu Objects ------------------- */
28
29
30 /* -------------------- Drop Down Menu Styles --------------- */
31 .menu{
32 cursor:pointer;
33 }
34 .menu_border{
35 border: 1px solid #EFEFEF;
36 }
37
38 .submenu_outer{
39 position:relative;
40 float:left;
41 left:4px;
42 top:8px;
43 cursor:pointer;
44 z-index:50000;
45 }
46 /* This is the container to hold all menu options */
47
48 .subopt_text{
49 position:relative;
50 float:left;
51 top:8px;
52 margin-left:5px; /* move button text right */
53 }
54 /* -------------------- Drop Down Menu Styles --------------- */
55
56
57 /* -------------------- Sticky Tag Styles ------------------ */
58 .sticky_tag{
59 position: relative;
60 float: left;
61 padding: 0px 16px 0px 0px;
62 width: 35px;
63 border: 0px solid #E3E3E3;
64 }
65 .sticky_tag_text_area{
66 position: relative;
67 width: 50px;
68 height: 17px;
69 }
70 .sticky_tag_arrow{
71 position: absolute;
72 right: -10px;
73 top: 1px;
74
75 width: 15px;
76 height: 15px;
77
78 transform: rotate(45deg);
79 }
80
81 .sticky_tag_color{
82 border: 1px solid #cf2d28;
83 background-color: #cf2d28;
84 }
85 .sticky_tag_text{
86 position: relative;
87 float: left;
88 top: 1px;
89 left: -1px;
90 color: #ffe0e0;
91 font-size: 12px;
92 font-weight: bold;
93 }
94 /* -------------------- Sticky Tag Styles ------------------ */
95
96
97 /* -------------------- Generic Styles --------------------- */
98 .round{
99 -webkit-border-radius: 3px;
100 -moz-border-radius: 3px;
101 border-radius: 3px;
102 }
103 .box_sizing{
104 /* box-sizing forces divs to subtract padding and margin from the width */
105 box-sizing: border-box;
106 -webkit-box-sizing: border-box;
107 -moz-box-sizing: border-box;
108 }
109 /* -------------------- Generic Styles --------------------- */
110
111
112 /* -------------------- Main Div Areas --------------------- */
113 .div_area{
114 position: relative;
115 float: left;
116 width: calc(100% - 20px);
117 height: auto;
118 border: solid 1px #CCCCCC;
119 background-color: #FFFFFF;
120 margin: 10px 10px 10px 10px;
121 }
122
123 .div_area_header{
124 position: relative;
125 float: left;
126 width: 100%;
127 height: 30px;
128 background-color: var(--div_area_header);
129 }
130 .div_area_header_text{
131 position: relative;
132 font-face: Arial;
133 font-size: 16px;
134 color: var(--div_area_header_text);
135 font-weight: bold;
136 padding: 5px 5px 5px 5px;
137 top: 2px;
138 }
139
140 .div_area_header_text_az{
141 position: relative;
142 font-face: Arial;
143 font-size: 12px;
144 color:var(--div_area_header_text);
145 font-weight: bold;
146 padding: 5px 5px 5px 5px;
147 }
148
149
150 .div_area_sub_header{
151 padding: 3px 0px 3px 0px;
152 background-color: #EEEEEE;
153 }
154
155 .div_area_content{
156 position: relative;
157 float: left;
158 width: 100%;
159 margin: 5px 5px 5px 5px;
160 }
161 .div_area_row{
162 position: relative;
163 border-bottom: 1px solid #CCCCCC;
164 padding: 3px 3px 3px 3px;
165 margin: 3px 3px 5px 3px;
166 width: calc(100% - 20px);
167 }
168
169 .full_border_div{
170 position: relative;
171 float: left;
172 border: 1px solid #EEEEEE;
173 width: auto;
174 height: auto;
175 margin: 0px 5px 0px 5px;
176 }
177
178 .text_field{
179 position: relative;
180 font-face: arial;
181 font-size: 12px;
182 color: #666666;
183 border: 1px solid #ededed;
184 padding:1px 0px 1px 2px;
185 z-index: 10;
186 }
187 .text_field_highlight{
188 position: relative;
189 font-face: arial;
190 font-size: 12px;
191 color: #666666;
192 border: 1px solid #ededed;
193 padding:1px 0px 1px 2px;
194 z-index: 10;
195 background-color: #e6ecf5;
196 }
197 .text_field_error{
198 position: relative;
199 font-face: arial;
200 font-size: 12px;
201 color: #cf2d28;
202 border: 1px solid #cf2d28;
203 padding:1px 0px 1px 2px;
204 z-index: 10;
205 background-color: #ffe0e0;
206 }
207 .text_field_error2{
208 position: relative;
209 font-face: arial;
210 font-size: 12px;
211 color: #ffe0e0;
212 border: 1px solid #ffe0e0;
213 padding:1px 0px 1px 2px;
214 z-index: 10;
215 background-color: #992d28;
216 }
217 .text_field_error3{
218 position: relative;
219 font-face: arial;
220 font-size: 12px;
221 color: #ffe0e0;
222 border: 1px solid #ffe0e0;
223 padding:1px 0px 1px 2px;
224 z-index: 10;
225 background-color: #eb8a49;
226 }
227
228 .shadow{
229 box-shadow: 0 0 10px rgba(0,0,0,0.4);
230 -moz-box-shadow: 0 0 10px rgba(0,0,0,0.4);
231 -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.4);
232 -o-box-shadow: 0 0 10px rgba(0,0,0,0.4);
233 }
234 /* -------------------- Main Div Areas --------------------- */
235
236
237 /* -------------------- Button Objects --------------------- */
238 .upload_field{
239 -webkit-border-radius: 2px;
240 -moz-border-radius: 2px;
241 border-radius: 2px;
242 background-color:#f5f5f5;
243 padding: 0px 0px 0px 0px; /* padding:top,right,bottom,left */
244 font: 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
245 cursor:pointer;
246 color: #555555;
247 border:1px solid #aeaeae;
248 }
249
250 .upload_field:hover{
251 background-color:#999999;
252 border:1px solid #999999;
253 color:#E3E3E3;
254 }
255
256 .upload_button{
257 -webkit-border-radius: 2px;
258 -moz-border-radius: 2px;
259 border-radius: 2px;
260 background-color:#f5f5f5;
261 padding: 3px 5px 2px 5px; /* padding:top,right,bottom,left */
262 font: 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
263 cursor:pointer;
264 color: #555555;
265 border:1px solid #aeaeae;
266 }
267
268 .upload_button:hover{
269 background-color:#E6EFC2;
270 border:1px solid #C6D880;
271 color:#529214;
272 }
273
274 .add_button{
275 -webkit-border-radius: 2px;
276 -moz-border-radius: 2px;
277 border-radius: 2px;
278 background-color:#f5f5f5;
279 padding: 0px 10px 0px 10px; /* padding:top,right,bottom,left */
280 font: 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
281 cursor:pointer;
282 color: #555555;
283 border:1px solid #aeaeae;
284 }
285
286 .add_button:hover{
287 background-color:#dff4ff;
288 border:1px solid #c2e1ef;
289 color:#336699;
290 }
291
292 .save_button{
293 -webkit-border-radius: 2px;
294 -moz-border-radius: 2px;
295 border-radius: 2px;
296 background-color:#f5f5f5;
297 padding: 0px 10px 0px 10px; /* padding:top,right,bottom,left */
298 font: 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
299 cursor:pointer;
300 color: #555555;
301 border:1px solid #aeaeae;
302 }
303
304 .save_button:hover{
305 background-color:#E6EFC2;
306 border:1px solid #C6D880;
307 color:#529214;
308 }
309
310 .delete_button{
311 -webkit-border-radius: 2px;
312 -moz-border-radius: 2px;
313 border-radius: 2px;
314 background-color:#f5f5f5;
315 padding: 0px 10px 0px 10px; /* padding:top,right,bottom,left */
316 font: 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
317 cursor:pointer;
318 color: #555555;
319 border:1px solid #aeaeae;
320 }
321
322 .delete_button:hover{
323 background:#fbe3e4;
324 border:1px solid #fbc2c4;
325 color:#d12f19;
326 }
327 /* -------------------- Button Objects --------------------- */
328
329
330 /* -------------------- Main Page Fonts -------------------- */
331 .page_font{
332 font: 12px Arial;
333 color: #666666;
334 }
335 .page_instruction_font{
336 font: 13px Arial;
337 font-weight: normal;
338 color: #555555;
339 padding: 5px;
340 }
341 .page_link_font{
342 font: 12px Arial;
343 font-weight: normal;
344 color: #555555;
345 }
346 .page_link_font:hover{
347 font: 12px Arial;
348 font-weight: normal;
349 color: #000000;
350 }
351 /* -------------------- Main Page Fonts -------------------- */
352
353
354 /* -------------------- Plus Icon ------------------------- */
355 .plus_icon{
356 /*
357 -webkit-border-radius: 50%;
358 -moz-border-radius: 50%;
359 border-radius: 50%;
360 */
361 -webkit-border-radius: 3px;
362 -moz-border-radius: 3px;
363 border-radius: 3px;
364 width: 17px;
365 height: 17px;
366 background-color:#888888;
367
368 position:relative;
369 top:0px;
370 }
371 .plus_icon:hover{
372 background-color:#555555;
373 cursor:pointer;
374 }
375 .plus_icon_text{
376 color:#FFFFFF;
377 font:normal 18px Arial;
378 position:relative;
379 left:3px;
380 top:-1px;
381 }
382 /* -------------------- Plus Icon ------------------------- */
383
384 /* -------------------- Screen Lock With floating div ------ */
385 .screen_lock_overlay{
386 position: fixed;
387 display:none;
388 float:left;
389 top: 0;
390 left: 0;
391 height: 100%;
392 width: 100%;
393 background-color: rgba(0,0,0,0.8); /* Transparency */
394 z-index: 100000;
395 }
396 /* Used to center the area on the page */
397 .floating_div{
398 width: 600px;
399 height: auto;
400 position: fixed;
401 top: 50%;
402 left: 50%;
403 margin-top: -300px;
404 margin-left: -300px;
405 z-index: 200000; /* 1px higher than the overlay layer */
406 }
407 /* -------------------- Screen Lock With floating div ------ */
408
409
410 /* -------------------- Critical Alerts styles ------------- */
411 .alerts_area{
412 position: relative;
413 float: right;
414 width: 130px;
415 height: auto;
416 }
417 .alerts_area_header{
418 background-color: #555555;
419 border: 1px solid #FFFFFF;
420
421 font-face: Arial;
422 font-size: 12px;
423 color: #EEEEEE;
424 font-weight: bold;
425 line-height: 20px;
426 padding:5px;
427 }
428 .alert_message_box{
429 background-color: #FFFFFF;
430 }
431 .alert_message_box_font{
432 position: relative;
433 float: right;
434 top: 1px;
435 font-face: Arial;
436 font-size: 12px;
437 color: #666666;
438 margin: 5px 5px 5px 0px;
439 }
440
441 .alert_symbol{
442 position: relative;
443 float: left;
444 height: 15px;
445 width: 25px;
446 border-radius: 5%;
447 -moz-border-radius: 5%;
448 -webkit-border-radius: 5%;
449 margin: 5px 5px 5px 5px;
450 padding: 0px 5px 0px 5px;
451 }
452 .alert_symbol_font{
453 position: relative;
454 top: 1px;
455 text-align: center;
456 font-face: arial;
457 font-size: 12px;
458 font-weight: bold;
459 }
460 .alert_symbol_critical{
461 background-color: #FF0000;
462 color: #EEEEEE;
463 }
464
465
466 .alert_message_font{
467 font: 12px Arial;
468 color: #666666;
469 }
470 .alert_message_link_font{
471 font: 12px Arial;
472 color: #666666;
473 text-decoration: none;
474 }
475 .alert_message_link_font:hover{
476 color: #444444;
477 text-decoration: underline;
478 }
479 .alert_message_div{
480 position: relative;
481 font-face: arial;
482 border: 1px solid #EEEEEE;
483 margin: 2px 0px 2px 0px;
484 padding: 2px 3px 2px 3px;
485 z-index: 10;
486 background-color: #ffe0e0;
487 }
488
489 /* -------------------- Critical Alerts styles ------------- */
490
491
492 /* -------------------- My Reminders styles ---------------- */
493 .reminder_area{
494 position: relative;
495 float: right;
496 width: 130px;
497 height: auto;
498 }
499 .reminder_area_header{
500 background-color: #555555;
501 border: 1px solid #FFFFFF;
502
503 font-face: Arial;
504 font-size: 12px;
505 color: #EEEEEE;
506 font-weight: bold;
507 line-height: 20px;
508 padding:5px;
509 }
510 .reminder_message_box{
511 background-color: #FFFFFF;
512 }
513 .reminder_message_box_font{
514 position: relative;
515 float: right;
516 top: 1px;
517 font-face: Arial;
518 font-size: 12px;
519 color: #666666;
520 margin: 5px 5px 5px 0px;
521 }
522
523 .reminder_symbol{
524 position: relative;
525 float: left;
526 height: 15px;
527 width: 25px;
528 border-radius: 5%;
529 -moz-border-radius: 5%;
530 -webkit-border-radius: 5%;
531 margin: 5px 5px 5px 5px;
532 padding: 0px 5px 0px 5px;
533
534 background-color: #5d7aa4; /* #FFFF00 */
535 color: #EEEEEE;
536 }
537 .reminder_symbol_font{
538 position: relative;
539 top: 1px;
540 text-align: center;
541 font-face: arial;
542 font-size: 12px;
543 font-weight: bold;
544 }
545
546 .reminder_message_font{
547 font: 12px Arial;
548 color: #666666;
549 }
550 .reminder_message_link_font{
551 font: 12px Arial;
552 color: #666666;
553 text-decoration: none;
554 }
555 .reminder_message_link_font:hover{
556 color: #444444;
557 text-decoration: underline;
558 }
559 .reminder_message_div{
560 position: relative;
561 font-face: arial;
562 border: 1px solid #EEEEEE;
563 margin: 2px 0px 2px 0px;
564 padding: 2px 3px 2px 3px;
565 z-index: 10;
566 background-color: #e9f2ff; /* #ffffd6 */
567 }
568 /* -------------------- My Reminders styles ---------------- */
569
570
571 /* -------------------- Settings area styles --------------- */
572 .settings_area{
573 background-color: #FFFFFF;
574 border: 1px solid #666666;
575 }
576 .settings_area_font{
577 font: 12px Arial;
578 color: #666666;
579 }
580 .settings_area_header{
581 background-color: #555555;
582 border: 1px solid #FFFFFF;
583
584 font-face: Arial;
585 font-size: 12px;
586 color: #EEEEEE;
587 font-weight: bold;
588 line-height: 20px;
589 padding:5px;
590 }
591 /* -------------------- Settings area styles --------------- */
592
593
594 /* -------------------- Success & Error Message Styles ----- */
595 .success_msg{
596 border:1px solid #548235;
597 color:#548235;
598 background: #e2efda;
599 }
600
601 .error_msg{
602 border:1px solid #b94441;
603 color:#b94441;
604 background: #ffb1b1;
605 }
606 /* -------------------- Success & Error Message Styles ----- */
607
608
609 /* -------------------- BOM Alert & Reminder Styles -------- */
610 .alert_msg{
611 width: calc(100% - 300px);
612 border:1px solid #b94441;
613 color:#b94441;
614 background: #ffb1b1;
615 margin:0px 0px 2px 10px;
616 padding: 4px;
617 -webkit-border-radius: 5px;
618 -moz-border-radius: 5px;
619 border-radius: 5px;right:0px;
620 }
621
622 .reminder_msg{
623 width: calc(100% - 300px);
624 background-color: #e9f2ff;
625 border: 1px solid #333399;
626 color:#333399;
627 margin:0px 0px 2px 10px;
628 padding: 4px;
629 -webkit-border-radius: 5px;
630 -moz-border-radius: 5px;
631 border-radius: 5px;right:0px;
632 }
633 /* -------------------- BOM Alert & Reminder Styles -------- */
634
635
636 /* -------------------- Sort By Column Arrows -------------- */
637 a.sort-by{
638 position: relative;
639 text-decoration: none;
640 font: 12px Arial;
641 font-weight: bold;
642 color: #444444;
643 padding-right: 18px;
644 }
645 a.sort-by:before,
646 a.sort-by:after{
647 border: 4px solid transparent;
648 content: "";
649 display: block;
650 height: 0;
651 right: 5px;
652 top: 50%;
653 position: absolute;
654 width: 0;
655 }
656 a.sort-by:before{
657 border-bottom-color: #666;
658 margin-top: -9px;
659 }
660 a.sort-by:after{
661 border-top-color: #666;
662 margin-top: 1px;
663 }
664 .column_sorted_by{
665 background-color: #EEEEEE;
666 }
667 /* -------------------- Sort By Column Arrows -------------- */
668
669
670 /* -------------------- Missing SAP Warning ---------------- */
671 .status_warning{
672 background-color:#f7ed92 !important;
673 }
674 /* -------------------- Missing SAP Warning ---------------- */
675
676 /* ---------------- Mismatch material Warning -------------- */
677 .status_mismatch{
678 background-color:#ffb1b1 !important;
679 }
680 .status_obsolete{
681 background-color:#edb25f !important;
682 }
683 .status_manual_material{
684 background-color:#7A0000 !important;
685 color:#FFFFFF !important;
686 }
687 .status_clli_site_mismatch{
688 background-color:#FF0000 !important;
689 color:#FFFFFF !important;
690 }
691 .status_clli_removed{
692 background-color:#6e105e !important;
693 color:#FFFFFF !important;
694 }
695 /* ---------------- Mismatch material Warning -------------- */
696
697
698 /* -------------------- Subtotal Pricing Area -------------- */
699 .subtotal_header{
700 position: relative;
701 float: left;
702 width: 100%;
703 height: 30px;
704 background-color: #444444;
705 }
706 .subtotal_header_text{
707 position: relative;
708 font-face: Arial;
709 font-size: 16px;
710 color: #EEEEEE;
711 font-weight: bold;
712 padding: 5px 5px 5px 5px;
713 top: 2px;
714 }
715
716 .div_area_row{
717 position: relative;
718 border-bottom: 1px solid #CCCCCC;
719 padding: 3px 3px 3px 3px;
720 margin: 3px 3px 5px 3px;
721 width: calc(100% - 20px);
722 }
723
724 .subtotal_line_items{
725 position: relative;
726 font-face: arial;
727 border: 1px solid #EEEEEE;
728 margin: 2px 0px 2px 0px;
729 padding: 2px 3px 2px 3px;
730 z-index: 10;
731 background-color: #EEEEEE;
732 }
733 .subtotal_line_items_font{
734 position: relative;
735 float: right;
736 top: 1px;
737 font-face: Arial;
738 font-size: 12px;
739 color: #EEEEEE;
740 margin: 5px 5px 5px 0px;
741 }
742 /* -------------------- Subtotal Pricing Area -------------- */
743
744 /* -------------------- Tool tips -------------- */
745 .tooltip {
746 position: relative;
747 display: inline-block;
748 border-bottom: 1px dotted black;
749 }
750
751 .tooltip .tooltiptext {
752 visibility: hidden;
753 width: 240px;
754 background-color: #4e5052;
755 color: #fff;
756 text-align: center;
757 border-radius: 6px;
758 padding: 5px;
759 position: absolute;
760 z-index: 10000;
761 bottom: 100%;
762 left: 50%;
763 margin-left: -50%;
764 margin-bottom: 10px;
765
766 /* Fade in tooltip - takes 1 second to go from 0% to 100% opac: */
767 opacity: 0;
768 transition: opacity 1s;
769 }
770
771 .tooltip .tooltiptext::after {
772 content: " ";
773 position: absolute;
774 top: 100%; /* At the bottom of the tooltip */
775 left: 50%;
776 margin-left: -5px;
777 border-width: 5px;
778 border-style: solid;
779 border-color: #4e5052 transparent transparent transparent;
780 }
781
782 .tooltip:hover .tooltiptext {
783 visibility: visible;
784 opacity: 1;
785 }
786 /* -------------------- Tool tips -------------- */
787
788
789 /* -------------------- Dashboard Containers Areas --------- */
790 .hover_container{
791 border:1px solid #c1c1c1;
792 border-radius:3px;
793 padding: 5px 0px 5px 0px;
794 background: #FFFFFF;
795 }
796 .hover_container:hover{
797 background-color:#999999;
798 border:1px solid #EEEEEE;
799 }
800 .rowbg_color1{
801 background-color:#F9F9F9;
802 }
803 .page_font_large{
804 font: 14px Arial;
805 color: #666666;
806 font-weight:bold;
807 line-height:24px;
808 font-style:italic;
809 }
810 /* -------------------- Dashboard Containers Areas --------- */
811
812.edit_autogrow_textfield_style{
813 height:14px;
814 width:100%;
815
816 position: relative;
817 font-face: arial;
818 font-size: 12px;
819 color: #999999;
820 border: 1px solid #ededed;
821 padding:1px 5px 1px 5px;
822}
823.edit_autogrow_textfield_style:hover, .edit_autogrow_textfield_style:focus{
824 color: #999999;
825}
826
827.active_user{
828 font: 14px Arial;
829 color: #EEEEEE;
830}
831
832/*------------ TAB page sections for displaying tabs --------*/
833.tabs{
834 position: relative;
835 float: left;
836 background-color: #333333;
837 -webkit-border-radius: 5px;
838 -moz-border-radius: 5px;
839 border-radius: 5px;
840 padding: 5px;
841 margin: .5px;
842 color: #FFFFFF;
843 cursor:pointer;
844 width: 160px;
845}
846.tab_clicked{
847 position: relative;
848 float: left;
849 background-color: #336699;
850 -webkit-border-radius: 5px;
851 -moz-border-radius: 5px;
852 border-radius: 5px;
853 padding: 5px;
854 margin: .5px;
855 color: #FFFFFF;
856 cursor:pointer;
857 width: 160px;
858}
859.div_area{
860 width:calc(100% - 20px);
861 margin: 0px 0px 0px 0px;
862}
863/*------------ TAB page sections for displaying tabs --------*/
864 /*------------ Legend colors for the hub dots ---------------*/
865 .dot_green{
866 position: absolute;
867 float: right;
868 height: 16px;
869 width: 16px;
870 background-color: #18a332;
871 border-radius: 50%;
872 display: inline-block;
873 border: 1px solid #222222;
874 margin: 2px 3px 0px 0px;
875 }
876 .dot_green_light{
877 position: absolute;
878 float: right;
879 height: 16px;
880 width: 16px;
881 background-color: #98f58c;
882 border-radius: 50%;
883 display: inline-block;
884 border: 1px solid #222222;
885 margin: 2px 3px 0px 0px;
886 }
887 .dot_purple{
888 position: absolute;
889 float: right;
890 height: 16px;
891 width: 16px;
892 background-color: #9532A8;
893 border-radius: 50%;
894 display: inline-block;
895 border: 1px solid #222222;
896 margin: 2px 3px 0px 0px;
897 }
898 .dot_grey{
899 position: absolute;
900 float: right;
901 height: 16px;
902 width: 16px;
903 background-color: #888888;
904 border-radius: 50%;
905 display: inline-block;
906 border: 1px solid #222222;
907 margin: 2px 3px 0px 0px;
908 }
909 .dot_red{
910 position: absolute;
911 float: right;
912 height: 16px;
913 width: 16px;
914 background-color: #ffe0e0;
915 border-radius: 50%;
916 display: inline-block;
917 border: 1px solid #FF0000;
918 margin: 2px 3px 0px 0px;
919 }
920
921 /*------------ Duplicate in AZ styling ----------------------*/
922 .duplicate-container{
923 color: #e9d2d2;
924 display: flex;
925 flex-direction: column;
926 align-items: center;
927 justify-content: center;
928 width: 125px; border: 1px solid black;
929 border-radius: 3px;
930 }
931 .duplicate-container p {
932 margin: 0;
933 }
934 .duplicate-container.duplicate-not-found{
935 display: none;
936 }
937 .duplicate-container.duplicate-found{
938 background-color: #992d28;
939 display: inline-block;
940 }
941
942 /*------------ Triangle Legend Colors -----------------------*/
943 .triangle_light_green{
944 font-size: 4px; /* Font changes the icon size */
945
946 position: relative;
947 width: 6em;
948 height: 6em;
949 text-align: center;
950 overflow: hidden;
951 border-radius: 100%;
952 }
953 .triangle_light_green:before{
954 content: '';
955 position: absolute;
956 border: solid 3em transparent;
957 border-bottom-color: #98f58c;
958 border-bottom-width: 5em;
959 border-top-width: 0;
960 margin: -.414em -50%;
961 }
962
963 .triangle_dark_green{
964 font-size: 4px; /* Font changes the icon size */
965
966 position: relative;
967 width: 6em;
968 height: 6em;
969 text-align: center;
970 overflow: hidden;
971 border-radius: 100%;
972 }
973 .triangle_dark_green:before{
974 content: '';
975 position: absolute;
976 border: solid 3em transparent;
977 border-bottom-color: #18a332;
978 border-bottom-width: 5em;
979 border-top-width: 0;
980 margin: -.414em -50%;
981 }
982
983 .triangle_orange{
984 font-size: 4px; /* Font changes the icon size */
985
986 position: relative;
987 width: 6em;
988 height: 6em;
989 text-align: center;
990 overflow: hidden;
991 border-radius: 100%;
992 }
993 .triangle_orange:before{
994 content: '';
995 position: absolute;
996 border: solid 3em transparent;
997 border-bottom-color: #FFA500;
998 border-bottom-width: 5em;
999 border-top-width: 0;
1000 margin: -.414em -50%;
1001 }
1002
1003 .triangle_purple{
1004 font-size: 4px; /* Font changes the icon size */
1005
1006 position: relative;
1007 width: 6em;
1008 height: 6em;
1009 text-align: center;
1010 overflow: hidden;
1011 border-radius: 100%;
1012 }
1013 .triangle_purple:before{
1014 content: '';
1015 position: absolute;
1016 border: solid 3em transparent;
1017 border-bottom-color: #df62df;
1018 border-bottom-width: 5em;
1019 border-top-width: 0;
1020 margin: -.414em -50%;
1021 }
1022
1023 .triangle_light_red{
1024 font-size: 4px; /* Font changes the icon size */
1025
1026 position: relative;
1027 width: 6em;
1028 height: 6em;
1029 text-align: center;
1030 overflow: hidden;
1031 border-radius: 100%;
1032 }
1033 .triangle_light_red:before{
1034 content: '';
1035 position: absolute;
1036 border: solid 3em transparent;
1037 border-bottom-color: #ffe0e0;
1038 border-bottom-width: 5em;
1039 border-top-width: 0;
1040 margin: -.414em -50%;
1041 }
1042
1043 .triangle_dark_red{
1044 font-size: 4px; /* Font changes the icon size */
1045
1046 position: relative;
1047 width: 6em;
1048 height: 6em;
1049 text-align: center;
1050 overflow: hidden;
1051 border-radius: 100%;
1052 }
1053 .triangle_dark_red:before{
1054 content: '';
1055 position: absolute;
1056 border: solid 3em transparent;
1057 border-bottom-color: #992d28;
1058 border-bottom-width: 5em;
1059 border-top-width: 0;
1060 margin: -.414em -50%;
1061 }
1062
1063 .triangle_gray{
1064 font-size: 4px; /* Font changes the icon size */
1065
1066 position: relative;
1067 width: 6em;
1068 height: 6em;
1069 text-align: center;
1070 overflow: hidden;
1071 border-radius: 100%;
1072 }
1073 .triangle_gray:before{
1074 content: '';
1075 position: absolute;
1076 border: solid 3em transparent;
1077 border-bottom-color: #888888;
1078 border-bottom-width: 5em;
1079 border-top-width: 0;
1080 margin: -.414em -50%;
1081 }
1082 /*------------ Triangle Legend Colors -----------------------*/
1083 /*------------ Legend colors for the hub dots ---------------*/
1084
1085
1086 /*------------ Colors for the hub predictive results -------*/
1087 .predictive_green{
1088 background-color: #18a332;
1089 border: 2px solid #000000;
1090 color: #FFFFFF;
1091
1092 }
1093 .predictive_green_light{
1094 background-color: #98f58c;
1095 border: 2px solid #000000;
1096 color: #FFFFFF;
1097 }
1098 .predictive_purple{
1099 background-color: #9532A8;
1100 border: 2px solid #000000;
1101 color: #FFFFFF;
1102 }
1103 .predictive_grey{
1104 background-color: #888888;
1105 border: 2px solid #000000;
1106 color: #FFFFFF;
1107 }
1108 /*------------ Colors for the hub predictive results -------*/
1109
1110 /* -------------------- Right Click Menu ------------------- */
1111 #rc_menu {
1112 display: block;
1113 opacity: 1;
1114 position: fixed;
1115 background: #fff;
1116 color: #555;
1117 font-family: sans-serif;
1118 font-size: 11px;
1119 -webkit-transition: opacity .5s ease-in-out;
1120 -moz-transition: opacity .5s ease-in-out;
1121 -ms-transition: opacity .5s ease-in-out;
1122 -o-transition: opacity .5s ease-in-out;
1123 transition: opacity .5s ease-in-out;
1124 -webkit-box-shadow: 2px 2px 2px 0px rgba(143, 144, 145, 1);
1125 -moz-box-shadow: 2px 2px 2px 0px rgba(143, 144, 145, 1);
1126 box-shadow: 2px 2px 2px 0px rgba(143, 144, 145, 1);
1127 padding: 0px;
1128 border: 1px solid #C6C6C6;
1129 }
1130
1131 #rc_menu a {
1132 display: block;
1133 color: #555;
1134 text-decoration: none;
1135 padding: 6px 8px 6px 30px;
1136 width: 250px;
1137 position: relative;
1138 }
1139
1140 #rc_menu a span {
1141 color: #BCB1B3;
1142 float: right;
1143 }
1144
1145 #rc_menu a:hover {
1146 color: #fff;
1147 background: #3879D9;
1148 }
1149
1150 #rc_menu hr {
1151 border: 1px solid #EBEBEB;
1152 border-bottom: 0;
1153 }
1154 /* -------------------- Right Click Menu ------------------- */
1155/*------------ GRID STYLEZ ----------------------------------*/
1156/*------------ YOU JUST LOST THE GAME -----------------------*/
1157/*------------ Table main table colors ----------------------*/
1158 .shawn-grid-spinner{
1159 align-items: center;
1160 justify-content: center;
1161 }
1162 shawn-grid{
1163 display: flex;
1164 flex-direction: column;
1165 min-height: 300px;
1166 background-color: #ebe8e8;
1167 }
1168 /*Anthony Edit*/
1169 .no-margins{
1170 margin: 0px;
1171 }
1172 .icon-container{
1173 display: flex;
1174 flex-direction: row;
1175 }
1176 .button-container{
1177 display: flex;
1178 flex-direction: column;
1179 }
1180 .grid-icon{
1181 max-width: 50px;
1182 }
1183 .grid-icon:hover{
1184 max-width: 50px;
1185 transform: scale(1.1);
1186 cursor: pointer;
1187 }
1188 .grid_row{
1189 position:relative;
1190 width:auto;
1191 height:auto;
1192 }
1193 .grid_row:hover{
1194 }
1195 .project-info-container{
1196 display: flex;
1197 height: 35px;
1198 width: 80%;
1199 justify-content: space-between;
1200 }
1201 #display_comments{
1202 display: none;
1203 font: 12px Arial;
1204 padding: 2px 3px;
1205 text-align: center;
1206 }
1207 #display_comments.display_comments_block{
1208 display: block;
1209 z-index: 9001;
1210 }
1211 .locked_comment{
1212
1213 }
1214 .listening{
1215
1216 }
1217 .display_comments_block{
1218 display: block;
1219 z-index: 9001;
1220 }
1221 .display_comments_none{
1222 display: none;
1223 }
1224 .comment_container{
1225 width: 15px;
1226 height: 15px;
1227 /* position: absolute; */
1228 position: absolute;
1229 float: left;
1230 background-color: transparent;
1231 z-index: 9000;
1232 /* pointer-events: none; */
1233 }
1234 .comment_container:hover{
1235 z-index: 9002;
1236 }
1237 .comment_container_active{
1238 z-index: 9002;
1239 }
1240 .comment_container_active .comment_corner {
1241 z-index: 9002;
1242 border-top: 15px solid #FF0000;
1243 }
1244 .comment_corner{
1245 position: relative;
1246 /* top: -4px; */
1247 /* left: -4px; */
1248 width: 0;
1249 height: 0;
1250 opacity: 0.5;
1251 border-bottom: 15px solid transparent;
1252 border-right: 15px solid transparent;
1253 border-top: 15px solid #0000FF;
1254 pointer-events: none;
1255 z-index: 9003;
1256 }
1257 /*End Anthony Edit*/
1258 .comment_corner span{
1259 width: 8px;
1260 text-align: center;
1261 font-size: 12px;
1262 font-family: arial;
1263 font-weight: bold;
1264 color: #FFFFFF;
1265 transform: rotate(-45deg);
1266 pointer-events: none;
1267 z-index: 9003;
1268 }
1269 .grid_table{
1270 border: solid 1px #dddddd;
1271 border-collapse: collapse;
1272 padding: 2px 3px;
1273 text-align: center;
1274 }
1275 .grid_table_header{
1276 padding: 5px;
1277 font: 12px Arial;
1278 font-weight: normal;
1279 color: #E3E3E3;
1280 background-color: #666666;
1281
1282 border: solid 1px #dddddd;
1283 border-collapse: collapse;
1284 text-align: center;
1285 }
1286 .grid_table_data{
1287 font: 12px Arial;
1288
1289 border: solid 1px #dddddd;
1290 border-collapse: collapse;
1291 padding: 2px 3px;
1292 text-align: center;
1293 }
1294
1295 .grid_menu{
1296 position: relative;
1297 top: -1px;
1298 left: -4px;
1299 float: left;
1300 padding: 0px 3px 0px 8px;
1301 color: #CCCCCC;
1302 z-index:1;
1303 }
1304 .grid_menu:hover{
1305 color: #FFFFFF;
1306 }
1307 .grid_menu_options{
1308 position:absolute;
1309 width:calc(100% - 10px);
1310 }
1311 .grid_menu_options:hover{
1312 background-color: #D3D3D3;
1313 }
1314 .filter_box{
1315 position: relative;
1316 width: 260px;
1317 height: 220px;
1318 border: 1px solid #888888;
1319 background-color: #FFFFFF;
1320 color: #000000;
1321 padding: 5px;
1322 text-align: left;
1323 align: left;
1324 float: left;
1325 z-index: 3;
1326 }
1327
1328 .pagination_area{
1329 position: relative;
1330 float: left;
1331 font: 14px Arial;
1332 color: #666666;
1333 }
1334 .pagination_links{
1335 position: relative;
1336 top: 2px;
1337 font: 14px Arial;
1338 color: #666666;
1339 text-decoration:none;
1340 }
1341
1342 .pagination_block{
1343 position: relative;
1344 top : 2px;
1345 border: 1px solid #666666;
1346 padding: 0px 5px 0px 5px;
1347 }
1348
1349 .pagination_selected_link{
1350 font-weight: bold;
1351 font: 20px Arial;
1352 color: #444444;
1353 /* text-decoration: underline; */
1354 }
1355
1356 .pagination_page_number_textbox{
1357 position: relative;
1358 width: 60px;
1359 }
1360
1361 .max_results_per_page{
1362 position: relative;
1363 float: left;
1364 top: 5px;
1365 left: 5px;
1366 font: 14px Arial;
1367 color: #666666;
1368 }
1369
1370 .round{
1371 -webkit-border-radius: 3px;
1372 -moz-border-radius: 3px;
1373 border-radius: 3px;
1374 }
1375
1376 .interface-grid-wrapper{
1377 width: 100%;
1378 display: flex;
1379 flex-direction: column;
1380 }
1381
1382 .arrow-up {
1383 width: 0;
1384 height: 0;
1385 border-left: 8px solid transparent;
1386 border-right: 8px solid transparent;
1387
1388 border-bottom: 12px solid #808B96;
1389 float: right;
1390 margin-left: 10px;
1391 margin-top: 5px;
1392 }
1393 .arrow-down {
1394 width: 0;
1395 height: 0;
1396 border-left: 8px solid transparent;
1397 border-right: 8px solid transparent;
1398
1399 border-top: 12px solid #808B96;
1400 float: right;
1401 margin-left: 10px;
1402 margin-top: 5px;
1403 }
1404 .hostport-check-container{
1405 display: flex;
1406 background-color: white;
1407 flex-direction: column;
1408 align-items: center;
1409 height: 250px;
1410 width: 300px;
1411 border: 1px solid black;
1412 border-radius: 10px 10px 10px 10px;
1413 position: absolute;
1414 z-index: 999999;
1415 top: 10%;
1416 left: 45%;
1417 box-shadow: 2px 2px 5px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0, 0, 25, .3),inset -2px -2px 5px rgba(0, 0, 25, .3);
1418 }
1419 .hostport-close-button{
1420
1421 }
1422 .hostport-result-container{
1423 display: flex;
1424 flex-direction: row;
1425 align-items: center;
1426 justify-content: space-between;
1427 width: 250px;
1428 padding-left: 10px;
1429 padding-right: 10px;
1430 cursor: pointer;
1431 border-bottom: 1px solid black;
1432 border-radius: 5px 5px 5px 5px;
1433 }
1434 .hostport-result-container:hover{
1435 /* background-color: #888888; */
1436 box-shadow: inset 2px 0px 5px rgba(44, 62, 135, .3),inset -2px 0px 5px rgba(44, 62, 135, .3);
1437 }
1438 .hostport-list-container{
1439 display: flex;
1440 flex-direction: column;
1441 width: 100%;
1442 height: 175px;
1443 overflow-y: scroll;
1444 align-items: center;
1445 }
1446 .hostport-list-container::-webkit-scrollbar {
1447 /* display: none; Safari and Chrome */
1448 }
1449 .hostport-title-bar{
1450 cursor: grab;
1451 display: flex;
1452 align-items: center;
1453 justify-content: space-between;
1454 width: 100%;
1455 background-color: #2c5287;
1456 color: white;
1457 font: 14px Arial;
1458 font-weight: bold;
1459 border-top-left-radius: 10px;
1460 border-top-right-radius: 10px;
1461 }
1462 .hostport-title-bar *{
1463 margin-left: 10px;
1464 margin-right: 10px;
1465 }
1466 .hostport-error-symbol {
1467 width: 10px;
1468 height: 10px;
1469 background-color: red;
1470 border: 1px solid black;
1471 box-shadow: -1px 0px 2px rgba(0, 0, 0, 0.8);
1472 border-radius: 3px 3px 3px 3px;
1473 }
1474 .hostport-row-number{
1475 width: 75px;
1476 }
1477 .hostport-validate-button-container{
1478 display: flex;
1479 align-items: center;
1480 justify-content: center;
1481 }
1482 .validation-container{
1483 display: flex;
1484 background-color: white;
1485 flex-direction: column;
1486 align-items: center;
1487 height: 350px;
1488 width: 1100px;
1489 border: 1px solid black;
1490 border-radius: 10px 10px 10px 10px;
1491 position: absolute;
1492 z-index: 999999;
1493 top: 10%;
1494 left: 25%;
1495 box-shadow: 2px 2px 5px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0, 0, 25, .3),inset -2px -2px 5px rgba(0, 0, 25, .3);
1496 }
1497 #duplicate-menu-container{
1498 display: flex;
1499 align-items: center;
1500 flex-direction: column;
1501 }
1502 #duplicate-result-outer-container{
1503 display: flex;
1504 align-items: center;
1505 flex-direction: column;
1506 overflow-y: scroll;
1507 }
1508 .duplicate-result-container{
1509 display: grid;
1510 width: 1050px;
1511 grid-template-columns: 3% 3% 6% 26% 7% 26% 9% 5% 7% 7%;
1512 position: relative;
1513
1514 }
1515 /*width of 717 to align with the results with a scrollbar.*/
1516 .duplicate-title-container{
1517 display: grid;
1518 width: 1067px;
1519 grid-template-columns: 3% 3% 5.5% 25.5% 7% 25.5% 9% 5% 7% 7%
1520 }
1521 .duplicate-header{
1522 display: flex;
1523 align-items: center;
1524 justify-content: flex-start;
1525 background-color: rgb(230, 236, 245);
1526 }
1527 .duplicate-result{
1528 text-overflow: ellipsis;
1529 overflow: hidden;
1530
1531 white-space: nowrap;
1532 margin-top: 5px;
1533 margin-bottom: 5px;
1534 background-color: rgb(230, 236, 245);
1535 }
1536 .inner-duplicate::before{
1537 content: '';
1538 display: flex;
1539 position: absolute;
1540 width: 10px;
1541 height: 10px;
1542 background-color: #ffe0e0;
1543 border: 1px solid #992d28;
1544 left: 455px;
1545 top: 9px;
1546 }
1547 .approved-inner-duplicate::before{
1548 content: '';
1549 display: flex;
1550 position: absolute;
1551 width: 10px;
1552 height: 10px;
1553 background-color: #e4d659;
1554 border: 1px solid #180e0e;
1555 left: 455px;
1556 top: 9px;
1557 }
1558 .approved-outer-duplicate::before{
1559 content: '';
1560 display: flex;
1561 position: absolute;
1562 width: 10px;
1563 height: 10px;
1564 background-color: #eb8a49;
1565 border: 1px solid #180e0e;
1566 left: 455px;
1567 top: 9px;
1568 }
1569 .outer-duplicate::before{
1570 content: '';
1571 display: flex;
1572 position: absolute;
1573 width: 10px;
1574 height: 10px;
1575 background-color: #992d28;
1576 border: 1px solid #ffe0e0;
1577 left: 455px;
1578 top: 9px;
1579 }
1580 .duplicate-result p {
1581 padding-left: 3px;
1582 padding-right: 3px;
1583 }
1584 .approve-duplicate-container{
1585 display: flex;
1586 background-color: white;
1587 flex-direction: column;
1588 align-items: center;
1589 height: 350px;
1590 width: 500px;
1591 border: 1px solid black;
1592 border-radius: 10px 10px 10px 10px;
1593 position: absolute;
1594 z-index: 999999;
1595 top: 10%;
1596 left: 45%;
1597 box-shadow: 2px 2px 5px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0, 0, 25, .3),inset -2px -2px 5px rgba(0, 0, 25, .3);
1598 }
1599 .duplicate-form-container {
1600 display: flex;
1601 flex-direction: column;
1602 align-items: stretch;
1603 width: 450px;
1604 justify-content: center;
1605 }
1606 .duplicate-form-container *{
1607 margin-top: 5px;
1608 margin-bottom: 5px;
1609 }
1610 .duplicate-form-container p {
1611 text-align: left;
1612 }
1613 .duplicate-button-container {
1614 display: flex;
1615 flex-direction: row;
1616 align-items: center;
1617 justify-content: space-around;
1618 }
1619 .duplicate-button{
1620 margin-top: 5px;
1621 margin-bottom: 5px;
1622 }
1623 .duplicate-button:hover{
1624 background-color: rgb(230, 236, 245);
1625 margin-top: 5px;
1626 margin-bottom: 5px;
1627 }
1628 .duplicate-button:active {
1629 box-shadow: #422800 1px 1px 0 0;
1630 transform: translate(1px, 1px);
1631 }
1632 .duplicate_checkbox{
1633 accent-color: green;
1634 }
1635 .floating_div_autobom{
1636 width: 1400px;
1637 height: auto;
1638 position: fixed;
1639 top: 50%;
1640 left: 50%;
1641 margin-top: -400px;
1642 margin-left: -700px;
1643 z-index: 200000; /* 1px higher than the overlay layer */
1644 }
1645
1646
1647/* -------------------- Keep these at the bottom ---------------------- */
1648
1649[[custom_style]]
1650
1651[[custom_override]]
Keyboard: j next diff k previous diff g top G bottom r restore c compile-check ? help