.nowrap { white-space: nowrap; } .ngCellText .app-icon-small { width: 24px; vertical-align: middle; } .filter-header { padding-bottom: 10px; } .app-name { padding-left: 10px; } .profile-selector-name .app-name { padding-left: 4px; } img.icon-small-app { width: 24px; height: 24px; vertical-align: text-bottom; } .profile-selector-name { line-height: 24px; } img.icon-selected-app { width: 64px; height: 64px; vertical-align: middle; } .selected-app-name { line-height: 36px; padding-left: 5px; } .controller-pod-counts { padding-right: 16px; padding-top: 8px; } .pipeline-build-block { background-color: #eeeeee; display: inline-block; width: 100%; } .pipeline-build { background: white; -moz-border-radius: 10px; border-radius: 10px; padding-top: 10px; padding-bottom: 10px; padding-left: 20px; padding-right: 20px; margin-top: 10px; margin-bottom: 10px; margin-left: 20px; margin-right: 20px; } .pipeline-deploy { background: white; border: 5px solid; -moz-border-radius: 10px; border-radius: 10px; padding-top: 10px; padding-bottom: 10px; padding-left: 20px; padding-right: 20px; margin-top: 10px; margin-bottom: 10px; margin-left: 20px; margin-right: 20px; color: black; } .widget-body > .pipeline-panel, .widget-body > .pipeline-panel > *, .widget-body > .pipeline-panel > * > *, .widget-body > .pipeline-panel > * > * > *, .widget-body > .pipeline-panel > * > * > * > * { height: 100%; vertical-align: middle; } .pipeline-block { width: 100%; } .build-fail { border-color: lightcoral; } .build-success { border-color: lightgreen; } .build-pending { border-color: khaki; } .build-aborted { border-color: silver; } .build-not-started { border-color: lightblue; } .pipeline-build a { color: black; } .pipeline-deploy a { color: black; } .pipeline-pod-counts { padding-right: 16px; padding-top: 8px; } .pipeline-row { background: lightgrey; height: 80px; display: inline; border-radius: 4px; text-align: center; vertical-align: middle; border: 20px; margin: 5px; } .pipeline-arrow { font-size: 1.2em; } .icon-heading { font-size: 24px; } .row-header { padding-bottom: 20px; } .project-overview-title { padding-left: 80px; padding-top: 18px; } .project-overview-title a { color: black; } /* .raw-json-view { width: 90%; height: 700px; } */ .raw-json-view .CodeMirror { height: 90%; } .k8sServiceApp-menu { width: 260px; } .k8sServiceApp > a { padding-top: 5px !important; padding-bottom: 5px !important; line-height: 32px !important; } .k8sServiceApp > a > img { vertical-align: bottom; } .k8sServiceApp > a > span { font-size: 14px; line-height: 32px; } .breadcrumb-tabs { padding-top: 5px; } tbody .ngCellText i { margin-right: 5px; } .log-success { color: green; } .log-warn { color: orange; } .log-error { color: red; } .form-warning.bg-danger { padding: 8px; } legend { border-bottom: none; } /* TODO lets work around some ui-bootstrap / patternfly css gremlins */ .modal .modal-dialog { margin-top: 0px; margin-bottom: 0px; } /* lets set this to the same size as modal-dialog */ .modal { width: 600px; } .btn.btn-padding { margin-left: 5px; margin-right: 5px; } .k8s-badge-batch { background-color: darkblue; } .k8s-badge-type { background-color: darkgreen; } .k8s-badge-region { background-color: darkred; } .k8s-badge-system { background-color: darkmagenta; } .k8s-badge-target { background-color: Red; } .badge-remind { background-color: Red; } .custom-alert { width: 300px; border: 2px solid #37B6D1; background-color: #fff; font-weight: bold; font-size: 12px; } .custom-alert-title { line-height: 25px; padding: 0px 5px; background-color: #37B6D1; } .custom-alert-body { cellspacing: 0; border: 0; } .custom-alert-td { padding: 0px 0px 0px 20; } .custom-alert-img { width: 64; height: 64; } .custom-alert-content { background-color: #fff; font-weight: bold; font-size: 12px; padding: 20px 0px; text-align: left; } .custom-alert-bottom { text-align: center; padding: 0px 0px 20px; background-color: #fff; } .custom-alert-ok { border: 1px solid #CCC; background-color: #CCC; width: 50px; height: 25px; } .custom-alert-cancel { border: 1px solid #CCC; background-color: #CCC; width: 50px; height: 25px; } .load-result { z-index: 1000000002; top: 40%; position: absolute; left: 47.5%; } .load-result-msg { z-index: 1000000002; top: 48%; position: absolute; left: 41.5%; } .load-effect-msg { position: absolute; z-index: 1000000002; left: 47.5%; top: 48%; } .system-info-danger-red-char { float: right; width: 52%; height: 30px; border: 0px; background-color: #FFFFFF; font-family: '微软雅黑', '宋体'; font-size: 16px; line-height: 1.5; color: #cc0000; } .system-info-danger-input { float: left; height: 32px; } .environment-row a { color: black; } .environment-row .panel { min-width: 255px; min-height: 160px; } .environment-row .panel-group { margin-left: 10px; margin-right: 10px; } .environment-row .panel-title > a:before { display: none; } .environment-rows { /* background-color: rgb(238, 238, 238); */ padding-top: 5px; vertical-align: top; } .environment-name-block { width: 200px; } .environment-name-block, .environment-deploy-block { background: white; -moz-border-radius: 10px; border-radius: 10px; padding-top: 10px; padding-bottom: 10px; padding-left: 20px; padding-right: 20px; margin-top: 10px; margin-bottom: 10px; margin-left: 20px; margin-right: 20px; } .environment-name-block { padding-top: 0px; } .environment-block { vertical-align: top; } .environment-deploy-block { border: 1px dashed; border-color: silver; } .environment-deploy-version-and-pods { padding-bottom: 5px; } .project-dashboard .page-header-row { background: white; margin-left: -20px; margin-right: -20px; margin-top: -20px; border-bottom: 1px solid #d1d1d1; margin-bottom: 13px; padding-bottom: 7px; } .project-dashboard .card-pf-title { margin-right: 1em; } .project-dashboard .no-border { border: none; margin-bottom: 0; } .project-dashboard .no-top-margin { margin-top: 0; } .project-dashboard .full-card-width { margin-left: -20px; margin-right: -20px; } .project-dashboard .card-pf.pipeline .panel-group { border-width: 0; } .project-dashboard .card-pf.pipeline .panel-group .panel { box-shadow: none; } .project-dashboard .card-pf.pipeline .panel-group .panel.panel-default { border-width: 0; border-top-width: 1px; } .project-dashboard .card-pf.pipeline .panel-group .panel.panel-default .log-panel { border: 1px solid #d4d4d4; } .filter-header .btn, .filter-header form { margin-top: 1.05em; margin-bottom: 1em; } .log-window { border-top: 1px solid #d4d4d4; overflow: auto; } .log-window-inner * { font-family: "DroidSansMonoRegular", monospace; line-height: 13px; } .log-panel { position: static; height: 100%; width: 100%; overflow: auto; border: none; padding: 3px; } .log-panel-inner * { font-family: "DroidSansMonoRegular", monospace; line-height: 13px; } .project-selector { margin-top: 10px; margin-bottom: 10px; list-style-type: none; } .project-selector a, .project-selector a:hover { color: #fff; text-decoration: none; font-size: 13px; line-height: 21px; } /* 样式重置 */ body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin: 0; padding: 0; } body, table, input, textarea, select, button { font-family: "微软雅黑", "宋体"; font-size: 12px; line-height: 1.5; background: #fff; } div, img, tr, td, table { border: 0; } table, tr, td { border: 0; cellspacing: 0; cellpadding: 0; } ol, ul, li { list-style-type: none; } a:link, a:visited { color: #7f7f7f; text-decoration: none; } a:hover, a:active { color: #000; } .fl { float: left; } .data_manager_button { width: 280px; height: 30px; border: 0px; position: fixed; float: right; left: 13%; top: 95%; } .fr { float: right; } .cl { clear: both; overflow: hidden; } /* 数据页面 */ .data_container { width: 100%; margin: 0 auto; } .data_heaer { height: 66px; width: 100%; background-color: #3499db; text-align: center; } .data_heaer h2 { font-size: 30px; font-weight: 300; color: #fff; line-height: 66px; } .data_content { width: 1280px; height: 838px; margin: 0 auto; background-color: #fff; border: 1px solid #e0dede; border-top: none; } .data_leftside { width: 611px; border-right: 1px solid #e0dede; } .data_h3 { width: 100%; text-align: center; height: 50px; font-size: 18px; color: #444; line-height: 50px; } .data_leftside_files { border-right: 1px solid #e0dede; border-bottom: 1px solid #e0dede; height: 710px; overflow: auto; } .data_leftside_files input { margin-top: 15px; width: 15px; height: 15px; } .data_leftside_files li { height: 40px; line-height: 40px; border-bottom: 1px solid #e0dede; padding: 0 10px; } .data_leftside_files li.data_title { width: 210px; height: 36px; line-height: 36px; text-align: center; background-color: #e9f3fb; border: none; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; white-space: nowrap; } .date_label { display: block; width: 168px; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; white-space: nowrap; } .data_leftside_shu { border-right: none; } .data_leftside_shu li { border-bottom: none; } .data_conbar { width: 149px; height: 834px; border-right: 1px solid #e0dede; border-left: 1px solid #e0dede; } .date_btns { width: 260px; margin: 20px auto; } .date_btns_w { width: 390px; } .date_btns button { margin: 10px 20px; } .data_btn { border: none; width: 108px; height: 35px; line-height: 35px; text-align: center; background-color: #3499db; color: #fff; font-size: 14px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; } .data_btn:hover { background-color: #2989da; } .data_rightside { width: 667px; } .data_rightside_w { width: 407px; } .data_leftside_files li.data_title_w { width: 184px; } .date_label_w { width: 150px; } .data_leftside_shu li { border-bottom: none; } a.data_file_btn { display: block; position: relative; width: 108px; height: 35px; margin: 15px auto; line-height: 35px; font-size: 14px; color: #fff; text-align: center; background-color: #79b4e7; background-image: -webkit-linear-gradient(#79b4e7, #1377cf); background-image: linear-gradient(#79b4e7, #1377cf); border-color: #076bc2; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; vertical-align: middle; cursor: pointer; margin: 0 10px; } a:hover.data_file_btn { background-color: #076bc2; background-image: -webkit-linear-gradient(#79b4e7, #076bc2); background-image: linear-gradient(#79b4e7, #076bc2); border-color: #076bc2; } .data_file_btn input { position: absolute; left: 0px; opacity: 0; filter: alpha(opacity=0); width: 108px; height: 35px; } .data_conbox { width: 407px; height: 709px; border-top: 1px solid #e0dede; border-bottom: 1px solid #e0dede; overflow: auto; } .data_con_title { width: 49.8%; height: 36px; line-height: 36px; text-align: center; background-color: #e9f3fb; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; white-space: nowrap; } .data_con_line { border-right: 1px solid #e0dede; } .data_con_li { width: 49.8%; height: 36px; line-height: 36px; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; white-space: nowrap; border-bottom: 1px solid #e0dede; } .mt15 { margin-top: 15px; } #file-uploads { opacity: 0; position: absolute; z-index: 10; width: 118px; height: 35px; } /* 树形结构 */ .data_rightside_tree { width: 259px; height: 709px; border-right: 1px solid #e0dede; border-top: 1px solid #e0dede; border-bottom: 1px solid #e0dede; overflow: auto; } .tree { min-height: 20px; padding: 15px; padding-left: 30px; border-bottom: 1px dashed #ccc; } .tree li { list-style-type: none; margin: 0; padding: 10px 5px 0 20px; position: relative; } .tree li::before, .tree li::after { content: ''; left: -30px; position: absolute; right: auto; } .tree li::before { border-left: 1px solid #999; bottom: 50px; height: 100%; top: 0; width: 0px; } .tree li::after { border-top: 1px solid #999; height: 20px; top: 25px; width: 35px; } .tree li p { display: inline-block; padding: 3px 10px; border: 1px solid #fff; margin-left: -15px; width: 150px; } .tree li.parent_li > p { cursor: pointer; } .tree > ul > li::before, .tree > ul > li::after { border: 0; } .tree li:last-child::before { height: 30px; } .icon-plus-sign { margin-left: -15px; background: url(../img/icons1.gif) -5px 10px no-repeat; } .icon-minus-sign { margin-left: -15px; background: url(../img/icons2.gif) -6px 9px no-repeat; } /* This is for the 'Overview' page with all the rows of boxes */ .service-view-rectangle { position: relative; margin-left: 0; margin-right: 0px; margin-bottom: 15px; margin-top: 0; background-color: #fafafa; border-width: 1px; border-style: solid; border-color: #eeeeee; } .service-view-rectangle .service-view-header { margin-top: 5px; margin-bottom: 5px; line-height: 20px; vertical-align: middle; } .service-view-rectangle .service-view-detail-pod-box { background-color: #eeeeee; display: inline-block; font-size: smaller; } .service-view-rectangle .service-view-header-delete .red { opacity: 0.5; transition: opacity 1s; font-size: larger; } .service-view-rectangle .service-view-header-delete:hover .red { opacity: 1; } .service-view-rectangle .service-view-icon img { width: 32px; height: 32px; margin-right: 6px; } .service-view-rectangle .service-view-name { font-size: larger; font-weight: bold; } .service-view-rectangle .service-view-detail-header { padding-top: 5px; padding-bottom: 5px; line-height: 20px; } .service-view-rectangle .service-view-detail-rectangle { background-color: #eeeeee; padding-left: 10px; padding-right: 10px; } .service-view-rectangle .service-view-detail-rectangle .value { font-weight: bold; } .service-view-rectangle .service-view-detail-pod-summary, .service-view-rectangle .service-view-detail-pod-summary-expand { display: inline-block; padding-top: 2px; padding-bottom: 2px; padding-left: 20px; padding-right: 20px; margin-right: 8px; margin-bottom: 8px; background-color: #ffffff; } .service-view-rectangle .service-view-detail-pod-summary table td, .service-view-rectangle .service-view-detail-pod-summary-expand table td { padding-left: 10px; padding-right: 10px; } .service-view-rectangle .service-view-detail-pod-status, .service-view-rectangle .service-view-detail-pod-connect { line-height: 36px; padding-right: 20px; } .service-view-rectangle .service-view-detail-pod-status i, .service-view-rectangle .service-view-detail-pod-connect i { font-size: 36px; display: inline-block; vertical-align: middle; } .service-view-rectangle .service-view-detail-pod-expand { color: #a0a0a0; font-size: 18px; padding-right: 0px; } .kubernetes-view .filter-header { margin-bottom: 1em; } /* This is all for the diagram, not the 'Overview' page */ .kubernetes-overview { width: 100%; height: 100%; display: table; table-layout: fixed; } .kubernetes-overview-row { display: table-row; } .kubernetes-overview-cell { display: table-cell; text-align: center; vertical-align: middle; padding: 0; } .service-wrapper { display: block; vertical-align: middle; } .kubernetes-node { margin-left: auto; margin-right: auto; cursor: pointer; text-align: center; vertical-align: middle; border: 1px solid #d4d4d4; background: white; box-shadow: 0 1px 10px rgba(0, 0, 0, 0.1); border-radius: 4px; transition: background 0.5s; z-index: 1000; } .kubernetes-host-container { margin-top: 5px; margin-bottom: 5px; margin-left: auto; margin-right: auto; text-align: center; max-width: 600px; min-width: 300px; padding: 0; border: 1px solid #d4d4d4; background: white; box-shadow: 0 1px 10px rgba(0, 0, 0, 0.1); border-radius: 4px; } .kubernetes-pod-node { display: block; margin: 0; padding: 0; min-height: 48px; line-height: 48px; border-radius: 0; border: 1px solid transparent; border-top: 1px solid #d4d4d4; box-shadow: none; vertical-align: middle; } .css-table { display: table; width: 100%; height: 100%; } .css-table-row { display: table-row; } .css-table-row .pod-status-cell { text-align: left; padding-left: 5px; padding-right: 5px; } .css-table-row .pod-status-cell i { margin-left: 3px; margin-right: 3px; } .css-table-row .pod-status-cell .clickable { width: auto !important; } .css-table-cell { display: table-cell; vertical-align: middle; } .kubernetes-pod-node i { font-size: 24px; } .kubernetes-overview-services { width: 200px; } .kubernetes-service-node { display: block; margin-bottom: 10px; width: 200px; min-height: 66px; padding: 0; line-height: 48px; } .kubernetes-service-node .node-body { display: inline; padding-left: 10px; line-height: 64px; font-size: 20px; float: left; } .kubernetes-service-node .node-header { display: inline; float: right; } .node-header { padding-right: 10px; white-space: nowrap; line-height: 64px; overflow: hidden; text-overflow: ellipsis; } .kubernetes-replicationController-node { border-radius: 64px; display: block; width: 64px; height: 64px; padding: 7px; font-weight: bold; vertical-align: middle; overflow: hidden; text-overflow: ellipsis; } .kubernetes-overview-cell .app-icon-medium { width: 48px; height: 48px; } .kubernetes-replicationController-node img { width: 64px; } .kubernetes-node:hover, .kubernetes-node.hovered { background: #ddddff; } .pod-status-cell { width: 80px; line-height: 20px; } .pod-label-cell { float: right; text-align: right; min-height: 48px; } .pod-label-cell .ngCellText { white-space: normal; } .pod-log-lines * { padding-left: 5px; padding-right: 5px; font-family: monospace; margin: 0; line-height: 14px; } .pod-log-lines * .black { color: #222; } .pod-log-lines * .red { color: #f22; } .pod-log-lines * .green { color: #2f2; } .pod-log-lines * .yellow { color: #ff2; } .pod-log-lines * .blue { color: #22f; } .pod-log-lines * .purple { color: #f2f; } .pod-log-lines * .cyan { color: #2dd; } .pod-log-lines * .white { color: #ddd; } .top-bottom-middle { line-height: 34px; } .terminal-window { position: fixed; bottom: 0; background: white; border: 1px solid #d4d4d4; overflow: hidden; z-index: 1040; } .terminal-window .resize-dot { width: 16px; height: 16px; border: 1px solid #d4d4d4; background: white; position: absolute; bottom: 10px; right: 10px; cursor: nwse-resize; border-radius: 8px; z-index: 10000; } .terminal-window.minimized .resize-dot, .terminal-window.maximized .resize-dot { display: none; } .terminal-window.minimized .terminal-title, .terminal-window.maximized .terminal-title { cursor: inherit; } .terminal-window .terminal-body { overflow: auto; } .terminal-window .terminal-body .terminal-wrapper > .terminal * { font-family: 'DroidSansMonoRegular'; } .terminal-window .terminal-title { cursor: move; border-bottom: 1px solid #d4d4d4; } .terminal-window .terminal-title > h5 { display: inline-block; margin-left: 5px; } .terminal-window .terminal-title > i { font-size: 16px; margin-right: 5px; margin-top: 7px; } kubernetes-container-terminal .terminal-wrapper { display: block !important; } kubernetes-container-terminal .terminal-actions { position: absolute !important; } .pod-log-window .scroll-indicator { position: absolute; bottom: 0; line-height: 32px; left: 20px; right: 20px; background-color: #ffffff; border-top: 1px solid #d4d4d4; border-left: 1px solid #d4d4d4; border-right: 1px solid #d4d4d4; border-radius: 4px 4px 0 0; cursor: pointer; z-index: 10000; opacity: 0.7; } .pod-log-window .terminal-body { overflow-y: auto; overflow-x: hidden; } .layout-pf.layout-pf-fixed .container-pf-nav-pf-vertical { margin-left: 170px; } .nav-pf-vertical { width: auto; min-width: 170px; } .nav-pf-vertical .list-group > .list-group-item > a { width: auto; } .nav-pf-vertical > .list-group > .list-group-item > a .fa, .nav-pf-vertical > .list-group > .list-group-item > a .glyphicon, .nav-pf-vertical > .list-group > .list-group-item > a .pficon { line-height: 25px; margin-right: 3px; } .nav-pf-vertical > .list-group > .list-group-item > a img { max-height: 16px; max-width: 16px; margin-right: 10px; } .navbar-tab-vertical { height: 70px; width: 100%; display: block; background: #1d1d1d; border-color: #1d1d1d; } .navbar-tab-horizontal { height: 100%; width: 100px; display: block; background: #1d1d1d; border-color: #1d1d1d; } .gesture { cursor: pointer; } .navbar-lf { width: 200px; min-height: 800px; background: #1d1d1d; position: absolute; left: 0; top: 0px; } .navbar-lf-menu { display: block; text-decoration: none; } .log-img { width: "66"; height: "21"; alt: "logo"; } .fl { float: left; } a.logo { display: block; width: 130px; padding: 20px 0 0 40px; } .content-margin { margin-left: 170px; }