You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ambari.apache.org by nc...@apache.org on 2017/11/13 16:57:23 UTC
[06/51] [abbrv] ambari git commit: AMBARI-22352 Ambari 3.0: Implement
new design for Admin View. (atkach)
http://git-wip-us.apache.org/repos/asf/ambari/blob/b8f7369b/ambari-admin/src/main/resources/ui/admin-web/app/styles/theme/bootstrap-ambari.css
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/styles/theme/bootstrap-ambari.css b/ambari-admin/src/main/resources/ui/admin-web/app/styles/theme/bootstrap-ambari.css
new file mode 100644
index 0000000..7d1ad61
--- /dev/null
+++ b/ambari-admin/src/main/resources/ui/admin-web/app/styles/theme/bootstrap-ambari.css
@@ -0,0 +1,1518 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+@font-face {
+ font-family: 'Roboto';
+ font-weight: normal;
+ font-style: normal;
+ src: url('fonts/Roboto-Regular-webfont.eot');
+ src: url('fonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/Roboto-Regular-webfont.woff') format('woff'), url('fonts/Roboto-Regular-webfont.ttf') format('truetype'), url('fonts/Roboto-Regular-webfont.svg#robotoregular') format('svg');
+}
+.font-mixin {
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ color: #333;
+}
+.btn,
+.btn:focus {
+ outline: none;
+ font-family: 'Roboto', sans-serif;
+ text-transform: uppercase;
+ height: 34px;
+ font-size: 14px;
+ padding: 10px 20px;
+ line-height: 14px;
+}
+.btn .glyphicon,
+.btn:focus .glyphicon {
+ top: -1px;
+ float: left;
+}
+.box-shadow {
+ box-shadow: 0 0 2px 0 #1391c1;
+}
+.btn-disabled {
+ opacity: 0.6;
+ box-shadow: none;
+}
+.btn-default-disabled {
+ opacity: 0.6;
+ box-shadow: none;
+ color: #FFF;
+ background-color: #808793;
+ border: none;
+}
+.btn-default,
+.btn-default:focus {
+ color: #666;
+ background-color: #FFF;
+ border: 1px solid #CFD3D7;
+}
+.btn-default:hover,
+.btn-default:focus:hover {
+ color: #FFF;
+ background-color: #808793;
+}
+.btn-default:active,
+.btn-default:focus:active {
+ color: #666;
+ background-color: #FFF;
+ border: 1px solid #CFD3D7;
+ box-shadow: 0 0 2px 0 #1391c1;
+}
+.btn-default[disabled],
+.btn-default:focus[disabled],
+.btn-default.disabled,
+.btn-default:focus.disabled {
+ opacity: 0.6;
+ box-shadow: none;
+ color: #FFF;
+ background-color: #808793;
+ border: none;
+}
+.btn-default[disabled]:active,
+.btn-default:focus[disabled]:active,
+.btn-default.disabled:active,
+.btn-default:focus.disabled:active,
+.btn-default[disabled].active,
+.btn-default:focus[disabled].active,
+.btn-default.disabled.active,
+.btn-default:focus.disabled.active,
+.btn-default[disabled]:hover,
+.btn-default:focus[disabled]:hover,
+.btn-default.disabled:hover,
+.btn-default:focus.disabled:hover {
+ opacity: 0.6;
+ box-shadow: none;
+ color: #FFF;
+ background-color: #808793;
+ border: none;
+}
+.btn-primary-disabled {
+ opacity: 0.6;
+ box-shadow: none;
+ color: #D1E8D1;
+ background-color: #3FAE2A;
+ border: 1px solid #3FAE2A;
+}
+.btn-primary,
+.btn-primary:focus {
+ color: #FFF;
+ background-color: #3FAE2A;
+ border: 1px solid #3FAE2A;
+}
+.btn-primary:hover,
+.btn-primary:focus:hover {
+ color: #FFF;
+ background-color: #429929;
+ border: 1px solid #429929;
+}
+.btn-primary:active,
+.btn-primary:focus:active,
+.btn-primary.active,
+.btn-primary:focus.active {
+ color: #FFF;
+ background-color: #3FAE2A;
+ border: 1px solid #3FAE2A;
+ box-shadow: 0 0 2px 0 #1391c1;
+}
+.btn-primary[disabled],
+.btn-primary:focus[disabled],
+.btn-primary.disabled,
+.btn-primary:focus.disabled {
+ opacity: 0.6;
+ box-shadow: none;
+ color: #D1E8D1;
+ background-color: #3FAE2A;
+ border: 1px solid #3FAE2A;
+}
+.btn-primary[disabled]:active,
+.btn-primary:focus[disabled]:active,
+.btn-primary.disabled:active,
+.btn-primary:focus.disabled:active,
+.btn-primary[disabled].active,
+.btn-primary:focus[disabled].active,
+.btn-primary.disabled.active,
+.btn-primary:focus.disabled.active,
+.btn-primary[disabled]:hover,
+.btn-primary:focus[disabled]:hover,
+.btn-primary.disabled:hover,
+.btn-primary:focus.disabled:hover {
+ opacity: 0.6;
+ box-shadow: none;
+ color: #D1E8D1;
+ background-color: #3FAE2A;
+ border: 1px solid #3FAE2A;
+}
+.btn-secondary-disabled {
+ opacity: 0.6;
+ box-shadow: none;
+ color: #D1E8D1;
+ background-color: #429929;
+ border: 1px solid #3FAE2A;
+}
+.btn-secondary,
+.btn-secondary:focus {
+ color: #429929;
+ background-color: #FFF;
+ border: 1px solid #3FAE2A;
+}
+.btn-secondary:hover,
+.btn-secondary:focus:hover {
+ color: #FFF;
+ background-color: #429929;
+}
+.btn-secondary:active,
+.btn-secondary:focus:active {
+ color: #429929;
+ background-color: #FFF;
+ box-shadow: 0 0 2px 0 #1391c1;
+}
+.btn-secondary[disabled],
+.btn-secondary:focus[disabled],
+.btn-secondary.disabled,
+.btn-secondary:focus.disabled {
+ opacity: 0.6;
+ box-shadow: none;
+ color: #D1E8D1;
+ background-color: #429929;
+ border: 1px solid #3FAE2A;
+}
+.btn-secondary[disabled]:active,
+.btn-secondary:focus[disabled]:active,
+.btn-secondary.disabled:active,
+.btn-secondary:focus.disabled:active,
+.btn-secondary[disabled].active,
+.btn-secondary:focus[disabled].active,
+.btn-secondary.disabled.active,
+.btn-secondary:focus.disabled.active,
+.btn-secondary[disabled]:hover,
+.btn-secondary:focus[disabled]:hover,
+.btn-secondary.disabled:hover,
+.btn-secondary:focus.disabled:hover {
+ opacity: 0.6;
+ box-shadow: none;
+ color: #D1E8D1;
+ background-color: #429929;
+ border: 1px solid #3FAE2A;
+}
+.btn-success {
+ border: none;
+}
+.btn-regular-default-state {
+ background-color: #FFF;
+ color: #666;
+ border: 1px solid #cfd3d7;
+}
+.btn-primary-default-state {
+ background-color: #3FAE2A;
+ border: 1px solid #3FAE2A;
+ color: #FFF;
+}
+.btn-group.open .btn.dropdown-toggle,
+.dropdown.open .btn.dropdown-toggle {
+ box-shadow: inset 0px 0px 3px 0px #1391c1;
+}
+.btn-group.open .btn.dropdown-toggle,
+.dropdown.open .btn.dropdown-toggle,
+.btn-group.open .btn.dropdown-toggle.btn-default,
+.dropdown.open .btn.dropdown-toggle.btn-default {
+ background-color: #FFF;
+ color: #666;
+ border: 1px solid #cfd3d7;
+}
+.btn-group.open .btn.dropdown-toggle:hover,
+.dropdown.open .btn.dropdown-toggle:hover,
+.btn-group.open .btn.dropdown-toggle.btn-default:hover,
+.dropdown.open .btn.dropdown-toggle.btn-default:hover {
+ background-color: #FFF;
+ color: #666;
+ border: 1px solid #cfd3d7;
+}
+.btn-group.open .btn.dropdown-toggle + .dropdown-menu > li > a:hover,
+.dropdown.open .btn.dropdown-toggle + .dropdown-menu > li > a:hover,
+.btn-group.open .btn.dropdown-toggle.btn-default + .dropdown-menu > li > a:hover,
+.dropdown.open .btn.dropdown-toggle.btn-default + .dropdown-menu > li > a:hover {
+ background-color: #808793;
+ color: #FFF;
+}
+.btn-group.open .btn.dropdown-toggle.btn-primary,
+.dropdown.open .btn.dropdown-toggle.btn-primary {
+ background-color: #3FAE2A;
+ border: 1px solid #3FAE2A;
+ color: #FFF;
+}
+.btn-group.open .btn.dropdown-toggle.btn-primary:hover,
+.dropdown.open .btn.dropdown-toggle.btn-primary:hover {
+ background-color: #3FAE2A;
+ border: 1px solid #3FAE2A;
+ color: #FFF;
+}
+.btn-group.open .btn.dropdown-toggle.btn-primary + .dropdown-menu > li > a:hover,
+.dropdown.open .btn.dropdown-toggle.btn-primary + .dropdown-menu > li > a:hover {
+ background-color: #429929;
+ color: #FFF;
+}
+.btn-group.open .dropdown-menu,
+.dropdown.open .dropdown-menu {
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ color: #333;
+ border-radius: 2px;
+ font-size: 14px;
+ min-width: 200px;
+ background: #FFF;
+ color: #666;
+ border: 1px solid #cfd3d7;
+}
+.btn-group.open .dropdown-menu > li,
+.dropdown.open .dropdown-menu > li {
+ margin-bottom: 1px;
+}
+.btn-group.open .dropdown-menu > li > a,
+.dropdown.open .dropdown-menu > li > a {
+ height: 24px;
+}
+.btn-group .btn.dropdown-toggle:first-child,
+.dropdown .btn.dropdown-toggle:first-child {
+ min-width: 80px;
+}
+.btn-group .btn.dropdown-toggle.disabled,
+.dropdown .btn.dropdown-toggle.disabled,
+.btn-group .btn.dropdown-toggle[disabled],
+.dropdown .btn.dropdown-toggle[disabled] {
+ opacity: 0.6;
+}
+input.form-control {
+ font-size: 14px;
+ border-radius: 2px;
+ color: #666;
+ border: 1px solid #CFD3D7;
+ height: 34px;
+ padding: 10px;
+}
+input.form-control:focus {
+ border-color: #1291c1;
+ box-shadow: none;
+}
+.help-block {
+ color: #999999;
+ font-size: 14px;
+}
+.help-block.validation-block {
+ color: #999999;
+ margin-top: 10px;
+}
+.help-block.validation-block::before {
+ position: relative;
+ top: 2px;
+ margin-right: 5px;
+ font-family: 'Glyphicons Halflings';
+}
+.has-success input.form-control {
+ color: #666;
+ border: 1px solid #1EB475;
+}
+.has-success input.form-control:focus {
+ border-color: #1EB475;
+ box-shadow: none;
+}
+.has-success .help-block.validation-block::before {
+ content: '\e084';
+ color: #1EB475;
+}
+.has-error input.form-control {
+ color: #666;
+ border: 1px solid #EF6162;
+}
+.has-error input.form-control:focus {
+ border-color: #EF6162;
+ box-shadow: none;
+}
+.has-error .help-block.validation-block::before {
+ content: '\e083';
+ color: #EF6162;
+}
+.has-warning input.form-control {
+ color: #666;
+ border: 1px solid #E98A40;
+}
+.has-warning input.form-control:focus {
+ border-color: #E98A40;
+ box-shadow: none;
+}
+.has-warning .help-block.validation-block::before {
+ content: '\e101';
+ color: #E98A40;
+}
+.form-control[disabled],
+.form-control[readonly],
+fieldset[disabled] .form-control {
+ color: #999999;
+ border-color: #cccccc;
+ background-color: #dddddd;
+}
+h2.table-title {
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ color: #333;
+ margin-top: 10px;
+ font-size: 20px;
+}
+.table {
+ color: #666;
+ font-size: 13px;
+}
+.table thead,
+.table tfoot {
+ color: #999;
+}
+.table input[type="checkbox"] + label {
+ position: relative;
+ line-height: 1.3em;
+ font-size: initial;
+ top: 4px;
+ margin-bottom: 0;
+}
+.table thead > tr > th {
+ border-bottom-color: #EEE;
+}
+.table tfoot > tr:first-of-type > td {
+ border-top-width: 2px;
+ border-top-color: #EEE;
+}
+.table > tbody > tr > td {
+ border-top-color: #EEE;
+}
+.table > tbody > tr.active {
+ background-color: #EEE;
+}
+.table > tbody > tr.active > td {
+ background-color: #EEE;
+}
+.table.table-hover .action {
+ visibility: hidden;
+ padding: 0;
+ line-height: 1;
+}
+.table.table-hover .action:hover {
+ text-decoration: none;
+}
+.table.table-hover > tbody > tr {
+ border-width: 0 1px 1px;
+ border-style: solid;
+ border-color: #EEE transparent;
+}
+.table.table-hover > tbody > tr > td {
+ border-width: 0;
+}
+.table.table-hover > tbody > tr:hover {
+ border-color: #A7DFF2;
+ background-color: #E7F6FC;
+}
+.table.table-hover > tbody > tr:hover > td {
+ border-top: 1px solid #A7DFF2;
+ background-color: #E7F6FC;
+}
+.table.table-hover > tbody > tr:hover > td .action {
+ visibility: visible;
+}
+.table.table-hover > tbody > tr:first-of-type > td {
+ border-top: 1px solid transparent;
+}
+.table.table-hover > tbody > tr:first-of-type:hover > td {
+ border-color: #A7DFF2;
+}
+.pagination-block .pagination-block-item {
+ float: left;
+ padding: 0 5px;
+}
+.pagination-block .pagination-block-item a,
+.pagination-block .pagination-block-item a:visited,
+.pagination-block .pagination-block-item a:focus {
+ text-decoration: none;
+}
+.pagination-block .pagination-block-item select {
+ border: none;
+ background-color: transparent;
+ color: #1491C1;
+}
+.nav.nav-tabs {
+ border: none;
+ margin-bottom: 20px;
+}
+.nav.nav-tabs li a {
+ border-width: 0;
+ border-radius: 0;
+ border-bottom: 3px solid transparent;
+ color: #6B6C6C;
+ text-transform: uppercase;
+}
+.nav.nav-tabs li a:hover,
+.nav.nav-tabs li a:active,
+.nav.nav-tabs li a:focus {
+ color: #333;
+ border-top-width: 0;
+ border-left-width: 0;
+ border-right-width: 0;
+ background: none;
+}
+.nav.nav-tabs li a .badge.badge-important {
+ display: inline;
+ vertical-align: baseline;
+}
+.nav.nav-tabs li.active a {
+ color: #333;
+ border-bottom: 3px solid #3FAE2A;
+ padding-bottom: 2px;
+}
+.nav-tabs-left li,
+.nav-tabs-right li {
+ float: none;
+ margin-bottom: 3px;
+}
+.nav-tabs-left li a,
+.nav-tabs-right li a {
+ margin-right: 0;
+}
+.nav-tabs-left li {
+ margin-right: -1px;
+}
+.nav-tabs-left li a {
+ border: 3px solid transparent !important;
+}
+.nav-tabs-left li.active a,
+.nav-tabs-left li.active a:hover,
+.nav-tabs-left li.active a:active,
+.nav-tabs-left li.active a:focus {
+ border-right: 3px solid #3FAE2A !important;
+}
+.nav-tabs-right li {
+ margin-left: -1px;
+}
+.nav-tabs-right li a {
+ border: 3px solid transparent !important;
+}
+.nav-tabs-right li.active a,
+.nav-tabs-right li.active a:hover,
+.nav-tabs-right li.active a:active,
+.nav-tabs-right li.active a:focus {
+ border-left: 3px solid #3FAE2A !important;
+}
+.wizard {
+ border: 2px solid #ebecf1;
+}
+.wizard .wizard-header h3 {
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ font-size: 20px;
+ color: #333;
+ margin: 15px 20px;
+}
+.wizard .wizard-body {
+ overflow: hidden;
+ margin: 0;
+}
+.wizard .wizard-body .wizard-content {
+ background: #ebecf1;
+ padding-top: 25px;
+ float: left;
+ margin-bottom: -99999px;
+ padding-bottom: 99999px;
+}
+.wizard .wizard-body .wizard-content .step-title {
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ color: #333;
+ font-weight: bold;
+ font-size: 18px;
+ color: #666;
+}
+.wizard .wizard-body .wizard-content .step-description {
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ color: #333;
+ font-size: 14px;
+ line-height: 1.4;
+ color: #999;
+}
+.wizard .wizard-body .wizard-content .panel.panel-default {
+ border: none;
+ box-shadow: none;
+ margin-top: 20px;
+}
+.wizard .wizard-body .wizard-content .panel.panel-default .panel-body {
+ padding: 30px 20px;
+}
+.wizard .wizard-body .wizard-nav {
+ min-height: 550px;
+ padding-top: 25px;
+ background-color: #323544;
+ float: left;
+ margin-bottom: -99999px;
+ padding-bottom: 99999px;
+}
+.wizard .wizard-body .wizard-nav .nav li {
+ padding: 0px 15px;
+}
+.wizard .wizard-body .wizard-nav .nav li a {
+ height: 48px;
+ padding: 0px 5px;
+ display: table-cell;
+ vertical-align: middle;
+}
+.wizard .wizard-body .wizard-nav .nav li .step-marker {
+ position: absolute;
+ top: 9px;
+ line-height: 16px;
+ text-align: center;
+ width: 20px;
+ height: 20px;
+ border: 2px solid #1EB475;
+ border-radius: 50%;
+ font-size: 12px;
+ font-style: inherit;
+ color: #1EB475;
+ background-color: #323544;
+}
+.wizard .wizard-body .wizard-nav .nav li .step-name {
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ color: #333;
+ font-size: 14px;
+ color: #999;
+ margin-left: 30px;
+}
+.wizard .wizard-body .wizard-nav .nav li .step-index {
+ line-height: 18px;
+}
+.wizard .wizard-body .wizard-nav .nav li .step-description {
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ color: #333;
+ font-size: 12px;
+ color: #999;
+ margin-left: 30px;
+}
+.wizard .wizard-body .wizard-nav .nav li.completed .step-marker {
+ background-color: #1EB475;
+ color: white;
+ font-size: 10px;
+ padding-left: 2px;
+}
+.wizard .wizard-body .wizard-nav .nav li.completed .step-marker .step-index {
+ display: none;
+}
+.wizard .wizard-body .wizard-nav .nav li.completed .step-marker:after {
+ font-family: "Glyphicons Halflings";
+ content: "\e013";
+ position: relative;
+ top: 1px;
+ left: -1px;
+}
+.wizard .wizard-body .wizard-nav .nav li.completed:after {
+ width: 2px;
+ height: 100%;
+ position: absolute;
+ background-color: #1EB475;
+ content: "";
+ top: 25px;
+ left: 29px;
+}
+.wizard .wizard-body .wizard-nav .nav li.completed:last-child:after {
+ content: none;
+}
+.wizard .wizard-body .wizard-nav .nav li.active .step-name {
+ font-weight: bold;
+}
+.wizard .wizard-body .wizard-nav .nav li.disabled .step-marker {
+ color: #666;
+ border-color: #666;
+}
+.wizard .wizard-body .wizard-nav .nav li.disabled .step-name,
+.wizard .wizard-body .wizard-nav .nav li.disabled .step-description {
+ color: #666;
+}
+.wizard .wizard-body .wizard-nav .nav li.disabled.completed .step-marker {
+ background-color: #1EB475;
+ border: 2px solid #1EB475;
+ color: white;
+}
+.wizard .wizard-body .wizard-nav .nav-pills > li.active > a,
+.wizard .wizard-body .wizard-nav .nav-pills > li.active > a:focus,
+.wizard .wizard-body .wizard-nav .nav-pills > li.active > a:hover,
+.wizard .wizard-body .wizard-nav .nav > li > a:focus,
+.wizard .wizard-body .wizard-nav .nav > li > a:hover {
+ background-color: inherit;
+}
+.wizard .wizard-body .wizard-footer {
+ background: white;
+ padding: 15px 20px;
+}
+.wizard .wizard-body .wizard-footer button {
+ margin: 0 10px;
+}
+.checkbox-disabled-style {
+ background-color: #b2b8c1;
+ border-color: #b2b8c1;
+}
+input[type="checkbox"]:not(:checked),
+input[type="radio"]:not(:checked),
+input[type="checkbox"]:checked,
+input[type="radio"]:checked {
+ display: none;
+}
+input[type="checkbox"]:not(:checked) + label,
+input[type="radio"]:not(:checked) + label,
+input[type="checkbox"]:checked + label,
+input[type="radio"]:checked + label {
+ position: relative;
+ padding-left: 20px;
+}
+input[type="checkbox"]:not(:checked) + label:hover:before,
+input[type="radio"]:not(:checked) + label:hover:before,
+input[type="checkbox"]:checked + label:hover:before,
+input[type="radio"]:checked + label:hover:before {
+ border-color: #1491C1;
+ background-color: #1491C1;
+}
+input[type="checkbox"]:checked + label:before,
+input[type="radio"]:checked + label:before {
+ background-color: #1491C1;
+ border-color: #1491C1;
+}
+input[type="checkbox"][disabled] + label:before,
+input[type="radio"][disabled] + label:before,
+input[type="checkbox"].disabled + label:before,
+input[type="radio"].disabled + label:before,
+input[type="checkbox"][disabled] + label:hover:before,
+input[type="radio"][disabled] + label:hover:before,
+input[type="checkbox"].disabled + label:hover:before,
+input[type="radio"].disabled + label:hover:before {
+ background-color: #b2b8c1;
+ border-color: #b2b8c1;
+}
+input[type="checkbox"] + label:before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 4px;
+ width: 10px;
+ height: 10px;
+ box-sizing: border-box;
+ border-radius: 2px;
+ border-width: 1px;
+ border-style: solid;
+ border-color: #ddd;
+}
+input[type="checkbox"]:checked + label:after {
+ content: '\2714';
+ color: #FFF;
+ position: absolute;
+ top: 0;
+ left: 2px;
+ font-size: 9px;
+}
+input[type="radio"] + label:before,
+input.radio + label:before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 12px;
+ height: 12px;
+ box-sizing: border-box;
+ border-radius: 12px;
+ border-width: 1px;
+ border-style: solid;
+ border-color: #ddd;
+}
+input[type="radio"]:checked + label:after,
+input.radio:checked + label:after {
+ content: '';
+ background-color: #FFF;
+ position: absolute;
+ top: 3px;
+ left: 3px;
+ width: 6px;
+ height: 6px;
+ border-radius: 6px;
+}
+.navigation-bar-container {
+ height: auto;
+ width: 230px;
+ background-color: #323544;
+ padding: 0;
+ -ms-overflow-style: none;
+ transition: width 0.5s ease-out;
+ -webkit-font-smoothing: antialiased;
+}
+.navigation-bar-container ul.nav.side-nav-header {
+ width: 230px;
+ transition: width 0.5s ease-out;
+}
+.navigation-bar-container ul.nav.side-nav-header li.navigation-header {
+ background: #313d54;
+ padding: 15px 5px 15px 25px;
+ height: 55px;
+}
+.navigation-bar-container ul.nav.side-nav-header li.navigation-header > a.ambari-logo {
+ padding: 0;
+}
+.navigation-bar-container ul.nav.side-nav-header li.navigation-header > a.ambari-logo > img {
+ height: 25px;
+ float: left;
+ margin-left: -3px;
+}
+.navigation-bar-container ul.nav.side-nav-header li.navigation-header .btn-group {
+ cursor: pointer;
+ margin-top: 3px;
+}
+.navigation-bar-container ul.nav.side-nav-header li.navigation-header .btn-group:hover span.ambari-header {
+ color: #fff;
+}
+.navigation-bar-container ul.nav.side-nav-header li.navigation-header .btn-group span.ambari-header {
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ color: #333;
+ font-size: 20px;
+ width: 55px;
+ display: inline;
+ color: #b8bec4;
+ padding: 0 8px 0 10px;
+}
+.navigation-bar-container ul.nav.side-nav-header li.navigation-header .btn-group span.toggle-icon {
+ margin-bottom: 5px;
+ font-size: 13px;
+ display: inline-block;
+ vertical-align: middle;
+ color: #43AD49;
+}
+.navigation-bar-container ul.nav.side-nav-header li.navigation-header .btn-group.open .dropdown-toggle {
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+.navigation-bar-container ul.nav.side-nav-header li.navigation-header ul.dropdown-menu {
+ top: 30px;
+}
+.navigation-bar-container ul.nav.side-nav-header li.navigation-header ul.dropdown-menu li > a {
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ color: #333;
+ font-size: 14px;
+ color: #666;
+ line-height: 1.42;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+.navigation-bar-container ul.nav.side-nav-header li.navigation-header ul.dropdown-menu li > a:hover {
+ background: #f5f5f5;
+}
+.navigation-bar-container ul.nav.side-nav-menu,
+.navigation-bar-container ul.nav.side-nav-footer {
+ background-color: #323544;
+ width: 230px;
+ transition: width 0.5s ease-out;
+}
+.navigation-bar-container ul.nav.side-nav-menu li,
+.navigation-bar-container ul.nav.side-nav-footer li {
+ padding: 0;
+ margin: 0;
+}
+.navigation-bar-container ul.nav.side-nav-menu li.navigation-footer > a,
+.navigation-bar-container ul.nav.side-nav-footer li.navigation-footer > a,
+.navigation-bar-container ul.nav.side-nav-menu li.submenu-li > a,
+.navigation-bar-container ul.nav.side-nav-footer li.submenu-li > a,
+.navigation-bar-container ul.nav.side-nav-menu li.mainmenu-li > a,
+.navigation-bar-container ul.nav.side-nav-footer li.mainmenu-li > a {
+ display: table-cell;
+ vertical-align: middle;
+ width: 230px;
+ border-radius: 0;
+ -moz-border-radius: 0;
+ -webkit-border-radius: 0;
+ white-space: nowrap;
+}
+.navigation-bar-container ul.nav.side-nav-menu li.navigation-footer > a .navigation-menu-item,
+.navigation-bar-container ul.nav.side-nav-footer li.navigation-footer > a .navigation-menu-item,
+.navigation-bar-container ul.nav.side-nav-menu li.submenu-li > a .navigation-menu-item,
+.navigation-bar-container ul.nav.side-nav-footer li.submenu-li > a .navigation-menu-item,
+.navigation-bar-container ul.nav.side-nav-menu li.mainmenu-li > a .navigation-menu-item,
+.navigation-bar-container ul.nav.side-nav-footer li.mainmenu-li > a .navigation-menu-item {
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ color: #333;
+ font-size: 14px;
+ color: #b8bec4;
+ padding-left: 8px;
+}
+.navigation-bar-container ul.nav.side-nav-menu li.navigation-footer > a .navigation-icon,
+.navigation-bar-container ul.nav.side-nav-footer li.navigation-footer > a .navigation-icon,
+.navigation-bar-container ul.nav.side-nav-menu li.submenu-li > a .navigation-icon,
+.navigation-bar-container ul.nav.side-nav-footer li.submenu-li > a .navigation-icon,
+.navigation-bar-container ul.nav.side-nav-menu li.mainmenu-li > a .navigation-icon,
+.navigation-bar-container ul.nav.side-nav-footer li.mainmenu-li > a .navigation-icon {
+ line-height: 18px;
+ font-size: 16px;
+ color: #b8bec4;
+}
+.navigation-bar-container ul.nav.side-nav-menu li.navigation-footer > a .toggle-icon,
+.navigation-bar-container ul.nav.side-nav-footer li.navigation-footer > a .toggle-icon,
+.navigation-bar-container ul.nav.side-nav-menu li.submenu-li > a .toggle-icon,
+.navigation-bar-container ul.nav.side-nav-footer li.submenu-li > a .toggle-icon,
+.navigation-bar-container ul.nav.side-nav-menu li.mainmenu-li > a .toggle-icon,
+.navigation-bar-container ul.nav.side-nav-footer li.mainmenu-li > a .toggle-icon {
+ line-height: 14px;
+ font-size: 14px;
+ color: #b8bec4;
+ padding: 3px 5px 3px 10px;
+}
+.navigation-bar-container ul.nav.side-nav-menu li.mainmenu-li > a,
+.navigation-bar-container ul.nav.side-nav-footer li.mainmenu-li > a {
+ padding: 10px 5px 10px 20px;
+}
+.navigation-bar-container ul.nav.side-nav-menu li.navigation-footer > a,
+.navigation-bar-container ul.nav.side-nav-footer li.navigation-footer > a {
+ padding: 14px 5px 14px 20px;
+}
+.navigation-bar-container ul.nav.side-nav-menu li.submenu-li > a,
+.navigation-bar-container ul.nav.side-nav-footer li.submenu-li > a {
+ padding: 10px 5px 10px 25px;
+}
+.navigation-bar-container ul.nav.side-nav-menu li.navigation-footer,
+.navigation-bar-container ul.nav.side-nav-footer li.navigation-footer {
+ background: #313d54;
+ height: 48px;
+}
+.navigation-bar-container ul.nav.side-nav-menu li.navigation-footer a .navigation-icon,
+.navigation-bar-container ul.nav.side-nav-footer li.navigation-footer a .navigation-icon {
+ color: #3fae2a;
+ font-size: 19px;
+ position: relative;
+ padding: 0 15px;
+ left: calc(30%);
+}
+.navigation-bar-container ul.nav.side-nav-menu li.navigation-footer a .navigation-icon:hover,
+.navigation-bar-container ul.nav.side-nav-footer li.navigation-footer a .navigation-icon:hover {
+ color: #fff;
+}
+.navigation-bar-container ul.nav.side-nav-menu li > ul > li,
+.navigation-bar-container ul.nav.side-nav-footer li > ul > li {
+ background-color: #323544;
+}
+.navigation-bar-container ul.nav.side-nav-menu li > ul > li a,
+.navigation-bar-container ul.nav.side-nav-footer li > ul > li a {
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ color: #333;
+ font-size: 14px;
+ color: #999;
+}
+.navigation-bar-container ul.nav.side-nav-menu li > ul > li a .submenu-icon,
+.navigation-bar-container ul.nav.side-nav-footer li > ul > li a .submenu-icon {
+ line-height: 14px;
+ font-size: 14px;
+}
+.navigation-bar-container ul.nav.side-nav-menu li > ul > li > a:hover,
+.navigation-bar-container ul.nav.side-nav-footer li > ul > li > a:hover,
+.navigation-bar-container ul.nav.side-nav-menu li > a:hover,
+.navigation-bar-container ul.nav.side-nav-footer li > a:hover {
+ background: #404351;
+ cursor: pointer;
+ color: #fff;
+}
+.navigation-bar-container ul.nav.side-nav-menu li > ul > li > a:hover .navigation-menu-item,
+.navigation-bar-container ul.nav.side-nav-footer li > ul > li > a:hover .navigation-menu-item,
+.navigation-bar-container ul.nav.side-nav-menu li > a:hover .navigation-menu-item,
+.navigation-bar-container ul.nav.side-nav-footer li > a:hover .navigation-menu-item,
+.navigation-bar-container ul.nav.side-nav-menu li > ul > li > a:hover .navigation-icon,
+.navigation-bar-container ul.nav.side-nav-footer li > ul > li > a:hover .navigation-icon,
+.navigation-bar-container ul.nav.side-nav-menu li > a:hover .navigation-icon,
+.navigation-bar-container ul.nav.side-nav-footer li > a:hover .navigation-icon,
+.navigation-bar-container ul.nav.side-nav-menu li > ul > li > a:hover .toggle-icon,
+.navigation-bar-container ul.nav.side-nav-footer li > ul > li > a:hover .toggle-icon,
+.navigation-bar-container ul.nav.side-nav-menu li > a:hover .toggle-icon,
+.navigation-bar-container ul.nav.side-nav-footer li > a:hover .toggle-icon,
+.navigation-bar-container ul.nav.side-nav-menu li > ul > li > a:hover .submenu-item,
+.navigation-bar-container ul.nav.side-nav-footer li > ul > li > a:hover .submenu-item,
+.navigation-bar-container ul.nav.side-nav-menu li > a:hover .submenu-item,
+.navigation-bar-container ul.nav.side-nav-footer li > a:hover .submenu-item {
+ color: #fff;
+}
+.navigation-bar-container ul.nav.side-nav-menu li.active:not(.has-sub-menu),
+.navigation-bar-container ul.nav.side-nav-footer li.active:not(.has-sub-menu),
+.navigation-bar-container ul.nav.side-nav-menu li.active.collapsed,
+.navigation-bar-container ul.nav.side-nav-footer li.active.collapsed {
+ background: #404351;
+ cursor: pointer;
+}
+.navigation-bar-container ul.nav.side-nav-menu li.active:not(.has-sub-menu) > a,
+.navigation-bar-container ul.nav.side-nav-footer li.active:not(.has-sub-menu) > a,
+.navigation-bar-container ul.nav.side-nav-menu li.active.collapsed > a,
+.navigation-bar-container ul.nav.side-nav-footer li.active.collapsed > a {
+ color: #fff;
+}
+.navigation-bar-container ul.nav.side-nav-menu li.active:not(.has-sub-menu) > a .navigation-menu-item,
+.navigation-bar-container ul.nav.side-nav-footer li.active:not(.has-sub-menu) > a .navigation-menu-item,
+.navigation-bar-container ul.nav.side-nav-menu li.active.collapsed > a .navigation-menu-item,
+.navigation-bar-container ul.nav.side-nav-footer li.active.collapsed > a .navigation-menu-item,
+.navigation-bar-container ul.nav.side-nav-menu li.active:not(.has-sub-menu) > a .submenu-item,
+.navigation-bar-container ul.nav.side-nav-footer li.active:not(.has-sub-menu) > a .submenu-item,
+.navigation-bar-container ul.nav.side-nav-menu li.active.collapsed > a .submenu-item,
+.navigation-bar-container ul.nav.side-nav-footer li.active.collapsed > a .submenu-item,
+.navigation-bar-container ul.nav.side-nav-menu li.active:not(.has-sub-menu) > a .navigation-icon,
+.navigation-bar-container ul.nav.side-nav-footer li.active:not(.has-sub-menu) > a .navigation-icon,
+.navigation-bar-container ul.nav.side-nav-menu li.active.collapsed > a .navigation-icon,
+.navigation-bar-container ul.nav.side-nav-footer li.active.collapsed > a .navigation-icon,
+.navigation-bar-container ul.nav.side-nav-menu li.active:not(.has-sub-menu) > a .toggle-icon,
+.navigation-bar-container ul.nav.side-nav-footer li.active:not(.has-sub-menu) > a .toggle-icon,
+.navigation-bar-container ul.nav.side-nav-menu li.active.collapsed > a .toggle-icon,
+.navigation-bar-container ul.nav.side-nav-footer li.active.collapsed > a .toggle-icon {
+ color: #fff;
+}
+.navigation-bar-container ul.nav.side-nav-menu li.active:not(.has-sub-menu) > a:after,
+.navigation-bar-container ul.nav.side-nav-footer li.active:not(.has-sub-menu) > a:after,
+.navigation-bar-container ul.nav.side-nav-menu li.active.collapsed > a:after,
+.navigation-bar-container ul.nav.side-nav-footer li.active.collapsed > a:after {
+ left: 0;
+ top: 50%;
+ border: solid transparent;
+ border-width: 10px 7px;
+ content: " ";
+ height: 0;
+ width: 0;
+ position: absolute;
+ pointer-events: none;
+ border-color: transparent;
+ border-left-color: #3fae2a;
+ margin-top: -12px;
+}
+.navigation-bar-container ul.nav.side-nav-menu .more-actions,
+.navigation-bar-container ul.nav.side-nav-footer .more-actions {
+ display: block;
+ position: absolute;
+ top: 14px;
+ right: 33px;
+ line-height: 25px;
+ width: 20px;
+ text-align: center;
+ font-size: 14px;
+ cursor: pointer;
+ vertical-align: middle;
+ color: #fff;
+}
+.navigation-bar-container ul.nav.side-nav-menu .more-actions .dropdown-menu > li > a,
+.navigation-bar-container ul.nav.side-nav-footer .more-actions .dropdown-menu > li > a {
+ color: #666;
+}
+.navigation-bar-container ul.nav.side-nav-menu .more-actions .dropdown-menu > li > a i,
+.navigation-bar-container ul.nav.side-nav-footer .more-actions .dropdown-menu > li > a i {
+ color: #666;
+}
+.navigation-bar-container ul.nav.side-nav-menu .more-actions .dropdown-menu > li > a:hover,
+.navigation-bar-container ul.nav.side-nav-footer .more-actions .dropdown-menu > li > a:hover {
+ background: #f5f5f5;
+}
+.navigation-bar-container ul.nav.side-nav-menu .menu-item-name,
+.navigation-bar-container ul.nav.side-nav-footer .menu-item-name {
+ display: inline-block;
+ vertical-align: bottom;
+ max-width: 100px;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ -o-text-overflow: ellipsis;
+ -ms-text-overflow: ellipsis;
+ white-space: nowrap;
+}
+.navigation-bar-container .nav-pills > li.active > a,
+.navigation-bar-container .nav-pills > li.active > a:focus,
+.navigation-bar-container .nav-pills > li.active > a:hover,
+.navigation-bar-container .nav > li > a:focus,
+.navigation-bar-container .nav > li > a:hover {
+ background-color: inherit;
+}
+.navigation-bar-container.collapsed {
+ width: 50px;
+}
+.navigation-bar-container.collapsed ul.nav.side-nav-header {
+ width: 50px;
+}
+.navigation-bar-container.collapsed ul.nav.side-nav-header li.navigation-header {
+ padding: 15px 0 15px 15px;
+}
+.navigation-bar-container.collapsed ul.nav.side-nav-header li.navigation-header span.ambari-header,
+.navigation-bar-container.collapsed ul.nav.side-nav-header li.navigation-header span.toggle-icon,
+.navigation-bar-container.collapsed ul.nav.side-nav-header li.navigation-header .dropdown-menu {
+ display: none;
+}
+.navigation-bar-container.collapsed ul.nav.side-nav-menu,
+.navigation-bar-container.collapsed ul.nav.side-nav-footer {
+ width: 50px;
+}
+.navigation-bar-container.collapsed ul.nav.side-nav-menu li a,
+.navigation-bar-container.collapsed ul.nav.side-nav-footer li a {
+ padding: 15px 0 15px 15px;
+ width: 50px;
+}
+.navigation-bar-container.collapsed ul.nav.side-nav-menu li a .navigation-menu-item,
+.navigation-bar-container.collapsed ul.nav.side-nav-footer li a .navigation-menu-item,
+.navigation-bar-container.collapsed ul.nav.side-nav-menu li a .toggle-icon,
+.navigation-bar-container.collapsed ul.nav.side-nav-footer li a .toggle-icon {
+ display: none;
+}
+.navigation-bar-container.collapsed ul.nav.side-nav-menu li a .navigation-icon,
+.navigation-bar-container.collapsed ul.nav.side-nav-footer li a .navigation-icon {
+ font-size: 19px;
+}
+.navigation-bar-container.collapsed ul.nav.side-nav-menu li.navigation-footer a .navigation-icon,
+.navigation-bar-container.collapsed ul.nav.side-nav-footer li.navigation-footer a .navigation-icon {
+ padding: 0 5px;
+ left: 0;
+}
+.navigation-bar-container.collapsed ul.nav.side-nav-menu li ul.sub-menu,
+.navigation-bar-container.collapsed ul.nav.side-nav-footer li ul.sub-menu {
+ display: none;
+ width: 230px;
+ position: absolute;
+ z-index: 100;
+ top: 0;
+ left: 50px;
+}
+.navigation-bar-container.collapsed ul.nav.side-nav-menu li.submenu-li > a,
+.navigation-bar-container.collapsed ul.nav.side-nav-footer li.submenu-li > a {
+ padding: 10px 5px 10px 25px;
+ width: 230px;
+}
+.navigation-bar-container.collapsed ul.nav.side-nav-menu li.active,
+.navigation-bar-container.collapsed ul.nav.side-nav-footer li.active {
+ background: #404351;
+ cursor: pointer;
+}
+.navigation-bar-container.collapsed ul.nav.side-nav-menu li.active > a,
+.navigation-bar-container.collapsed ul.nav.side-nav-footer li.active > a {
+ color: #fff;
+}
+.navigation-bar-container.collapsed ul.nav.side-nav-menu li.active > a .navigation-menu-item,
+.navigation-bar-container.collapsed ul.nav.side-nav-footer li.active > a .navigation-menu-item,
+.navigation-bar-container.collapsed ul.nav.side-nav-menu li.active > a .submenu-item,
+.navigation-bar-container.collapsed ul.nav.side-nav-footer li.active > a .submenu-item,
+.navigation-bar-container.collapsed ul.nav.side-nav-menu li.active > a .navigation-icon,
+.navigation-bar-container.collapsed ul.nav.side-nav-footer li.active > a .navigation-icon,
+.navigation-bar-container.collapsed ul.nav.side-nav-menu li.active > a .toggle-icon,
+.navigation-bar-container.collapsed ul.nav.side-nav-footer li.active > a .toggle-icon {
+ color: #fff;
+}
+.navigation-bar-container.collapsed ul.nav.side-nav-menu li.active > a:after,
+.navigation-bar-container.collapsed ul.nav.side-nav-footer li.active > a:after {
+ left: 0;
+ top: 50%;
+ border: solid transparent;
+ border-width: 12px 6px;
+ content: " ";
+ height: 0;
+ width: 0;
+ position: absolute;
+ pointer-events: none;
+ border-color: transparent;
+ border-left-color: #3fae2a;
+ margin-top: -12px;
+}
+.navigation-bar-container.collapsed ul.nav.side-nav-menu .more-actions,
+.navigation-bar-container.collapsed ul.nav.side-nav-footer .more-actions {
+ display: none;
+}
+.navigation-bar-fit-height {
+ position: fixed;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ z-index: 2079;
+}
+.navigation-bar-fit-height .side-nav-header {
+ position: absolute;
+ top: 0;
+}
+.navigation-bar-fit-height .side-nav-menu {
+ position: absolute;
+ top: 55px;
+ bottom: 50px;
+}
+.navigation-bar-fit-height .side-nav-footer {
+ position: absolute;
+ bottom: 0;
+}
+.navigation-bar-fit-height .more-actions .dropdown-menu {
+ position: fixed;
+ top: auto;
+ left: auto;
+}
+.navigation-bar-fit-height .navigation-bar-container {
+ height: 100%;
+}
+.navigation-bar-fit-height .navigation-bar-container .side-nav-menu {
+ overflow-y: auto;
+}
+.notifications-group {
+ position: relative;
+ top: 1px;
+}
+.notifications-dropdown,
+#notifications-dropdown.dropdown-menu {
+ min-width: 400px;
+ max-width: 400px;
+ min-height: 150px;
+ padding: 0px;
+ z-index: 1000;
+ right: -50px;
+ left: auto;
+ top: 260%;
+ border: none;
+ -webkit-box-shadow: 0px 2px 10px 2px rgba(0, 0, 0, 0.29);
+ -moz-box-shadow: 0px 2px 10px 2px rgba(0, 0, 0, 0.29);
+ box-shadow: 0px 2px 10px 2px rgba(0, 0, 0, 0.29);
+}
+.notifications-dropdown .popup-arrow-up,
+#notifications-dropdown.dropdown-menu .popup-arrow-up {
+ position: absolute;
+ right: 37px;
+ top: -40px;
+ width: 40px;
+ height: 40px;
+ overflow: hidden;
+}
+.notifications-dropdown .popup-arrow-up:after,
+#notifications-dropdown.dropdown-menu .popup-arrow-up:after {
+ content: "";
+ position: absolute;
+ width: 20px;
+ height: 20px;
+ background: #fff;
+ transform: rotate(45deg);
+ top: 30px;
+ left: 10px;
+ box-shadow: -1px -1px 10px -2px rgba(0, 0, 0, 0.5);
+}
+.notifications-dropdown .notifications-header,
+#notifications-dropdown.dropdown-menu .notifications-header {
+ border-bottom: 1px solid #eee;
+ padding: 15px 20px;
+}
+.notifications-dropdown .notifications-header .notifications-title,
+#notifications-dropdown.dropdown-menu .notifications-header .notifications-title {
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ color: #333;
+ font-size: 16px;
+}
+.notifications-dropdown .notifications-body,
+#notifications-dropdown.dropdown-menu .notifications-body {
+ padding: 0px 15px;
+ overflow: auto;
+ max-height: 500px;
+}
+.notifications-dropdown .notifications-body .no-alert-text,
+#notifications-dropdown.dropdown-menu .notifications-body .no-alert-text {
+ padding: 15px 5px;
+}
+.notifications-dropdown .notifications-body .table-controls,
+#notifications-dropdown.dropdown-menu .notifications-body .table-controls {
+ padding: 10px 0px;
+ margin: 0px;
+ border-bottom: 1px solid #eee;
+}
+.notifications-dropdown .notifications-body .table-controls .state-filter,
+#notifications-dropdown.dropdown-menu .notifications-body .table-controls .state-filter {
+ padding: 0px;
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ color: #333;
+ font-size: 12px;
+ color: #666;
+ position: relative;
+}
+.notifications-dropdown .notifications-body .table-controls .state-filter .form-control.filter-select,
+#notifications-dropdown.dropdown-menu .notifications-body .table-controls .state-filter .form-control.filter-select {
+ font-size: 12px;
+ color: #666;
+ height: 25px;
+}
+.notifications-dropdown .notifications-body .table.alerts-table,
+#notifications-dropdown.dropdown-menu .notifications-body .table.alerts-table {
+ margin-top: 0px;
+}
+.notifications-dropdown .notifications-body .table.alerts-table tbody tr,
+#notifications-dropdown.dropdown-menu .notifications-body .table.alerts-table tbody tr {
+ cursor: pointer;
+}
+.notifications-dropdown .notifications-body .table.alerts-table tbody tr.no-alert-tr:hover,
+#notifications-dropdown.dropdown-menu .notifications-body .table.alerts-table tbody tr.no-alert-tr:hover {
+ cursor: default;
+ border-color: transparent;
+ border-bottom-color: #eee;
+}
+.notifications-dropdown .notifications-body .table.alerts-table tbody tr.no-alert-tr:hover > td,
+#notifications-dropdown.dropdown-menu .notifications-body .table.alerts-table tbody tr.no-alert-tr:hover > td {
+ border-color: transparent;
+ background-color: white;
+}
+.notifications-dropdown .notifications-body .table.alerts-table tbody td.status,
+#notifications-dropdown.dropdown-menu .notifications-body .table.alerts-table tbody td.status {
+ width: 9%;
+ padding: 15px 3px;
+}
+.notifications-dropdown .notifications-body .table.alerts-table tbody td.status .alert-state-CRITICAL,
+#notifications-dropdown.dropdown-menu .notifications-body .table.alerts-table tbody td.status .alert-state-CRITICAL {
+ color: #EF6162;
+}
+.notifications-dropdown .notifications-body .table.alerts-table tbody td.status .alert-state-WARNING,
+#notifications-dropdown.dropdown-menu .notifications-body .table.alerts-table tbody td.status .alert-state-WARNING {
+ color: #E98A40;
+}
+.notifications-dropdown .notifications-body .table.alerts-table tbody td.content,
+#notifications-dropdown.dropdown-menu .notifications-body .table.alerts-table tbody td.content {
+ width: 90%;
+ padding: 15px 3px 10px 3px;
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ color: #333;
+ line-height: 1.3;
+}
+.notifications-dropdown .notifications-body .table.alerts-table tbody td.content .name,
+#notifications-dropdown.dropdown-menu .notifications-body .table.alerts-table tbody td.content .name {
+ font-weight: bold;
+ font-size: 14px;
+ color: #333;
+ margin-bottom: 5px;
+}
+.notifications-dropdown .notifications-body .table.alerts-table tbody td.content .description,
+#notifications-dropdown.dropdown-menu .notifications-body .table.alerts-table tbody td.content .description {
+ font-size: 12px;
+ color: #666;
+ margin-bottom: 4px;
+ display: block;
+ display: -webkit-box;
+ -webkit-line-clamp: 3;
+ max-height: 47px;
+ /* For firefox */
+ -webkit-box-orient: vertical;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ /* Break long urls*/
+ overflow-wrap: break-word;
+ word-wrap: break-word;
+ -ms-word-break: break-all;
+ word-break: break-all;
+ word-break: break-word;
+ /* Adds a hyphen where the word breaks*/
+ -ms-hyphens: auto;
+ -moz-hyphens: auto;
+ -webkit-hyphens: auto;
+ hyphens: auto;
+}
+.notifications-dropdown .notifications-body .table.alerts-table tbody td.content .timestamp,
+#notifications-dropdown.dropdown-menu .notifications-body .table.alerts-table tbody td.content .timestamp {
+ text-align: right;
+ font-size: 11px;
+ color: #999;
+}
+.notifications-dropdown .notifications-footer,
+#notifications-dropdown.dropdown-menu .notifications-footer {
+ border-top: 1px solid #eee;
+ padding: 15px;
+}
+.modal-backdrop {
+ background-color: #808080;
+}
+.modal .modal-content {
+ border-radius: 2px;
+}
+.modal .modal-content .modal-header,
+.modal .modal-content .modal-body,
+.modal .modal-content .modal-footer {
+ padding-left: 20px;
+ padding-right: 20px;
+}
+.modal .modal-content .modal-header {
+ border-bottom: none;
+ padding-top: 20px;
+ color: #666;
+ font-size: 20px;
+}
+.modal .modal-content .modal-header h4 {
+ margin: 0;
+ color: inherit;
+ font-size: inherit;
+}
+.modal .modal-content .modal-body {
+ color: #666;
+ font-size: 12px;
+}
+.modal .modal-content .modal-footer {
+ border-top: none;
+ padding-bottom: 20px;
+}
+.modal .modal-content .modal-footer .btn ~ .btn {
+ margin-left: 10px;
+}
+.accordion .panel-group,
+.wizard .wizard-body .wizard-content .accordion .panel-group {
+ margin-bottom: 0;
+}
+.accordion .panel-group .panel,
+.wizard .wizard-body .wizard-content .accordion .panel-group .panel {
+ border-radius: 0;
+ border: none;
+ margin-top: 0;
+ padding: 0 10px;
+}
+.accordion .panel-group .panel .panel-heading,
+.wizard .wizard-body .wizard-content .accordion .panel-group .panel .panel-heading {
+ height: 50px;
+ padding: 15px 10px;
+ border: 1px solid;
+ border-color: #ddd transparent;
+ border-top: none;
+ background: #fff;
+}
+.accordion .panel-group .panel .panel-heading .panel-title,
+.wizard .wizard-body .wizard-content .accordion .panel-group .panel .panel-heading .panel-title {
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ color: #333;
+}
+.accordion .panel-group .panel .panel-heading .panel-title > a,
+.wizard .wizard-body .wizard-content .accordion .panel-group .panel .panel-heading .panel-title > a {
+ font-size: 18px;
+ color: #333;
+}
+.accordion .panel-group .panel .panel-heading .panel-title > i,
+.wizard .wizard-body .wizard-content .accordion .panel-group .panel .panel-heading .panel-title > i {
+ font-size: 20px;
+ color: #1491c1;
+}
+.accordion .panel-group .panel .panel-heading:hover,
+.wizard .wizard-body .wizard-content .accordion .panel-group .panel .panel-heading:hover {
+ background: #f3faff;
+ cursor: pointer;
+}
+.accordion .panel-group .panel .panel-body,
+.wizard .wizard-body .wizard-content .accordion .panel-group .panel .panel-body {
+ padding: 15px 10px 20px 20px;
+}
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+.h1,
+.h2,
+.h3,
+.h4,
+.h5,
+.h6 {
+ font-family: 'Roboto', sans-serif;
+}
+h1,
+.h1 {
+ font-size: 24px;
+}
+h2,
+.h2 {
+ font-size: 18px;
+}
+body,
+.body {
+ font-family: 'Roboto', sans-serif;
+ font-weight: normal;
+ font-style: normal;
+ line-height: 1;
+ color: #333;
+ font-size: 14px;
+}
+.description {
+ font-family: 'Roboto', sans-serif;
+ font-size: 12px;
+ color: #000;
+}
+a,
+a:visited,
+a:focus {
+ color: #1491C1;
+ text-decoration: none;
+}
+a:hover,
+a:visited:hover,
+a:focus:hover {
+ text-decoration: underline;
+}
+a:active,
+a:visited:active,
+a:focus:active {
+ text-decoration: none;
+}
+a[disabled],
+a:visited[disabled],
+a:focus[disabled],
+a.disabled,
+a:visited.disabled,
+a:focus.disabled {
+ cursor: not-allowed;
+ color: #666;
+ text-decoration: none;
+}
+a[disabled]:hover,
+a:visited[disabled]:hover,
+a:focus[disabled]:hover,
+a.disabled:hover,
+a:visited.disabled:hover,
+a:focus.disabled:hover {
+ text-decoration: none;
+}
http://git-wip-us.apache.org/repos/asf/ambari/blob/b8f7369b/ambari-admin/src/main/resources/ui/admin-web/app/styles/top-nav.css
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/styles/top-nav.css b/ambari-admin/src/main/resources/ui/admin-web/app/styles/top-nav.css
new file mode 100644
index 0000000..f93b2e6
--- /dev/null
+++ b/ambari-admin/src/main/resources/ui/admin-web/app/styles/top-nav.css
@@ -0,0 +1,197 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+#top-nav .navbar.navbar-static-top {
+ background: #fff;
+ border-top: 1px solid #e3e3e3;
+ border-bottom: 1px solid #e3e3e3;
+ margin-bottom: 10px;
+ min-height: 55px;
+}
+
+#top-nav .breadcrumb li {
+ padding: 15px 0;
+}
+
+#top-nav .navbar-text {
+ padding: 2px 0;
+}
+
+#top-nav .navbar-right {
+ font-size: 16px;
+}
+
+
+/** Override bootstrap styles **/
+@media (min-width: 0) {
+ .navbar-nav {
+ float: left;
+ margin: 0;
+ }
+ .navbar-nav > li {
+ float: left;
+ }
+ .navbar-nav > li > a {
+ padding-top: 15px;
+ padding-bottom: 15px;
+ }
+ .navbar-left {
+ float: left !important;
+ }
+ .navbar-right {
+ float: right !important;
+ margin-right: -15px;
+ }
+ .navbar-right ~ .navbar-right {
+ margin-right: 0;
+ }
+ .navbar-right .dropdown-menu {
+ right: 0;
+ left: auto;
+ }
+ .navbar-right .dropdown-menu-left {
+ right: auto;
+ left: 0;
+ }
+ .navbar {
+ border-radius: 4px;
+ }
+ .navbar-header {
+ float: left;
+ }
+ .container > .navbar-header,
+ .container-fluid > .navbar-header,
+ .container > .navbar-collapse,
+ .container-fluid > .navbar-collapse {
+ margin-right: 0;
+ margin-left: 0;
+ }
+ .navbar-static-top {
+ border-radius: 0;
+ }
+ .navbar-fixed-top,
+ .navbar-fixed-bottom {
+ border-radius: 0;
+ }
+ .navbar > .container .navbar-brand,
+ .navbar > .container-fluid .navbar-brand {
+ margin-left: -15px;
+ }
+ .navbar-toggle {
+ display: none;
+ }
+ .navbar-text {
+ float: left;
+ margin-right: 15px;
+ margin-left: 15px;
+ }
+ .navbar-header {
+ float: left;
+ }
+ .navbar-collapse {
+ width: auto;
+ border-top: 0;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ }
+ .navbar-collapse.collapse {
+ display: block !important;
+ height: auto !important;
+ padding-bottom: 0;
+ overflow: visible !important;
+ }
+ .navbar-collapse.in {
+ overflow-y: visible;
+ }
+ .navbar-fixed-top .navbar-collapse,
+ .navbar-static-top .navbar-collapse,
+ .navbar-fixed-bottom .navbar-collapse {
+ padding-right: 0;
+ padding-left: 0;
+ }
+ .navbar {
+ border-radius: 4px;
+ }
+ .navbar-form .form-group {
+ display: inline-block;
+ margin-bottom: 0;
+ vertical-align: middle;
+ }
+ .navbar-form .form-control {
+ display: inline-block;
+ width: auto;
+ vertical-align: middle;
+ }
+ .navbar-form .form-control-static {
+ display: inline-block;
+ }
+ .navbar-form .input-group {
+ display: inline-table;
+ vertical-align: middle;
+ }
+ .navbar-form .input-group .input-group-addon,
+ .navbar-form .input-group .input-group-btn,
+ .navbar-form .input-group .form-control {
+ width: auto;
+ }
+ .navbar-form .input-group > .form-control {
+ width: 100%;
+ }
+ .navbar-form .control-label {
+ margin-bottom: 0;
+ vertical-align: middle;
+ }
+ .navbar-form .radio,
+ .navbar-form .checkbox {
+ display: inline-block;
+ margin-top: 0;
+ margin-bottom: 0;
+ vertical-align: middle;
+ }
+ .navbar-form .radio label,
+ .navbar-form .checkbox label {
+ padding-left: 0;
+ }
+ .navbar-form .radio input[type="radio"],
+ .navbar-form .checkbox input[type="checkbox"] {
+ position: relative;
+ margin-left: 0;
+ }
+ .navbar-form .has-feedback .form-control-feedback {
+ top: 0;
+ }
+ .navbar-form {
+ width: auto;
+ padding-top: 0;
+ padding-bottom: 0;
+ margin-right: 0;
+ margin-left: 0;
+ border: 0;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ }
+}
+
+@media (max-width: 767px) {
+ .navbar-nav .open .dropdown-menu {
+ position: absolute;
+ }
+}
+
+
http://git-wip-us.apache.org/repos/asf/ambari/blob/b8f7369b/ambari-admin/src/main/resources/ui/admin-web/app/views/groups/list.html
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/views/groups/list.html b/ambari-admin/src/main/resources/ui/admin-web/app/views/groups/list.html
index 8457065..5271ceb 100644
--- a/ambari-admin/src/main/resources/ui/admin-web/app/views/groups/list.html
+++ b/ambari-admin/src/main/resources/ui/admin-web/app/views/groups/list.html
@@ -21,7 +21,9 @@
<li class="active">{{'common.groups' | translate}}</li>
</ol>
<div class="pull-right top-margin-4">
- <link-to route="groups.create" class="btn btn-primary creategroup-btn"><span class="glyphicon glyphicon-plus"></span> {{'groups.createLocal' | translate}}</link-to>
+ <link-to route="groups.create" class="btn btn-default creategroup-btn">
+ {{'groups.createLocal' | translate}}
+ </link-to>
</div>
</div>
<hr>
http://git-wip-us.apache.org/repos/asf/ambari/blob/b8f7369b/ambari-admin/src/main/resources/ui/admin-web/app/views/leftNavbar.html
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/views/leftNavbar.html b/ambari-admin/src/main/resources/ui/admin-web/app/views/leftNavbar.html
deleted file mode 100644
index a7fc18a..0000000
--- a/ambari-admin/src/main/resources/ui/admin-web/app/views/leftNavbar.html
+++ /dev/null
@@ -1,126 +0,0 @@
-<!--
-* Licensed to the Apache Software Foundation (ASF) under one
-* or more contributor license agreements. See the NOTICE file
-* distributed with this work for additional information
-* regarding copyright ownership. The ASF licenses this file
-* to you under the Apache License, Version 2.0 (the
-* "License"); you may not use this file except in compliance
-* with the License. You may obtain a copy of the License at
-*
-* http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
--->
-<div class="left-navbar" xmlns="http://www.w3.org/1999/html">
- <div class="panel panel-default">
- <div class="panel-heading"><span class="glyphicon glyphicon-cloud"></span> {{'common.clusters' | translate}}</div>
- <div class="panel-body">
- <div class="cluster-section" ng-show="cluster">
- <div id="cluster-name" ng-switch on="editCluster.editingName">
- <h5 ng-switch-when="false"><div title={{cluster.Clusters.cluster_name}} class="clusterDisplayName">{{clusterDisplayName()}}</div>
- <i ng-show="cluster.Clusters.provisioning_state == 'INSTALLED'"
- ng-click="toggleEditName()"
- class="glyphicon glyphicon-edit pull-right edit-cluster-name renameCluster" tooltip="{{'common.renameCluster' | translate}}">
- </i>
- </h5>
-
- <form ng-keyup="toggleEditName($event)"
- tabindex="1"
- name="editClusterNameForm"
- class="editClusterNameForm"
- ng-switch-when="true"
- ng-submit="editCluster.name !== cluster.Clusters.cluster_name && editClusterNameForm.newClusterName.$valid && confirmClusterNameChange()">
- <div class="form-group"
- ng-class="{'has-error': editClusterNameForm.newClusterName.$invalid && !editClusterNameForm.newClusterName.$pristine }">
- <input
- autofocus
- type="text"
- name="newClusterName"
- ng-required="true"
- ng-pattern="/^\w*$/"
- ng-trim="false"
- ng-model="editCluster.name"
- class="form-control input-sm"
- ng-maxlength="80"
- tooltip="{{'common.renameClusterTip' | translate}}"
- tooltip-trigger="focus">
- <button ng-click="toggleEditName()"
- class="btn btn-xs">
- <i class="glyphicon glyphicon-remove"></i>
- </button>
- <button
- type="submit"
- class="btn btn-primary btn-xs"
- ng-class="{'disabled': editClusterNameForm.newClusterName.$invalid || editCluster.name == cluster.Clusters.cluster_name}">
- <i class="glyphicon glyphicon-ok"></i>
- </button>
- </div>
- </form>
-
- </div>
-
- <ul class="nav nav-pills nav-stacked" ng-show="cluster.Clusters.provisioning_state == 'INSTALLED' ">
- <li ng-class="{active: isActive('clusters.manageAccess') || isActive('clusters.userAccessList')}">
- <a href="#/clusters/{{cluster.Clusters.cluster_name}}/manageAccess" class="permissions">{{'common.roles' | translate}}</a>
- </li>
- <li><a href="{{fromSiteRoot('/#/dashboard')}}" class="gotodashboard">{{'common.goToDashboard' | translate}}</a></li>
- <li ng-class="{active: isActive('clusters.exportBlueprint')}">
- <a href="#/clusters/{{cluster.Clusters.cluster_name}}/exportBlueprint" class="exportblueprint">{{'common.exportBlueprint' | translate}}</a>
- </li>
- </ul>
- <span class="cluster-installation-progress-label" ng-show="cluster.Clusters.provisioning_state == 'INIT'"><a href="{{fromSiteRoot('/#/')}}">{{'common.clusterCreationInProgress' | translate}}</a></span>
- </div>
-
-
- <div ng-hide="cluster">
- <ul class="nav nav-pills nav-stacked">
- <li><p class="noclusters">{{'common.noClusters' | translate}}</p></li>
- </ul>
- </div>
- <ul class="nav nav-pills nav-stacked" >
- <li ng-class="{active: isActive('stackVersions.list')}" ng-show="cluster && totalRepos > 0">
- <a href="#/stackVersions">{{'common.versions' | translate}}</a>
- </li>
- <li ng-class="{active: isActive('remoteClusters.list')}">
- <a href="#/remoteClusters">{{'common.remoteClusters' | translate}}</a>
- </li>
- </ul>
- </div>
- </div>
-
- <div class="panel panel-default">
- <div class="panel-heading"><span class="glyphicon glyphicon-th"></span> {{'common.views' | translate}}</div>
- <div class="panel-body">
- <ul class="nav nav-pills nav-stacked">
- <li ng-class="{active: isActive('views.list')}"><link-to route="views.list" class="viewslist-link">{{'common.views' | translate}}</link-to></li>
- <li ng-class="{active: isActive('views.listViewUrls') || isActive('views.createViewUrl') || isActive('views.editViewUrl') }"><link-to route="views.listViewUrls" class="viewslistviewurls-link">{{'common.viewUrls' | translate}}</link-to></li>
- </ul>
- </div>
- </div>
-
-
- <div class="panel panel-default">
- <div class="panel-heading"><span class="glyphicon glyphicon-user"></span> {{'common.userGroupManagement' | translate}}</div>
- <div class="panel-body">
- <ul class="nav nav-pills nav-stacked">
- <li ng-class="{active: isActive('users.list')}"><link-to route="users.list" class="userslist-link">{{'common.users' | translate}}</link-to></li>
- <li ng-class="{active: isActive('groups.list')}"><link-to route="groups.list" class="groupslist-link">{{'common.groups' | translate}}</link-to></li>
- </ul>
- </div>
- </div>
-
- <div class="panel panel-default" ng-show="settings.isLoginActivitiesSupported || settings.isLDAPConfigurationSupported">
- <div class="panel-heading"><span class="glyphicon glyphicon-cog"></span> {{'common.settings' | translate}}</div>
- <div class="panel-body">
- <ul class="nav nav-pills nav-stacked">
- <li ng-class="{active: isActive('authentication.main')}" ng-show="settings.isLDAPConfigurationSupported"><link-to route="authentication.main">{{'common.authentication' | translate}}</link-to></li>
- <li ng-class="{active: isActive('loginActivities.loginMessage')}" ng-show="settings.isLoginActivitiesSupported"><link-to route="loginActivities.loginMessage">{{'common.loginActivities.loginActivities' | translate}}</link-to></li>
- </ul>
- </div>
- </div>
-</div>
-
http://git-wip-us.apache.org/repos/asf/ambari/blob/b8f7369b/ambari-admin/src/main/resources/ui/admin-web/app/views/main.html
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/views/main.html b/ambari-admin/src/main/resources/ui/admin-web/app/views/main.html
index 3bdb80e..3c382af 100644
--- a/ambari-admin/src/main/resources/ui/admin-web/app/views/main.html
+++ b/ambari-admin/src/main/resources/ui/admin-web/app/views/main.html
@@ -19,7 +19,7 @@
<div class="panel-body">
<h1>{{'main.title' | translate}}</h1>
- <div ng-if="isLoaded" id="main-operations-boxes" class="row thumbnails">
+ <div id="main-operations-boxes" class="row thumbnails">
<p ng-hide="cluster">{{'main.noClusterDescription' | translate}}</p>
<p ng-show="cluster">{{'main.hasClusterDescription' | translate}}</p>
@@ -32,24 +32,29 @@
<div class="glyphicon glyphicon-cloud"></div>
<div class="buttons">
<span ng-class="{active: isActive('clusters.manageAccess')}">
- <a ng-show="cluster.Clusters.provisioning_state != 'INSTALLED'" href class="btn btn-primary permission-button"
- ng-disabled="cluster.Clusters.provisioning_state != 'INSTALLED' ">{{'main.operateCluster.manageRoles' |
- translate}}</a>
+ <a ng-show="cluster.Clusters.provisioning_state != 'INSTALLED'" href
+ class="btn btn-primary permission-button"
+ ng-disabled="cluster.Clusters.provisioning_state != 'INSTALLED' ">
+ {{'main.operateCluster.manageRoles' | translate}}
+ </a>
<a ng-show="cluster.Clusters.provisioning_state == 'INSTALLED'"
- href="#/clusters/{{cluster.Clusters.cluster_name}}/userAccessList"
- class="btn btn-primary permission-button"
- ng-disabled="cluster.Clusters.provisioning_state != 'INSTALLED' ">{{'main.operateCluster.manageRoles' |
- translate}}</a>
+ href="#/clusters/{{cluster.Clusters.cluster_name}}/userAccessList"
+ class="btn btn-primary permission-button"
+ ng-disabled="cluster.Clusters.provisioning_state != 'INSTALLED' ">
+ {{'main.operateCluster.manageRoles' | translate}}
+ </a>
</span>
<span>
<a ng-show="cluster.Clusters.provisioning_state != 'INSTALLED'" href
- class="btn btn-primary go-dashboard-button"
- ng-disabled="cluster.Clusters.provisioning_state != 'INSTALLED' ">{{'common.goToDashboard' |
- translate}}</a>
+ class="btn btn-primary go-dashboard-button"
+ ng-disabled="cluster.Clusters.provisioning_state != 'INSTALLED' ">
+ {{'common.goToDashboard' | translate}}
+ </a>
<a ng-show="cluster.Clusters.provisioning_state == 'INSTALLED'"
- href="{{fromSiteRoot('/#/main/dashboard/metrics')}}" class="btn btn-primary go-dashboard-button"
- ng-disabled="cluster.Clusters.provisioning_state != 'INSTALLED' ">{{'common.goToDashboard' |
- translate}}</a>
+ href="{{fromSiteRoot('/#/main/dashboard/metrics')}}" class="btn btn-primary go-dashboard-button"
+ ng-disabled="cluster.Clusters.provisioning_state != 'INSTALLED' ">
+ {{'common.goToDashboard' | translate}}
+ </a>
</span>
</div>
</div>
@@ -58,9 +63,11 @@
<div class="description">{{'main.createCluster.description' | translate}}</div>
<div class="glyphicon glyphicon-cloud"></div>
- <div class="buttons"><a href="{{fromSiteRoot('/#/installer/step0')}}"
- class="btn btn-primary create-cluster-button">{{'main.createCluster.launchInstallWizard'
- | translate}}</a></div>
+ <div class="buttons">
+ <a href="{{fromSiteRoot('/#/installer/step0')}}" class="btn btn-primary create-cluster-button">
+ {{'main.createCluster.launchInstallWizard' | translate}}
+ </a>
+ </div>
</div>
<!--Manage Users and groups-->
@@ -70,14 +77,16 @@
<div class="description">{{'main.manageUsersAndGroups.description' | translate}}</div>
<div class="glyphicon glyphicon-user"></div>
<div class="buttons">
- <span ng-class="{active: isActive('users.list')}"><link-to route="users.list"
- class="btn btn-primary userslist-button">
+ <span ng-class="{active: isActive('users.list')}">
+ <link-to route="users.list" class="btn btn-primary userslist-button">
{{'common.users' | translate}}
- </link-to></span>
- <span ng-class="{active: isActive('groups.list')}"><link-to route="groups.list"
- class="btn btn-primary groupslist-button">
+ </link-to>
+ </span>
+ <span ng-class="{active: isActive('groups.list')}">
+ <link-to route="groups.list" class="btn btn-primary groupslist-button">
{{'common.groups' | translate}}
- </link-to></span>
+ </link-to>
+ </span>
</div>
</div>
@@ -88,7 +97,9 @@
<div class="description">{{'main.deployViews.description' | translate}}</div>
<div class="glyphicon glyphicon-th"></div>
<div ng-class="{active: isActive('views.list')}" class="buttons">
- <link-to route="views.list" class="btn btn-primary viewslist-button">{{'common.views' | translate}}</link-to>
+ <link-to route="views.list" class="btn btn-primary viewslist-button">
+ {{'common.views' | translate}}
+ </link-to>
</div>
</div>
</div>
http://git-wip-us.apache.org/repos/asf/ambari/blob/b8f7369b/ambari-admin/src/main/resources/ui/admin-web/app/views/remoteClusters/list.html
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/views/remoteClusters/list.html b/ambari-admin/src/main/resources/ui/admin-web/app/views/remoteClusters/list.html
index 3bbf09d..e3e11d5 100644
--- a/ambari-admin/src/main/resources/ui/admin-web/app/views/remoteClusters/list.html
+++ b/ambari-admin/src/main/resources/ui/admin-web/app/views/remoteClusters/list.html
@@ -22,8 +22,7 @@
<li class="active">{{'common.remoteClusters' | translate}}</li>
</ol>
<div class="pull-right top-margin-4">
- <a href="#/remoteClusters/create" class="btn btn-primary">
- <span class="glyphicon glyphicon-plus"></span>
+ <a href="#/remoteClusters/create" class="btn btn-default">
{{'views.registerRemoteCluster' | translate}}
</a>
</div>
http://git-wip-us.apache.org/repos/asf/ambari/blob/b8f7369b/ambari-admin/src/main/resources/ui/admin-web/app/views/sideNav.html
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/views/sideNav.html b/ambari-admin/src/main/resources/ui/admin-web/app/views/sideNav.html
new file mode 100644
index 0000000..09b4cd9
--- /dev/null
+++ b/ambari-admin/src/main/resources/ui/admin-web/app/views/sideNav.html
@@ -0,0 +1,106 @@
+<!--
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements. See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership. The ASF licenses this file
+* to you under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance
+* with the License. You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+-->
+
+<div id="side-nav" class="navigation-bar navigation-bar-fit-height">
+ <div class="navigation-bar-container">
+ <ul class="side-nav-header nav nav-pills nav-stacked">
+ <li class="navigation-header active">
+ <a href="{{fromSiteRoot('/#/main/dashboard')}}" class="ambari-logo">
+ <img src="/img/ambari-logo.png" alt="{{'common.apacheAmbari' | translate}}" title="{{'common.apacheAmbari' | translate}}" data-qa="ambari-logo">
+ </a>
+ <div class="btn-group">
+ <a href="{{fromSiteRoot('/#/main/dashboard')}}" class="ambari-header-link" title="{{'common.apacheAmbari' | translate}}" data-qa="ambari-title">
+ <span class="ambari-header">
+ {{'common.ambari' | translate}}
+ </span>
+ </a>
+ </div>
+ </li>
+ </ul>
+ <ul class="nav side-nav-menu nav-pills nav-stacked">
+ <li class="mainmenu-li active">
+ <a title="{{'common.dashboard' | translate}}" rel="tooltip" data-placement="right" href="{{fromSiteRoot('/#/dashboard')}}" class="gotodashboard">
+ <i class="navigation-icon fa fa-tachometer" aria-hidden="true"></i>
+ <span class="navigation-menu-item">{{'common.dashboard' | translate}}</span>
+ </a>
+ </li>
+ <li class="mainmenu-li dropdown has-sub-menu" ng-show="cluster.Clusters.provisioning_state === 'INSTALLED' ">
+ <a title="{{'common.clusterManagement' | translate}}" data-toggle="collapse-sub-menu" rel="tooltip" data-placement="right">
+ <span class="toggle-icon glyphicon glyphicon-menu-down pull-right"></span>
+ <i class="navigation-icon fa fa-cloud" aria-hidden="true"></i>
+ <span class="navigation-menu-item">{{'common.clusterManagement' | translate}}</span>
+ </a>
+ <ul class="sub-menu nav nav-pills nav-stacked">
+ <li class="submenu-li" ng-class="{active: isActive('stackVersions.list')}" ng-show="cluster && totalRepos > 0">
+ <a href="#/stackVersions">{{'common.clusterInformation' | translate}}</a>
+ </li>
+ <li class="submenu-li" ng-class="{active: isActive('remoteClusters.list')}">
+ <a href="#/remoteClusters">{{'common.remoteClusters' | translate}}</a>
+ </li>
+ </ul>
+ </li>
+ <li class="mainmenu-li dropdown has-sub-menu" ng-show="cluster.Clusters.provisioning_state === 'INSTALLED' ">
+ <a title="{{'common.userManagement' | translate}}" rel="tooltip" data-placement="right" data-toggle="collapse-sub-menu">
+ <span class="toggle-icon glyphicon glyphicon-menu-down pull-right"></span>
+ <i class="navigation-icon fa fa-users" aria-hidden="true"></i>
+ <span class="navigation-menu-item">{{'common.userManagement' | translate}}</span>
+ </a>
+ <ul class="sub-menu nav nav-pills nav-stacked">
+ <li class="submenu-li" ng-class="{active: isActive('clusters.manageAccess') || isActive('clusters.userAccessList')}">
+ <a href="#/clusters/{{cluster.Clusters.cluster_name}}/manageAccess" class="roles">Roles</a>
+ </li>
+ <li class="submenu-li" ng-class="{active: isActive('users.list')}">
+ <link-to route="users.list" class="userslist-link">{{'common.users' | translate}}</link-to>
+ </li>
+ <li class="submenu-li" ng-class="{active: isActive('groups.list')}">
+ <link-to route="groups.list" class="groupslist-link">{{'common.groups' | translate}}</link-to>
+ </li>
+ </ul>
+ </li>
+ <li class="mainmenu-li" ng-class="{active: isActive('views.list')}">
+ <link-to route="views.list" class="viewslist-link" title="{{'common.views' | translate}}" rel="tooltip" data-placement="right">
+ <i class="navigation-icon fa fa-th" aria-hidden="true"></i>
+ <span class="navigation-menu-item">{{'common.views' | translate}}</span>
+ </link-to>
+ </li>
+ <li class="mainmenu-li dropdown has-sub-menu" ng-show="settings.isLoginActivitiesSupported || settings.isLDAPConfigurationSupported">
+ <a title="{{'common.settings' | translate}}" data-toggle="collapse-sub-menu" rel="tooltip" data-placement="right">
+ <span class="toggle-icon glyphicon glyphicon-menu-down pull-right"></span>
+ <i class="navigation-icon glyphicon glyphicon-cog" aria-hidden="true"></i>
+ <span class="navigation-menu-item">{{'common.settings' | translate}}</span>
+ </a>
+ <ul class="sub-menu nav nav-pills nav-stacked">
+ <li class="submenu-li" ng-class="{active: isActive('authentication.main')}" ng-show="settings.isLDAPConfigurationSupported">
+ <link-to route="authentication.main">{{'common.authentication' | translate}}</link-to>
+ </li>
+ <li class="submenu-li" ng-class="{active: isActive('loginActivities.loginMessage')}" ng-show="settings.isLoginActivitiesSupported">
+ <link-to route="loginActivities.loginMessage">{{'common.loginActivities.loginActivities' | translate}}</link-to>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ <ul class="side-nav-footer nav nav-pills nav-stacked">
+ <li class="navigation-footer">
+ <a href="#" data-toggle="collapse-side-nav">
+ <span class="navigation-icon fa fa-angle-double-left" aria-hidden="true"></span>
+ </a>
+ </li>
+ </ul>
+ </div>
+</div>
+
http://git-wip-us.apache.org/repos/asf/ambari/blob/b8f7369b/ambari-admin/src/main/resources/ui/admin-web/app/views/stackVersions/list.html
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/views/stackVersions/list.html b/ambari-admin/src/main/resources/ui/admin-web/app/views/stackVersions/list.html
index 3e788f8..f6b6ee9 100644
--- a/ambari-admin/src/main/resources/ui/admin-web/app/views/stackVersions/list.html
+++ b/ambari-admin/src/main/resources/ui/admin-web/app/views/stackVersions/list.html
@@ -22,9 +22,8 @@
<li class="active">{{'common.versions' | translate}}</li>
</ol>
<div class="pull-right top-margin-4">
- <a href="#/stackVersions/create" class="btn btn-primary">
- <span class="glyphicon glyphicon-plus"></span>
- {{'versions.register.title' | translate}}
+ <a href="#/stackVersions/create" class="btn btn-default">
+ {{'versions.add.title' | translate}}
</a>
</div>
</div>
http://git-wip-us.apache.org/repos/asf/ambari/blob/b8f7369b/ambari-admin/src/main/resources/ui/admin-web/app/views/users/list.html
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/views/users/list.html b/ambari-admin/src/main/resources/ui/admin-web/app/views/users/list.html
index 09024a5..7b8e12a 100644
--- a/ambari-admin/src/main/resources/ui/admin-web/app/views/users/list.html
+++ b/ambari-admin/src/main/resources/ui/admin-web/app/views/users/list.html
@@ -22,7 +22,9 @@
<li class="active">{{'common.users' | translate}}</li>
</ol>
<div class="pull-right top-margin-4">
- <link-to route="users.create" class="btn btn-primary createuser-btn"><span class="glyphicon glyphicon-plus"></span> {{'users.create' | translate}}</link-to>
+ <link-to route="users.create" class="btn btn-default createuser-btn">
+ </span> {{'users.create' | translate}}
+ </link-to>
</div>
</div>
<hr>
http://git-wip-us.apache.org/repos/asf/ambari/blob/b8f7369b/ambari-admin/src/main/resources/ui/admin-web/bower.json
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/bower.json b/ambari-admin/src/main/resources/ui/admin-web/bower.json
index dbdf005..c38f464 100644
--- a/ambari-admin/src/main/resources/ui/admin-web/bower.json
+++ b/ambari-admin/src/main/resources/ui/admin-web/bower.json
@@ -2,7 +2,7 @@
"name": "adminconsole",
"private": true,
"dependencies": {
- "bootstrap": "3.1.1",
+ "bootstrap": "3.3.7",
"angular": "1.2.26",
"angular-route": "1.2.26",
"angular-bootstrap": "0.11.0",
http://git-wip-us.apache.org/repos/asf/ambari/blob/b8f7369b/ambari-admin/src/main/resources/ui/admin-web/gulpfile.js
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/gulpfile.js b/ambari-admin/src/main/resources/ui/admin-web/gulpfile.js
index 2f47b85..9b377d1 100644
--- a/ambari-admin/src/main/resources/ui/admin-web/gulpfile.js
+++ b/ambari-admin/src/main/resources/ui/admin-web/gulpfile.js
@@ -24,10 +24,10 @@ var gulp = require('gulp');
var $ = require('gulp-load-plugins')();
gulp.task('styles', function () {
- return gulp.src('app/styles/*.css')
+ return gulp.src('app/styles/**/*.css')
.pipe($.order([
- 'app/styles/main.css',
- 'app/styles/custom-admin-ui.css' // This should always be the last stylesheet. So it can be dropped and be effective on build time
+ 'app/styles/theme/bootstrap-ambari.css',
+ 'app/styles/main.css'
], { base: './' }))
.pipe($.concat('main.css'))
.pipe($.autoprefixer('last 1 version'))
@@ -64,8 +64,8 @@ gulp.task('images', function () {
});
gulp.task('fonts', function () {
- return $.bowerFiles()
- .pipe($.filter('**/*.{eot,svg,ttf,woff}'))
+ return gulp.src('app/bower_components/**/fonts/*.{eot,svg,ttf,woff}')
+ .pipe($.addSrc('app/assets/fonts/*'))
.pipe($.flatten())
.pipe(gulp.dest('dist/fonts'))
.pipe($.size());
http://git-wip-us.apache.org/repos/asf/ambari/blob/b8f7369b/ambari-admin/src/main/resources/ui/admin-web/package.json
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/package.json b/ambari-admin/src/main/resources/ui/admin-web/package.json
index efcd9d4..b7c514c 100644
--- a/ambari-admin/src/main/resources/ui/admin-web/package.json
+++ b/ambari-admin/src/main/resources/ui/admin-web/package.json
@@ -5,19 +5,19 @@
"devDependencies": {
"bower": "1.3.8",
"gulp": "^3.8.8",
+ "gulp-add-src": "^0.2.0",
"gulp-autoprefixer": "0.0.7",
- "gulp-bower-files": "0.2.1",
"gulp-cache": "0.1.1",
"gulp-clean": "0.2.4",
+ "gulp-concat": "2.6.0",
"gulp-filter": "0.4.1",
"gulp-flatten": "0.0.2",
"gulp-load-plugins": "0.5.0",
+ "gulp-order": "1.1.1",
"gulp-plumber": "0.6.6",
"gulp-size": "0.3.0",
"gulp-uglify": "0.2.1",
"gulp-useref": "0.4.2",
- "gulp-concat": "2.6.0",
- "gulp-order": "1.1.1",
"http-server": "0.6.1",
"karma": "0.12.16",
"karma-chrome-launcher": "0.1.4",
http://git-wip-us.apache.org/repos/asf/ambari/blob/b8f7369b/ambari-admin/src/main/resources/ui/admin-web/test/unit/controllers/AppCtrl_test.js
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/test/unit/controllers/AppCtrl_test.js b/ambari-admin/src/main/resources/ui/admin-web/test/unit/controllers/AppCtrl_test.js
new file mode 100644
index 0000000..1bbe47a
--- /dev/null
+++ b/ambari-admin/src/main/resources/ui/admin-web/test/unit/controllers/AppCtrl_test.js
@@ -0,0 +1,211 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+describe('#AppCtrl', function () {
+
+ var scope, ctrl, $httpBackend, $window, clusterService, deferred;
+
+ beforeEach(function () {
+ module('ambariAdminConsole', function ($provide) {
+ $provide.value('$route', {
+ current: null
+ });
+ $provide.value('$window', {
+ location: {
+ pathname: 'http://c6401.ambari.apache.org:8080/views/ADMIN_VIEW/2.0.0/INSTANCE/#/'
+ },
+ localStorage: {
+ getItem: function () {
+ return null;
+ },
+ setItem: angular.noop
+ }
+ });
+ localStorage.ambari = JSON.stringify({
+ app: {
+ authenticated: true,
+ loginName: 'admin',
+ user: 'user'
+ }
+ });
+ });
+ inject(function (_$httpBackend_, $rootScope, $controller, _$window_, _Cluster_, _$q_) {
+ clusterService = _Cluster_;
+ deferred = _$q_.defer();
+ spyOn(clusterService, 'getStatus').andReturn(deferred.promise);
+ deferred.resolve({
+ Clusters: {
+ provisioning_state: 'INIT'
+ }
+ });
+ $window = _$window_;
+ $httpBackend = _$httpBackend_;
+ $httpBackend.whenGET(/api\/v1\/services\/AMBARI\/components\/AMBARI_SERVER.+/).respond(200, {
+ RootServiceComponents: {
+ component_version: 2.2,
+ properties: {
+ 'user.inactivity.timeout.default': 20
+ }
+ }
+ });
+ $httpBackend.whenGET(/\/api\/v1\/views.+/).respond(200, {
+ "href": "http://c6401.ambari.apache.org:8080/api/v1/views?fields=versions/instances/ViewInstanceInfo&versions/ViewVersionInfo/system=false&versions/instances/ViewInstanceInfo/visible=true",
+ "items": [
+ {
+ "ViewInfo": {
+ "view_name": "SLIDER"
+ },
+ "href": "http://c6401.ambari.apache.org:8080/api/v1/views/SLIDER",
+ "versions": [
+ {
+ "ViewVersionInfo": {
+ "system": false,
+ "version": "1.0.0",
+ "view_name": "SLIDER"
+ },
+ "href": "http://c6401.ambari.apache.org:8080/api/v1/views/SLIDER/versions/1.0.0",
+ "instances": [
+ {
+ "ViewInstanceInfo": {
+ "context_path": "/views/SLIDER/1.0.0/VisibleInstance",
+ "description": "VisibleInstance",
+ "icon64_path": null,
+ "icon_path": null,
+ "instance_data": {},
+ "instance_name": "VisibleInstance",
+ "label": "VisibleInstance",
+ "properties": {
+ "ambari.server.password": "123",
+ "ambari.server.url": "123",
+ "ambari.server.username": "123",
+ "slider.user": null,
+ "view.kerberos.principal": null,
+ "view.kerberos.principal.keytab": null
+ },
+ "static": false,
+ "version": "1.0.0",
+ "view_name": "SLIDER",
+ "visible": true
+ },
+ "href": "http://c6401.ambari.apache.org:8080/api/v1/views/SLIDER/versions/1.0.0/instances/VisibleInstance"
+ }
+ ]
+ }
+ ]
+ }
+ ]
+ });
+ $httpBackend.whenGET(/\/persist\/user-pref-.*/).respond(200, {
+ data: {
+ data: {
+ addingNewRepository: true
+ }
+ }
+ });
+ scope = $rootScope.$new();
+ scope.$apply();
+ ctrl = $controller('AppCtrl', {
+ $scope: scope
+ });
+ });
+ });
+
+ afterEach(function() {
+ $httpBackend.verifyNoOutstandingExpectation();
+ $httpBackend.verifyNoOutstandingRequest();
+ });
+
+ describe('signout', function () {
+
+ beforeEach(function () {
+ $httpBackend.whenGET(/\/api\/v1\/logout\?_=\d+/).respond(200,{
+ message: "successfully logged out"
+ });
+ $httpBackend.whenGET(/\/api\/v1\/users\/admin\/authorizations.*/).respond(200, {
+ items: [
+ {
+ AuthorizationInfo: {
+ authorization_id: "AMBARI.RENAME_CLUSTER"
+ }
+ }
+ ]
+ });
+ });
+
+ it('should reset window.location and ambari localstorage', function () {
+ scope.signOut();
+
+ runs(function() {
+ chai.expect($window.location.pathname).to.equal('/');
+ });
+
+ var data = JSON.parse(localStorage.ambari);
+ chai.expect(data.app.authenticated).to.equal(undefined);
+ chai.expect(data.app.loginName).to.equal(undefined);
+ chai.expect(data.app.user).to.equal(undefined);
+ $httpBackend.flush();
+ });
+ });
+
+ describe('roles loading', function () {
+
+ var mock = {
+ callback: angular.noop
+ },
+ cases = [
+ {
+ canPersistData: true,
+ items: [
+ {
+ AuthorizationInfo: {
+ authorization_id: 'CLUSTER.MANAGE_USER_PERSISTED_DATA'
+ }
+ }
+ ],
+ title: 'user can persist data'
+ },
+ {
+ canPersistData: false,
+ items: [],
+ title: 'user can\'t persist data'
+ }
+ ];
+
+ angular.forEach(cases, function (item) {
+
+ describe(item.title, function () {
+
+ beforeEach(function () {
+ $httpBackend.whenGET(/\/api\/v1\/users\/admin\/authorizations.*/).respond(200, {
+ items: item.items
+ });
+ spyOn(mock, 'callback');
+ scope.authDataLoad.promise.then(mock.callback);
+ $httpBackend.flush();
+ });
+
+ it('authDataLoad should be resolved with the correct argument', function () {
+ expect(mock.callback).toHaveBeenCalledWith(item.canPersistData);
+ });
+
+ });
+
+ });
+
+ });
+});