3 Copyright 2016-2017, Huawei Technologies Co., Ltd.
5 Licensed under the Apache License, Version 2.0 (the "License");
6 you may not use this file except in compliance with the License.
7 You may obtain a copy of the License at
9 http://www.apache.org/licenses/LICENSE-2.0
11 Unless required by applicable law or agreed to in writing, software
12 distributed under the License is distributed on an "AS IS" BASIS,
13 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
14 See the License for the specific language governing permissions and
15 limitations under the License.
24 font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun;
35 background-color: #f5f5f5;
38 .openo-accordion-resizable-handle {
39 z-index: 1 !important;
50 .openoAccordian_accordionmenu {
54 list-style-type: none;
58 .openoAccordian_accordionmenu li {
62 list-style-type: none;
67 .openo_accordion_ui-icon-collapse, .openo_accordion_ui-icon-expand {
71 border-bottom: 1px solid #e5e5e5;
77 .openo_accordion_ui-icon-expand {
78 background: url(../thirdparty/images/collapse_arrow.png) right 20px no-repeat;
82 .openo_accordion_ui-icon-expand.current {
83 background: url(../thirdparty/images/expand_arrow.png) right 20px no-repeat;
86 .openoAccordian_showHideArrow_hide, .openoAccordian_showHideArrow_show {
94 background-color: #f5f5f5;
97 .openoAccordian_showHideArrow_hide {
98 background-image: url(../images/openo.png);
99 background-position: -7px 0 !important;
100 border-collapse: separate;
101 /*box-shadow: inset -1px 0 0 #e5e5e5;*/
104 a.header.opened, a.header.closed {
107 padding-bottom: 25px;
111 .openoAccordian_accordionmenu .closed, .openoAccordian_accordionmenu .opened {
113 background-position: 98% 50%;
114 background-repeat: no-repeat;
118 .openoAccordian_accordionmenu li a {
119 padding: 11px 10px 12px;
122 text-align: left !important;
123 font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun;
125 text-overflow: ellipsis;
128 border-top: 1px solid #e5e5e5;
129 border-bottom: 1px solid #e5e5e5;
133 .openoAccordian_accordionmenu ul {
139 .openoAccordian_accordionmenu a {
141 text-decoration: none;
146 text-decoration: none;
160 background-image: url(../images/openo.png);
161 background-position: -39px 0 !important;
163 /*margin-top: -430px;*/
171 border: 1px solid #ddd;
174 .openo_accordion_selected {
178 border-left: 3px solid #4ac9ff !important;
187 .openoAccordian_accordionmenu li.openo_accordion_selected a {
193 .openo-accordion-resizable-handle {
194 z-index: 1 !important;
205 #iframeContainer iframe {
211 #accordionContent, #iframeContainer {
219 .openoAccordian_showHideArrow_show {
220 background-image: url(../images/openo.png);
221 background-position: -39px 0 !important;
222 box-shadow: inset 1px 0 0 #e5e5e5, inset -1px 0 0 #e5e5e5;
226 /* text-align: center; */
227 letter-spacing: 1.4px;
230 .homecontent h3, .homecontent h4, .homecontent h5{
233 text-transform: capitalize;
234 border-top: 2px solid #f1f1f1;
235 border-bottom: 2px solid #f1f1f1;
237 display: inline-block;
239 -webkit-animation: textScroll 500ms linear;
240 animation: textScroll 500ms linear;
251 @-webkit-keyframes textScroll {
256 @keyframes textScroll {
266 #msgModal .modal-body .container {
269 #msgModal .modal-body .icon {
273 #msgModal .modal-body .icon_error {
276 #msgModal .modal-body .icon_info {
279 #msgModal .modal-body .icon_warning{
282 #msgModal .modal-body .icon_confirm {
285 #msgModal .modal-body .msg {
289 /*#msgModal .modal-body .container .row {
291 #msgModal .modal-body .row {
295 #msgModal .modal-body .row:before{
297 display: inline-block;
298 vertical-align: middle;
300 /* adjust for white space between pseudo element and next sibling */
301 margin-right: -.25em;
302 /* stretch line height */
306 #msgModal .modal-body .row .msg {
307 /*display: inline-block;
308 vertical-align: middle;
309 white-space: normal;*/
310 /* vertical-align: middle; */
313 -webkit-transform: translateY(-50%);
314 -ms-transform: translateY(-50%);
315 transform: translateY(-50%);
322 #funModal .modal-content .modal-header{
324 border-radius: 5px 5px 0 0;
333 font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun;
336 border: 1px solid #d3d3d3;
338 box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
339 -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
340 background: linear-gradient(to bottom, #fff, #fafafa);
344 border-color: #4ac9ff;
356 #iconBtn span.pull-left {
359 #iconBtn span.pull-right {
370 #buttonArea div .btn-block{
384 #dropdown .dropup .dropdown-menu {
386 bottom: 34% !important;
389 #dropdown .dropdown-menu {
395 #plainDropDown > .dropdownplain {
401 #plainDropDown > .dropdownplain > ul > li {
402 border: 1px solid #c3c3c3;
406 #plainDropDown ul li a {
410 #plainDropDown > .dropdownplain > ul > li > a > span {
413 #plainDropDown ul li a:hover {
416 #plainDropDown .dropdown-menu {
422 /* Credit to bootsnipp.com for the css for the color graph */
428 background-image: -webkit-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
429 background-image: -moz-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
430 background-image: -o-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
431 background-image: linear-gradient(to right, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
434 /* Radio and CheckBoxes------------*/
445 border: 1px solid #D1D3D4;
449 .funkyradio input[type="radio"]:empty,
450 .funkyradio input[type="checkbox"]:empty {
454 .funkyradio input[type="radio"]:empty ~ label,
455 .funkyradio input[type="checkbox"]:empty ~ label {
461 -webkit-user-select: none;
462 -moz-user-select: none;
463 -ms-user-select: none;
467 .funkyradio input[type="radio"]:empty ~ label:before,
468 .funkyradio input[type="checkbox"]:empty ~ label:before {
477 border-radius: 3px 0 0 3px;
480 .funkyradio input[type="radio"]:hover:not(:checked) ~ label,
481 .funkyradio input[type="checkbox"]:hover:not(:checked) ~ label {
485 .funkyradio input[type="radio"]:hover:not(:checked) ~ label:before,
486 .funkyradio input[type="checkbox"]:hover:not(:checked) ~ label:before {
492 .funkyradio input[type="radio"]:checked ~ label,
493 .funkyradio input[type="checkbox"]:checked ~ label {
497 .funkyradio input[type="radio"]:checked ~ label:before,
498 .funkyradio input[type="checkbox"]:checked ~ label:before {
502 background-color: #ccc;
505 .funkyradio input[type="radio"]:focus ~ label:before,
506 .funkyradio input[type="checkbox"]:focus ~ label:before {
507 box-shadow: 0 0 0 3px #999;
510 .funkyradio-default input[type="radio"]:checked ~ label:before,
511 .funkyradio-default input[type="checkbox"]:checked ~ label:before {
513 background-color: #ccc;
516 .funkyradio-primary input[type="radio"]:checked ~ label:before,
517 .funkyradio-primary input[type="checkbox"]:checked ~ label:before {
519 background-color: #337ab7;
522 .funkyradio-success input[type="radio"]:checked ~ label:before,
523 .funkyradio-success input[type="checkbox"]:checked ~ label:before {
525 background-color: #5cb85c;
528 .funkyradio-danger input[type="radio"]:checked ~ label:before,
529 .funkyradio-danger input[type="checkbox"]:checked ~ label:before {
531 background-color: #d9534f;
534 .funkyradio-warning input[type="radio"]:checked ~ label:before,
535 .funkyradio-warning input[type="checkbox"]:checked ~ label:before {
537 background-color: #f0ad4e;
540 .funkyradio-info input[type="radio"]:checked ~ label:before,
541 .funkyradio-info input[type="checkbox"]:checked ~ label:before {
543 background-color: #5bc0de;
548 background-color: #428bca;
549 border-color: #357ebd;
557 .btn-primary.outline {
558 border: 2px solid #0099cc;
562 /*background-color: #cccccc;*/
563 background: linear-gradient(to bottom, #fbfbfb 0, #f6f6f6 70%, #f0f0f0 100%);
576 #accordionArea .panel-group .panel-title a:before {
577 font-family: "Glyphicons Halflings";
578 content:"\e259";/*\e094*/
579 /*position: absolute;
583 text-decoration: none !important;
585 #accordionArea .panel-group .panel-title a.collapsed:before {
586 content:"\e258";/*\e092*/
592 background-color: #eaeaea;
597 #accordionArea h3 a {
598 text-decoration: none;
600 #accordionArea .panel-group .panel {
603 -webkit-box-shadow: none;
610 #tabArea .tab-content div p {
636 .nav-tabs>li.active>a {
637 border-top: 3px solid #4ac9ff;
639 .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus {
640 border-top: 3px solid #4ac9ff;
642 .nav-tabs>li>a:hover {
643 border-color: transparent;
644 background-color: transparent;
646 .nav-stacked>li.active>a {
647 background-color: #fff;
650 border-left: 3px solid #4ac9ff;
653 #vtabArea .tab-content .tab-pane {
656 #vtabArea .tab-content .tab-pane p {
661 /*background-color: lightslategrey;*/
663 color: #4ac9ff !important;
665 border-left: 3px solid #4ac9ff;
671 background-color:yellow;
674 /* Functional & Notification*/
676 #myModal .modal-header, #msgModal .modal-header, #funModal .modal-header {
678 border-radius: 5px 5px 0 0;
682 #msgModal .modal-content {
686 box-shadow: 0 6px 10px rgba(0,0,0,.3);
687 -webkit-box-shadow: 0 6px 10px rgba(0,0,0,.3);
689 #msgModal .modal-footer, #funModal .modal-footer {
698 background-image: url('../thirdparty/images/searchicon.png'); /* Add a search icon to input */
699 background-position: 10px 9px; /* Position the search icon */
700 background-repeat: no-repeat; /* Do not repeat the icon image */
701 width: 100%; /* Full-width */
702 font-size: 16px; /* Increase font-size */
703 padding: 5px 20px 5px 40px; /* Add some padding */
704 border: 1px solid #ddd; /* Add a grey border */
705 margin-bottom: 12px; /* Add some space below the input */
709 border-collapse: collapse; /* Collapse borders */
710 width: 100%; /* Full-width */
711 border: 1px solid #ddd; /* Add a grey border */
712 font-size: 18px; /* Increase font-size */
715 #myTable_search th, #myTable td {
716 text-align: left; /* Left-align text */
717 padding: 12px; /* Add padding */
721 /* Add a bottom border to all table rows */
722 border-bottom: 1px solid #ddd;
725 #myTable_search tr.header, #myTable tr:hover {
726 /* Add a grey background color to the table header and on hover */
727 background-color: #f1f1f1;
735 /*border: 1px solid #333;*/
738 #listArea .list div {
746 #menu_accordion li a{
749 #menu_accordion li a:hover {
757 #panel1 li:first-child{
761 #menu_accordion #container, #menu_accordion #widgets, #menu_accordion #notifications, #menu_accordion #functional{
764 background-color: #F5F5F5;
793 background-color: #e3e3e3;
796 #provinceTable.table-striped>tbody>tr:nth-child(even)>td {
797 background-color:#fafafa;
800 #provinceTable.table-striped>tbody>tr:nth-child(odd)>td {
801 background-color:#f7f7f7
803 #provinceTable.table-striped>tbody>tr:hover {
804 background-color: red;
815 font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun;
821 font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun;
827 font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun;
830 .noChild_link_active {
831 /*background-color: lightslategrey;*/
833 color: #4ac9ff !important;
835 border-left: 3px solid #4ac9ff;
839 padding-left:0px !important;
840 padding-right:0px !important;
843 #menu_accordion .collapsed span {
844 background: url(../../thirdparty/images/expand_arrow.png) 1px 3px no-repeat;
852 #menu_accordion span {
853 background: url(../../thirdparty/images/collapse_arrow.png) 1px 3px no-repeat;
862 .magic-radio + label{
883 .css-form input.ng-invalid.ng-touched, textarea.ng-invalid.ng-touched {
884 background-color: #FA787E;
887 .css-form input.ng-valid.ng-touched, textarea.ng-valid.ng-touched {
888 background-color: white;
901 .customtable th,.table td{
902 /* padding-top: 3px!important; */
903 padding-bottom: 3px!important;
907 .customtable tr,.customtable td, .customtable th{
913 .ng-table th.sortable .sort-indicator {
918 .btn-group>.btn.active{
921 background-color: #428bca;
922 border-color: #428bca;
926 .customtable tbody tr:hover td{
927 background-color: #fafafa !important;
935 .ng-table-pager .pagination{
938 .ng-table-pager .ng-table-counts{
939 float:left !important;
949 font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun;
953 font-size:14px !important;
954 font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun;
960 font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun;
965 font-family: "Microsoft Yahei",Arial,Tahoma,Verdana,SimSun;
974 .form-group, .modal-header{
978 .labelHeader, .labelTitle {
982 text-transform: capitalize;
983 border-top: 2px solid #f1f1f1;
984 border-bottom: 2px solid #f1f1f1;
986 display: inline-block;
998 white-space: pre-line;
1002 background-image: url("../../thirdparty/images/add.png");
1005 background-image: url("../../thirdparty/images/edit.png");
1008 background-image: url("../../thirdparty/images/delete.png");