http://git-wip-us.apache.org/repos/asf/ambari/blob/2a77e39c/ambari-web/app/styles/modal_popups.less ---------------------------------------------------------------------- diff --git a/ambari-web/app/styles/modal_popups.less b/ambari-web/app/styles/modal_popups.less index 04e7dd4..49fda07 100644 --- a/ambari-web/app/styles/modal_popups.less +++ b/ambari-web/app/styles/modal_popups.less @@ -17,13 +17,34 @@ */ @import 'common.less'; + +.modal { + top: 5%; + .modal-body { + .top-wrap { + &.top-wrap-header { + border-bottom: 1px solid #eee; + margin-bottom: 20px; + } + } + } +} +.modal-body { + max-height: 600px; + overflow-y: auto; +} + +.modal-header h4 { + margin: 0; +} + /*90% width modal window start*/ -.full-width-modal { +.wizard-modal-wrapper { .modal { .modal-body { - div.error{ + div.error { color: #b94a48; - .help-inline{ + .help-block { color: #b94a48; } } @@ -34,71 +55,9 @@ -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); } - .add-cluster-1{ - width: 100%; - height : 500px; - margin: 0 auto; - - .each-row{ - margin-top: 10px; - } - - .add-cluster-1-1{ - width: 100%; - height : 100%; - float: left; - } - .add-cluster-1-3{ - width: 45%; - height : 100%; - float: left; - } - .add-cluster-1-2{ - width: 10%; - height : 100%; - float: left; - - .add-cluster-1-2-1{ - width: 100%; - height : 40%; - } - .add-cluster-1-2-2{ - width: 100%; - height : 10%; - } - .add-cluster-1-2-3{ - width: 100%; - height : 50%; - } - .middle-line{ - width : 2%; - margin : 0 auto; - height : 100%; - background-color: #000000; - } - .add-cluster-center-most-div{ - height : 30%; - text-align: center; - position: relative; - top: 30%; - } - } - } - - - } } - .clear { - clear: both; - } - > div > .dataTable { - border: 1px solid silver; - th { - border-top: none; - } - } .content { padding: 0; } @@ -117,41 +76,20 @@ /*700px width modal window start*/ .modal-690px-width { - .modal { - width: 690px; - margin: 0 0 0 -345px; - max-height: 544px; - top: 5%; - } - .modal-body { max-height: 403px; } } /*700px width modal window end*/ -/*60% width modal window start*/ -.sixty-percent-width-modal.hideCloseLink{ - .modal-header{ - .close{ - display:none - } - } -} - .manage-alert-notifications-popup { .modal-body { overflow: visible; } } -.sixty-percent-width-modal-edit-widget { - .modal { - width: 60%; - margin: 0 0 0 -30%; - max-height: 544px; - top: 5%; - } +/*60% width modal window start*/ +.modal-edit-widget { .modal-header{ min-width: 650px; } @@ -171,7 +109,7 @@ max-width: 630px; max-height: 15px; } - #min-height-limit .span9{ + #min-height-limit .col-md-9{ min-height: 15px; } #min-height-limit .progress{ @@ -211,9 +149,9 @@ #slider-value4{ max-width: 65px; } - .slider-error{ + .slider-error { color: #b94a48; - .help-inline{ + .help-block { color: #b94a48; } } @@ -225,45 +163,19 @@ } } } -.sixty-percent-width-modal { - - .modal { - width: 60%; - margin: 0 0 0 -30%; - max-height: 563px; - min-width: 590px; - top: 5%; - } - &.modal-full-width { - .modal { - width: 90%; - margin: 0 0 0 -45%; - max-height: 90%; - } - } +.common-modal-wrapper { - .long-popup-list { - height: 280px; - overflow: auto; - width: 100%; - } .modal-footer { #footer-checkbox { text-align: left; padding-top: 3px; margin-left: 22px; - float: left; - .checkbox { - margin: 0; - } } } .modal-body { - max-height: 403px; - li.disabled { a { cursor: not-allowed; @@ -272,168 +184,6 @@ .form-horizontal{ - - .add-cluster-1{ - width: 100%; - height : auto; - min-height : 350px; - margin: 0 auto; - - .each-row{ - margin-top: 10px; - } - - .add-cluster-1-1{ - width: 100%; - height : 100%; - float: left; - div.error{ - color: #b94a48; - .help-inline{ - color: #b94a48; - } - } - - div.error input{ - border-color: #b94a48; - -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - } - } - .add-cluster-1-3{ - width: 45%; - height : 100%; - float: right; - } - .add-cluster-1-2{ - width: 10%; - height : 100%; - float: left; - - .add-cluster-1-2-1{ - width: 100%; - height : 40%; - } - .add-cluster-1-2-2{ - width: 100%; - height : 10%; - } - .add-cluster-1-2-3{ - width: 100%; - height : 50%; - } - .middle-line{ - width : 2%; - margin : 0 auto; - height : 100%; - background-color: #000000; - } - .add-cluster-center-most-div{ - height : 30%; - text-align: center; - position: relative; - top: 30%; - } - } - } - - .add-cluster-2{ - margin : 0 auto; - height : auto; - min-height : 350px; - table{ - width : 60%; - margin : 0 20%; - - .spacer{ - height: 20px; - } - - tr.error{ - color: #b94a48; - .help-inline{ - color: #b94a48; - } - - input{ - border-color: #b94a48; - -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - } - } - - td { - width : 50%; - a.btn-success{ - margin-left: 30%; - } - } - - } - - } - - - .add-data-set{ - width: 80%; - margin: 0 auto; - table{ - width: 100%; - } - tr.error{ - color: #b94a48; - .help-inline{ - color: #b94a48; - } - } - - div.error{ - color: #b94a48; - .help-inline{ - color: #b94a48; - } - } - - div.error input{ - border-color: #b94a48; - -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - } - - td.percent25 { - width: 25%; - } - td.spacer{ - height: 10px; - } - td{ - .btn-group{ - display : inline; - span.caret{ - float : right; - } - ul.dropdown-menu{ - margin-top:15px; - } - } - .ember-view{ - display : inline; - } - - } - - input.hyper-mini{ - width: 20px; - } - - .targetClusterDD{ - min-width : 170px; - } - - } .each-row{ margin-top: 10px; } @@ -442,7 +192,7 @@ clear:both; } .override-controls{ - .icon-ok-sign { + .glyphicon-ok-sign { color: #5AB400; } #filter-dropdown-div { @@ -459,7 +209,7 @@ left: auto; } } - .input-append{ + .input-group{ input{ -webkit-border-radius: 4px 0 0 4px; -moz-border-radius: 4px 0 0 4px; @@ -480,7 +230,6 @@ height: 225px; max-height: 225px; overflow: auto; - border: 1px solid #eee; } table{ th { @@ -492,24 +241,12 @@ color: #777; } } - .control-label{ + .control-label:not(class=["col-md*"]) { width:auto; } - .overrideSelectBox { - width:100%; - } } } - .clear { - clear: both; - } - > div > .dataTable { - border: 1px solid silver; - th { - border-top: none; - } - } .content { padding: 0; } @@ -534,7 +271,6 @@ @modal-padding: 40px; .modal { - max-height: 90%; &.no-footer { .modal-body { @@ -562,17 +298,6 @@ } } -.modal { - .modal-body { - .top-wrap { - &.top-wrap-header { - border-bottom: 1px solid #eee; - margin-bottom: 20px; - } - } - } -} - .host-progress-popup { .task-detail-info { @@ -625,10 +350,19 @@ #infinite-scroll-append { text-align: center; - .icon-spinner { + .glyphicon glyphicon-spinner { font-size: 24px; } } } } } + +.modal-xlg { + width: 1280px; + .wizard { + .container { + width: 1236px; + } + } +}
http://git-wip-us.apache.org/repos/asf/ambari/blob/2a77e39c/ambari-web/app/styles/stack_versions.less ---------------------------------------------------------------------- diff --git a/ambari-web/app/styles/stack_versions.less b/ambari-web/app/styles/stack_versions.less index b902653..3eebe82 100644 --- a/ambari-web/app/styles/stack_versions.less +++ b/ambari-web/app/styles/stack_versions.less @@ -18,13 +18,13 @@ @import 'common.less'; #advancedRepoAccordion{ - .accordion-heading { + .panel-heading { background-color: #f0f0f0; a:hover { text-decoration: none; } } - .accordion-body { + .panel-body { .repositories-table { overflow: auto; margin-bottom: 10px; @@ -82,12 +82,12 @@ text-decoration: none; &.disabled-clear-button { cursor: default; - .icon-remove-sign { + .glyphicon-remove-sign { cursor: default; } } } - .icon-remove-sign { + .glyphicon-remove-sign { color: #808080; } } @@ -126,16 +126,16 @@ } .version-box-popup { .modal{ - max-height: 563px; - max-width: 340px; - margin: -250px 0 0 -180px; + .modal-dialog{ + width: 340px; + } .modal-body { - padding: 0px 0px; + padding: 0; } } .version-box-in-popup.version-box { - padding: 0px 0px; - margin: 0px 0px; + padding: 0; + margin: 0; border: none; .hosts-section { padding-bottom: 16px; @@ -148,15 +148,15 @@ .versions-slides { overflow-x: auto; padding-bottom: 25px; - margin-left: 0; - margin-top: 5px; + padding-left: 0; + margin-top: 10px; .versions-slides-bar { display: inline-flex; } } .left-menu-table { padding: 10px 0; - margin-top: 124px; + margin-top: 122px; td.service-display-name { border-top: 2px solid #e4e4e4; border-bottom: 2px solid #e4e4e4; @@ -263,6 +263,7 @@ font-weight: 500; } .hosts-section .host-link { + margin: 0; font-size: 12px; } } @@ -304,8 +305,7 @@ } } .state.installing { - padding-bottom: 5px; - margin: 10px 0px; + margin: 5px 0 15px 0; } .services-section { width: 100%; @@ -343,84 +343,24 @@ } } } - - - } -} - -#stack-upgrade-dialog { - .details-box { - padding: 5px; - margin-left: 15px; - margin-right: 95px; - .button-row { - text-align: right; - padding: 5px; - } - input[type="checkbox"] { - margin: 0; - } - .message { - line-height: 30px; - } - } - .task-details { - .manage-controls a { - cursor: pointer; - margin-right: 12px; - } - textarea { - width: 100%; - min-height: 100px; - box-sizing: border-box; - } - } - .task-list { - overflow-x: hidden; - .progress { - margin-bottom: 0; - } - padding-left: 20px; - i { - margin-right: 5px; - } - } - .task-list-main-warp i { - font-size: 16px; } - ul.failed-info-list { - max-height: 500px; - margin-top: 5px; - } - .upgrade-options-link { - position: absolute; - cursor: pointer; - right: 10%; - top: 13px; - width: 100px; - a { - font-size: 13px; - } - .icon-cogs { - color: #0088cc; - margin-right: 3px; - } - } - .upgrade-options-link.disabled { - cursor: not-allowed; - a, .icon-cogs { - color: #808080; - } - a:hover { - text-decoration: none; - } + .nav.nav-tabs { + margin-bottom: 20px; } } +#stack-upgrade-dialog, #stack-upgrade-record-dialog { + .row { + margin: 0; + padding: 5px 0; + } + .upgrade-item-text, + .upgrade-group-text { + padding-left: 0; + } .details-box { padding: 5px; - margin-left: 15px; margin-right: 95px; .button-row { text-align: right; @@ -449,7 +389,7 @@ .progress { margin-bottom: 0; } - padding-left: 20px; + padding-left: 15px; i { margin-right: 5px; } @@ -470,14 +410,14 @@ a { font-size: 13px; } - .icon-cogs { + .glyphicon-cogs { color: #0088cc; margin-right: 3px; } } .upgrade-options-link.disabled { cursor: not-allowed; - a, .icon-cogs { + a, .glyphicon-cogs { color: #808080; } a:hover { @@ -502,10 +442,8 @@ #upgrade-options-popup-content { .method-options { margin: 10px; - .method-option { - width: 43.5%; - } - .thumbnail { + + .img-thumbnail { cursor: pointer; border: none; @@ -549,16 +487,16 @@ background-color: #cbe3c2; } - .thumbnail.not-allowed:hover { + .img-thumbnail.not-allowed:hover { background-color: #e4e4e4; } - .thumbnail.not-allowed { + .img-thumbnail.not-allowed { cursor: not-allowed; } } .method-options.disabled { - .thumbnail { + .img-thumbnail { cursor: not-allowed; .method-name,.method-icon,.method-description { color: #a9a9a9; @@ -599,19 +537,19 @@ } } .method-precheck-message.GREEN { - .icon-ok { + .glyphicon-ok { color: @health-status-green; font-size: 16px; } } .method-precheck-message.RED { - .icon-remove { + .glyphicon-remove { color: #cf2a27; font-size: 16px; } } .method-precheck-message.ORANGE { - .icon-warning-sign { + .glyphicon-warning-sign { color: @health-status-orange; font-size: 16px; } @@ -625,7 +563,7 @@ .text { margin-left: 10px; } - .icon-question-sign { + .glyphicon-question-sign { color: @blue; } } @@ -706,7 +644,7 @@ cursor: pointer; text-decoration: none; } - .icon-remove-sign { + .glyphicon-remove-sign { color: #808080; } } @@ -742,21 +680,27 @@ #skip-validation, #use-redhat { - .icon-question-sign { + .glyphicon-question-sign { color: @blue; } } +.upgrade-wizard-modal { + .modal-body { + position: static; + } +} + #upgrade-failed-hosts { .host-list-container { overflow-y: auto; max-height: 320px; margin-right: -15px; - .accordion { + .panel { margin-bottom: 0; - .accordion-group { + .panel-group { border: none; - .accordion-toggle { + .panel-toggle { line-height: 20px; padding: 5px 0; .label { @@ -766,10 +710,4 @@ } } } - .sub-header { - padding: 0 15px; - width: 530px; - margin-left: -15px; - border-bottom: 1px solid #eee; - } } http://git-wip-us.apache.org/repos/asf/ambari/blob/2a77e39c/ambari-web/app/styles/theme/bootstrap-ambari.css ---------------------------------------------------------------------- diff --git a/ambari-web/app/styles/theme/bootstrap-ambari.css b/ambari-web/app/styles/theme/bootstrap-ambari.css new file mode 100644 index 0000000..dc57b22 --- /dev/null +++ b/ambari-web/app/styles/theme/bootstrap-ambari.css @@ -0,0 +1,541 @@ +/** + * 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-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 { + box-shadow: inset 0px 0px 3px 0px #1391c1; +} +.btn-group.open .btn.dropdown-toggle, +.btn-group.open .btn.dropdown-toggle.btn-default { + background-color: #FFF; + color: #666; + border: 1px solid #cfd3d7; +} +.btn-group.open .btn.dropdown-toggle:hover, +.btn-group.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, +.btn-group.open .btn.dropdown-toggle.btn-default + .dropdown-menu > li > a:hover { + background-color: #808793; + color: #FFF; +} +.btn-group.open .btn.dropdown-toggle.btn-primary { + background-color: #3FAE2A; + border: 1px solid #3FAE2A; + color: #FFF; +} +.btn-group.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 { + background-color: #429929; + color: #FFF; +} +.btn-group.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 { + margin-bottom: 1px; +} +.btn-group.open .dropdown-menu > li > a { + height: 24px; +} +.btn-group .btn.dropdown-toggle:first-child { + min-width: 80px; +} +.btn-group .btn.dropdown-toggle.disabled, +.btn-group .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 #E98A41; +} +.has-warning input.form-control:focus { + border-color: #E98A41; + box-shadow: none; +} +.has-warning .help-block.validation-block::before { + content: '\e101'; + color: #E98A41; +} +.form-control[disabled], +.form-control[readonly], +fieldset[disabled] .form-control { + color: #dbdee2; + border-color: #b2b8c1; + background-color: #b2b8c1; +} +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"] { + margin-top: 0; +} +.table tfoot > tr:first-of-type > td { + border-top-width: 2px; +} +.table tfoot .pagination-block .pagination-block-item { + float: left; + padding: 0 5px; +} +.table.table-hover { + border-collapse: separate; +} +.table.table-hover .action { + visibility: hidden; + padding: 0; + line-height: 1; +} +.table.table-hover .action:hover { + text-decoration: none; +} +.table.table-hover > tbody > tr:first-of-type > td { + border-top-color: transparent; +} +.table.table-hover > tbody > tr:hover > td { + border-top-color: #A7DFF2; +} +.table.table-hover > tbody > tr > td { + border-width: 1px 0 1px; + border-style: solid; + border-color: #DDD transparent transparent; + line-height: 1; +} +.table.table-hover > tbody > tr > td:first-of-type { + border-left-width: 1px; +} +.table.table-hover > tbody > tr > td:last-of-type { + border-right-width: 1px; +} +.table.table-hover > tbody > tr:hover { + background-color: #E7F6FC; +} +.table.table-hover > tbody > tr:hover > td { + background-color: #E7F6FC; + border-color: #A7DFF2 transparent; +} +.table.table-hover > tbody > tr:hover > td:first-of-type { + border-left-color: #A7DFF2; +} +.table.table-hover > tbody > tr:hover > td:last-of-type { + border-right-color: #A7DFF2; +} +.table.table-hover > tbody > tr:hover + tr > td { + border-top-color: transparent; +} +.table.table-hover > tbody > tr:hover > td .action { + visibility: visible; +} +.table.table-hover > tbody > tr.active { + background-color: #EEE; +} +.table.table-hover > tbody > tr.active > td { + background-color: #EEE; + border-color: transparent transparent; +} +.table.table-hover > tbody > tr.active > td:first-of-type { + border-left-color: transparent; +} +.table.table-hover > tbody > tr.active > td:last-of-type { + border-right-color: transparent; +} +.table.table-hover > tbody > tr.active + tr > td { + border-top-color: transparent; +} +.table.table-hover > tbody > tr.active + tr:hover > td { + border-top-color: #A7DFF2; +} +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; +} +.nav.nav-tabs { + border: none; +} +.nav.nav-tabs li a { + border: none; + border-bottom: 2px solid transparent; + color: #666; + text-transform: uppercase; +} +.nav.nav-tabs li a:hover, +.nav.nav-tabs li a:active, +.nav.nav-tabs li a:focus { + color: #333; + border: none; + background: none; +} +.nav.nav-tabs li a .badge.badge-important { + display: inline; +} +.nav.nav-tabs li.active a { + color: #333; + border-bottom: 2px solid #3FAE2A; +} +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/2a77e39c/ambari-web/app/styles/widgets.less ---------------------------------------------------------------------- diff --git a/ambari-web/app/styles/widgets.less b/ambari-web/app/styles/widgets.less index 263736d..9e67a26 100644 --- a/ambari-web/app/styles/widgets.less +++ b/ambari-web/app/styles/widgets.less @@ -58,7 +58,7 @@ &.text-success { color: @green; } - .icon-warning-sign { + .glyphicon-warning-sign { &.warning { color: @health-status-yellow } @@ -80,7 +80,7 @@ .label-current { padding: 2px 3px 3px 5px; } - .icon-lock { + .glyphicon-lock { position: relative; top: 2px; left: 2px; @@ -108,7 +108,7 @@ &.active { color: @widget-config-override-action-active-color; } - &.text-error { + &.text-danger { color: #b94a48; } } @@ -121,9 +121,9 @@ } &.slider-widget { width: 100%; - margin-left: -20px; + // margin-left: -20px; margin-right: 0; - padding-left: 20px; + // padding-left: 20px; } // background hack instead of increasing padding, // because we have lack of space for widget container. @@ -325,12 +325,12 @@ line-height: normal; float: left; - .input-append.input-prepend { + .input-group { margin: 0; } input { - width: 20px; + width: 30px; font-size: 12px; text-align: center; } @@ -414,7 +414,7 @@ } .combo-widget { - .input-append { + .input-group { .btn-group { display: inline-block; margin-left: -1px; @@ -463,15 +463,11 @@ padding: 0; color: @green; &:focus { - border-color: none; + border-color: transparent; box-shadow: 0; outline: 0 none; } } - - .icon-check-empty { - margin-left: -3px; - } } } @@ -490,7 +486,7 @@ } } -.label-current.icon-ok { +.label-current.glyphicon-ok { color: white; } @@ -498,3 +494,7 @@ background-color: rgba(211, 237, 247, 0.39); padding: 10px 5px 0 10px; } + +.input-group-btn { + width: auto; +} http://git-wip-us.apache.org/repos/asf/ambari/blob/2a77e39c/ambari-web/app/templates/application.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/application.hbs b/ambari-web/app/templates/application.hbs index 05c4122..669daa7 100644 --- a/ambari-web/app/templates/application.hbs +++ b/ambari-web/app/templates/application.hbs @@ -16,151 +16,140 @@ * limitations under the License. }} -<div id="main"> - {{#if App.enableDigitalClock}} - {{view App.ClockView}} - {{/if}} +{{#if App.enableDigitalClock}} + {{view App.ClockView}} +{{/if}} <div id="main"> <div id="top-nav"> - <div class="navbar navbar-static-top"> - <div class="navbar-inner"> - <div class="container main-container"> + <nav class="navbar navbar-default navbar-static-top"> + <div class="container main-container"> + <p class="navbar-text brand-wrapper"> {{#if enableLinks}} - <a {{translateAttr href="topnav.logo.href"}} class="logo"><img src="/img/logo-white.png" alt="Apache Ambari" - title="Apache Ambari"></a> - <a class="brand" {{translateAttr href="topnav.logo.href"}} title="Apache Ambari">{{t app.name}}</a> - <a class="brand cluster-name" href="javascript:void(null);" {{bindAttr title="clusterName"}}> + <a {{translateAttr href="topnav.logo.href"}} class="logo"> + <img src="/img/logo-white.png" alt="Apache Ambari" title="Apache Ambari"> + </a> + <a {{translateAttr href="topnav.logo.href"}} title="Apache Ambari">{{t app.name}}</a> + {{! cluster name }} + <a href="#" {{bindAttr title="clusterName"}} {{action "showPopup" target="App.router.backgroundOperationsController"}} class="cluster-name"> {{#unless App.isClusterUser}} - <span {{action "showPopup" target="App.router.backgroundOperationsController"}} >{{clusterDisplayName}} </span> - {{#with App.router.backgroundOperationsController}} - {{#if allOperationsCount}} - <i class="icon-caret-left ops-count"></i><span id="span-bg-operation-count" - class="label operations-count" {{action "showPopup" target="App.router.backgroundOperationsController"}}> - {{allOperationsCount}} {{pluralize allOperationsCount singular="t:op" plural="t:ops"}}</span> - {{else}} - <i class="icon-caret-left"></i><span id="span-bg-operation-count" - class="label" {{action "showPopup" target="App.router.backgroundOperationsController"}}> - {{allOperationsCount}} {{pluralize allOperationsCount singular="t:op" plural="t:ops"}}</span> - {{/if}} - {{/with}} + <span>{{clusterDisplayName}} </span> {{/unless}} + </a> + {{! cluster name end }} + {{! bg label }} + <a href="#" class="bg-label" {{action "showPopup" target="App.router.backgroundOperationsController"}}> + {{#with App.router.backgroundOperationsController}} + <i {{bindAttr class="allOperationsCount:ops-count :icon-caret-left"}}></i><span id="span-bg-operation-count" {{bindAttr class="allOperationsCount:operations-count :label"}}> + {{allOperationsCount}} {{pluralize allOperationsCount singular="t:op" plural="t:ops"}} + </span> + {{/with}} + </a> + {{! bg label end }} + {{! alerts label }} {{#if App.router.clusterController.isAlertsLoaded}} - {{#if App.router.mainAlertDefinitionsController.unhealthyAlertInstancesCount}} - <span {{bindAttr class=":label App.router.mainAlertDefinitionsController.isCriticalAlerts:alert-crit-count:alert-warn-count"}} {{action "showPopup" target="App.router.mainAlertInstancesController"}}> - {{App.router.mainAlertDefinitionsController.unhealthyAlertInstancesCount}} {{pluralize App.router.mainAlertDefinitionsController.unhealthyAlertInstancesCount singular="alert" plural="alerts"}}</span> - {{else}} - <span {{translateAttr title="titlebar.alerts.noAlerts"}} - class="label alerts-none-count" {{action "showPopup" target="App.router.mainAlertInstancesController"}}> - {{App.router.mainAlertDefinitionsController.unhealthyAlertInstancesCount}} {{pluralize App.router.mainAlertDefinitionsController.unhealthyAlertInstancesCount singular="alert" plural="alerts"}}</span> - {{/if}} + <a href="#" class="alerts-label" {{action "showPopup" target="App.router.mainAlertInstancesController"}}> + {{#if App.router.mainAlertDefinitionsController.unhealthyAlertInstancesCount}} + {{! alerts exist }} + <span {{bindAttr class=":label App.router.mainAlertDefinitionsController.isCriticalAlerts:alert-crit-count:alert-warn-count"}}> + {{App.router.mainAlertDefinitionsController.unhealthyAlertInstancesCount}} {{pluralize App.router.mainAlertDefinitionsController.unhealthyAlertInstancesCount singular="alert" plural="alerts"}} + </span> + {{else}} + {{! no alerts }} + <span {{translateAttr title="titlebar.alerts.noAlerts"}} class="label alerts-none-count"> + {{App.router.mainAlertDefinitionsController.unhealthyAlertInstancesCount}} {{pluralize App.router.mainAlertDefinitionsController.unhealthyAlertInstancesCount singular="alert" plural="alerts"}} + </span> + {{/if}} + </a> {{/if}} - </a> + {{! alerts label end }} {{else}} <a class="logo"><img src="/img/logo-white.png" alt="Apache Ambari" title="Apache Ambari"></a> - <a class="brand" title="Apache Ambari">{{t app.name}}</a> + <a title="Apache Ambari">{{t app.name}}</a> {{/if}} + </p> + + {{! user dropdown }} - {{#if App.router.loggedIn}} - <div class="top-nav-user btn-group"> - <button class="btn dropdown-toggle" data-toggle="dropdown"> - <i class="icon-user"></i> {{App.router.displayLoginName}} <span class="caret"></span> + {{#if App.router.loggedIn}} + <ul class="nav navbar-nav navbar-right top-nav-user"> + <li class="dropdown"> + <button class="dropdown-toggle navbar-btn btn btn-default" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> + <i class="glyphicon glyphicon-user"></i> {{App.router.displayLoginName}} <span class="caret"></span> </button> <ul class="dropdown-menu"> - <li><a href="" id="about" {{action showAboutPopup target="controller"}}>{{t app.aboutAmbari}}</a></li> - {{#if App.router.clusterInstallCompleted}} - {{#if isClusterDataLoaded}} - {{#isAuthorized "AMBARI.ADD_DELETE_CLUSTERS, AMBARI.ASSIGN_ROLES, AMBARI.EDIT_STACK_REPOS, AMBARI.MANAGE_GROUPS, AMBARI.MANAGE_STACK_VERSIONS, AMBARI.MANAGE_USERS, AMBARI.MANAGE_VIEWS, AMBARI.RENAME_CLUSTER, AMBARI.MANAGE_USERS"}} - <li><a href="" - id="manage-ambari" {{action goToAdminView target="controller"}}>{{t app.manageAmbari}}</a> - </li> - {{/isAuthorized}} - {{/if}} - {{else}} - {{#if App.isPermissionDataLoaded}} - {{#isAuthorized "AMBARI.ADD_DELETE_CLUSTERS, AMBARI.ASSIGN_ROLES, AMBARI.EDIT_STACK_REPOS, AMBARI.MANAGE_GROUPS, AMBARI.MANAGE_STACK_VERSIONS, AMBARI.MANAGE_USERS, AMBARI.MANAGE_VIEWS, AMBARI.RENAME_CLUSTER, AMBARI.MANAGE_USERS"}} - <li><a href="" - id="manage-ambari" {{action goToAdminView target="controller"}}>{{t app.manageAmbari}}</a> - </li> - {{/isAuthorized}} - {{/if}} + + {{! about }} + <li><a href="#" id="about" {{action showAboutPopup target="controller"}}>{{t app.aboutAmbari}}</a></li> + {{! about end }} + + {{! manage ambari }} + {{#if showManageAmbari}} + {{#isAuthorized "AMBARI.ADD_DELETE_CLUSTERS, AMBARI.ASSIGN_ROLES, AMBARI.EDIT_STACK_REPOS, AMBARI.MANAGE_GROUPS, AMBARI.MANAGE_STACK_VERSIONS, AMBARI.MANAGE_USERS, AMBARI.MANAGE_VIEWS, AMBARI.RENAME_CLUSTER, AMBARI.MANAGE_USERS"}} + <li> + <a href="#" id="manage-ambari" {{action goToAdminView target="controller"}}> + {{t app.manageAmbari}} + </a> + </li> + {{/isAuthorized}} {{/if}} + {{! manage ambari end }} + + {{! user settings }} {{#if isExistingClusterDataLoaded}} {{#isAuthorized "AMBARI.MANAGE_SETTINGS"}} - <li><a href="" {{action showSettingsPopup target="App.router.userSettingsController"}}>{{t app.settings}}</a></li> + <li> + <a href="#" {{action showSettingsPopup target="App.router.userSettingsController"}}> + {{t app.settings}} + </a> + </li> {{/isAuthorized}} {{/if}} + {{! user settings end }} + + {{! sign out }} {{#if showExitLink}} - <li class="break"></li> + <li role="separator" class="divider"></li> <li><a href="" id="sign-out" {{action logoff}}>{{t app.signout}}</a></li> {{/if}} + {{! sign out end }} + </ul> - </div> - {{/if}} + </li> + </ul> + {{/if}} + {{! user dropdown end }} - {{view App.MainMenuView}} + {{view App.MainMenuView}} - </div> </div> - </div> + </nav> </div> + <div class="container main-container"> <div id="content"> {{#if App.wizardIsNotFinished}} - <div class="ru-badge span12"> - <div class="navbar navbar-static-top clearfix"> - <div class="span11"> + <div class="ru-badge col-md-12"> + <div class="clearfix"> + <div class="col-md-11"> {{#if isExistingClusterDataLoaded}} - <p class="span4 offset4"> - {{#if App.router.wizardWatcherController.isNonWizardUser}} - <span class="brand cluster-name"> + <p class="col-md-4 col-md-offset-4"> + {{#if App.router.wizardWatcherController.isNonWizardUser}} <span class="label upgrade-in-progress"> - <i class="icon-cog"></i> {{App.router.wizardWatcherController.wizardDisplayName}} + <i class="glyphicon glyphicon-cog"></i> {{App.router.wizardWatcherController.wizardDisplayName}} </span> - </span> - {{/if}} - {{#isAuthorized "CLUSTER.UPGRADE_DOWNGRADE_STACK"}} - <a class="brand cluster-name" href="#"> - {{else}} - <a class="brand cluster-name"> - {{/isAuthorized}} - {{#if App.upgradeInProgress}} - {{#if App.router.mainAdminStackAndUpgradeController.isDowngrade}} - <span - class="label upgrade-in-progress" {{action "openUpgradeDialog" target="App.router.mainAdminStackAndUpgradeController"}}> - <i class="icon-cog"></i> {{t admin.stackVersions.version.downgrade.running}}</span> - {{else}} - <span - class="label upgrade-in-progress" {{action "openUpgradeDialog" target="App.router.mainAdminStackAndUpgradeController"}}> - <i class="icon-cog"></i> {{t admin.stackVersions.version.upgrade.running}}</span> - {{/if}} - {{/if}} - {{#if App.upgradeHolding}} - {{#if App.router.mainAdminStackAndUpgradeController.isDowngrade}} - <span - class="label upgrade-holding" {{action "openUpgradeDialog" target="App.router.mainAdminStackAndUpgradeController"}}> - <i class="icon-pause"></i> {{t admin.stackVersions.version.downgrade.pause}}</span> - {{else}} - <span - class="label upgrade-holding" {{action "openUpgradeDialog" target="App.router.mainAdminStackAndUpgradeController"}}> - <i class="icon-pause"></i> {{t admin.stackVersions.version.upgrade.pause}}</span> - {{/if}} {{/if}} - {{#if App.upgradeSuspended}} - {{#if App.router.mainAdminStackAndUpgradeController.isDowngrade}} - <span class="label upgrade-holding" {{action "openUpgradeDialog" target="App.router.mainAdminStackAndUpgradeController"}}> - <i class="icon-pause"></i> {{t admin.stackVersions.version.downgrade.suspended}} - </span> - {{else}} - <span class="label upgrade-holding" {{action "openUpgradeDialog" target="App.router.mainAdminStackAndUpgradeController"}}> - <i class="icon-pause"></i> {{t admin.stackVersions.version.upgrade.suspended}} + {{#if showUpgradeLabel}} + <a href="#" {{action "openUpgradeDialog" target="App.router.mainAdminStackAndUpgradeController"}}> + <span {{bindAttr class="upgradeMap.cls :label"}}> + <i {{bindAttr class="upgradeMap.icon :glyphicon"}}></i> + {{upgradeMap.msg}} </span> - {{/if}} + </a> {{/if}} - </a> </p> {{#if App.router.mainAdminStackAndUpgradeController.isFinalizeItem}} - <p class="span10 alert alert-danger">{{t admin.stackVersions.version.upgrade.notFinalized.warning}}</p> + <p class="col-md-10 alert alert-danger">{{t admin.stackVersions.version.upgrade.notFinalized.warning}}</p> {{/if}} {{/if}} </div> @@ -170,4 +159,4 @@ {{outlet}} </div> </div> -</div> +</div> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ambari/blob/2a77e39c/ambari-web/app/templates/common/assign_master_components.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/common/assign_master_components.hbs b/ambari-web/app/templates/common/assign_master_components.hbs index 17763ca..a9da3e5 100644 --- a/ambari-web/app/templates/common/assign_master_components.hbs +++ b/ambari-web/app/templates/common/assign_master_components.hbs @@ -23,44 +23,44 @@ {{{view.alertMessage}}} </div> {{#each msg in controller.generalErrorMessages}} - <div class="alert alert-error">{{msg}}</div> + <div class="alert alert-danger">{{msg}}</div> {{/each}} {{#each msg in controller.generalWarningMessages}} <div class="alert alert-warning">{{msg}}</div> {{/each}} {{#if controller.isLoaded}} - <div class="assign-masters row-fluid"> - <div class="select-hosts span7"> - <div class="row-fluid"> + <div class="assign-masters row"> + <div class="select-hosts col-md-7"> + <div class="row col-md-12"> {{#if showCurrentHost}} - <div class="span12 control-group mlc"> - <div class="row-fluid"> - <div class="span4"><span class="pull-right control-label">{{t services.reassign.step2.currentHost}}</span> + <div class="col-md-12 control-group mlc"> + <div class="row"> + <div class="col-md-4"><span class="pull-right control-label">{{t services.reassign.step2.currentHost}}</span> </div> - <div class="span8"><span>{{currentHostId}}</span></div> + <div class="col-md-8"><span>{{currentHostId}}</span></div> </div> </div> {{/if}} <div class="clearfix"></div> - <div class="row-fluid"> - <div class="span12 control-group"> + <div class="row"> + <div class="col-md-12 control-group"> <form class="form-horizontal" autocomplete="off"> <!-- View for array controller --> {{#each controller.additionalHostsList}} - <div class="row-fluid additional-hosts-list"> - <div class="span5"> + <div class="row additional-hosts-list"> + <div class="col-md-5"> <label class="pts pull-right"> {{label}} </label> </div> - <div class="span7 host-cell"> + <div class="col-md-7 host-cell"> {{host}} </div> </div> {{/each}} {{#each servicesMastersToShow}} - <div class="row-fluid"> - <div class="span5"> + <div class="row"> + <div class="col-md-5"> <div class="control-group"> <label class="pts pull-right"> {{#if showCurrentPrefix}} @@ -73,13 +73,13 @@ </label> </div> </div> - <div class="span7"> + <div class="col-md-7"> {{#if isServiceCoHost}} <div class="hostName"> - {{selectedHost}}<i class="icon-asterisks">✵</i> + {{selectedHost}}<i class="glyphicon glyphicon-asterisks">✵</i> </div> {{else}} - <div {{bindAttr class="errorMessage:error: warnMessage:warning: :control-group"}}> + <div {{bindAttr class="errorMessage:error: warnMessage:warning: :form-group"}}> {{#if view.shouldUseInputs}} {{view App.InputHostView componentBinding="this" @@ -100,12 +100,12 @@ <span rel="popover" title="Warning" {{bindAttr data-content="warnMessage"}}> {{#if warnMessage}} - <i class="icon-warning-sign"></i> + <i class="glyphicon glyphicon-warning-sign"></i> {{/if}} </span> <span rel="popover" title="Error" {{bindAttr data-content="errorMessage"}}> {{#if errorMessage}} - <i class="icon-exclamation-sign"></i> + <i class="glyphicon glyphicon-exclamation-sign"></i> {{/if}} </span> </div> @@ -119,7 +119,7 @@ </div> </div> - <div class="host-assignments span5"> + <div class="host-assignments col-md-5"> {{#each masterHostMapping}} <div class="mapping-box round-corners well"> <div class="hostString"><span>{{hostInfo}}</span></div> @@ -141,7 +141,7 @@ {{/if}} <div class="btn-area"> {{#if view.isBackButtonVisible}} - <button type="button" class="btn pull-left installer-back-btn" {{bindAttr disabled="App.router.btnClickInProgress"}} {{action back}}> + <button type="button" class="btn btn-default pull-left installer-back-btn" {{bindAttr disabled="App.router.btnClickInProgress"}} {{action back}}> ← {{t common.back}} {{#if App.router.backBtnClickInProgress}} {{view App.SpinnerView tagName="span" classNames="service-button-spinner"}} @@ -155,7 +155,7 @@ {{view.acceptButtonText}} </button> {{#if view.isCancelButtonVisible}} - <button class="btn pull-right mrm" {{action onCancel target="controller"}}>{{t common.cancel}}</button> + <button class="btn btn-default pull-right mrm" {{action onCancel target="controller"}}>{{t common.cancel}}</button> {{/if}} </div> </div> http://git-wip-us.apache.org/repos/asf/ambari/blob/2a77e39c/ambari-web/app/templates/common/chart/linear_time.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/common/chart/linear_time.hbs b/ambari-web/app/templates/common/chart/linear_time.hbs index 2844728..4f1dc28 100644 --- a/ambari-web/app/templates/common/chart/linear_time.hbs +++ b/ambari-web/app/templates/common/chart/linear_time.hbs @@ -23,14 +23,14 @@ {{view view.timeRangeListView}} <a {{bindAttr class="view.isExportButtonHidden:hidden :corner-icon"}} href="#" {{action toggleFormatsList target="view"}}> - {{t common.export}} <i class="icon-save"></i> + {{t common.export}} <i class="glyphicon glyphicon-save"></i> </a> {{view view.exportMetricsMenuView}} </div> {{#if view.isTimePagingEnable}} <div {{bindAttr class="view.leftArrowVisible:visibleArrow :arrow-left"}} {{action "switchTimeBack" target="view.parentView"}}></div> {{/if}} - <div {{bindAttr id="view.containerId"}} {{bindAttr class="view.isReady:show:hide view.containerClass :chart-container"}}> + <div {{bindAttr id="view.containerId"}} {{bindAttr class="view.isReady:shown:hidden view.containerClass :chart-container"}}> <div {{bindAttr id="view.yAxisId"}} {{bindAttr class="view.yAxisClass :chart-y-axis"}}></div> <div {{bindAttr id="view.xAxisId"}} {{bindAttr class="view.xAxisClass :chart-x-axis"}}></div> <div {{bindAttr id="view.legendId"}} {{bindAttr class="view.legendClass :chart-legend"}}></div> http://git-wip-us.apache.org/repos/asf/ambari/blob/2a77e39c/ambari-web/app/templates/common/configs/addPropertyWindow.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/common/configs/addPropertyWindow.hbs b/ambari-web/app/templates/common/configs/addPropertyWindow.hbs index 1d41b04..6614de6 100644 --- a/ambari-web/app/templates/common/configs/addPropertyWindow.hbs +++ b/ambari-web/app/templates/common/configs/addPropertyWindow.hbs @@ -16,57 +16,59 @@ * limitations under the License. }} <form class="form-horizontal add-property-window" autocomplete="off"> - <div class="each-row control-group"> - <label class="control-label">{{t common.type}}</label> - - <div class="controls"> - <input class="span4" type="text" disabled {{bindAttr value="view.fileName"}}/> + <div class="each-row form-group"> + <label class="control-label col-md-2">{{t common.type}}</label> + <div class="col-md-5"> + <input class="form-control" type="text" disabled {{bindAttr value="view.fileName"}}/> + </div> + <div class="col-md-5"> <div class="btn-group add-mode pull-right" {{action toggleBulkMode target="view" }}> <a href="#" - {{bindAttr class=":btn view.serviceConfigObj.isBulkMode::active"}} + {{bindAttr class=":btn :btn-default view.serviceConfigObj.isBulkMode::active"}} {{translateAttr title="services.service.config.addPropertyWindow.singleMode" }} - data-toggle="tooltip"><i class="icon-tag"></i></a> + data-toggle="tooltip"><i class="glyphicon glyphicon-tag"></i></a> <a href="#" - {{bindAttr class=":btn view.serviceConfigObj.isBulkMode:active"}} + {{bindAttr class=":btn :btn-default view.serviceConfigObj.isBulkMode:active"}} {{translateAttr data-original-title="services.service.config.addPropertyWindow.bulkMode" }} - data-toggle="tooltip"><i class="icon-tags"></i></a> + data-toggle="tooltip"><i class="glyphicon glyphicon-tags"></i></a> </div> </div> + <div class="clearfix"></div> </div> {{#if view.serviceConfigObj.isBulkMode}} - <div {{bindAttr class="view.serviceConfigObj.bulkConfigError:error :each-row :control-group"}}> - <label class="control-label"> + <div {{bindAttr class="view.serviceConfigObj.bulkConfigError:has-error :each-row :form-group"}}> + <label class="control-label col-md-2"> {{t services.service.config.addPropertyWindow.properties}} <br> <small>{{t services.service.config.addPropertyWindow.propertiesHelper}}</small> </label> - <div class="controls"> + <div class="col-md-10"> {{view Ember.TextArea valueBinding="view.serviceConfigObj.bulkConfigValue" rows="4" - classNames="input-block-level" + classNames="input-block-level form-control" placeholderTranslation="services.service.config.addPropertyWindow.propertiesPlaceholder" }} - <span class="help-inline">{{{view.serviceConfigObj.bulkConfigErrorMessage}}}</span> + <span class="help-block validation-block">{{{view.serviceConfigObj.bulkConfigErrorMessage}}}</span> </div> </div> {{else}} - <div {{bindAttr class="view.serviceConfigObj.isKeyError:error :each-row :control-group"}}> - <label class="control-label">{{t common.key}}</label> - <div class="controls"> - {{view Ember.TextField valueBinding="view.serviceConfigObj.name" class="input-block-level"}} + <div {{bindAttr class="view.serviceConfigObj.isKeyError:has-error :each-row :form-group"}}> + <label class="control-label col-md-2">{{t common.key}}</label> + <div class="col-md-10"> + {{view Ember.TextField valueBinding="view.serviceConfigObj.name" class="input-block-level form-control"}} {{#if view.serviceConfigObj.isKeyError}} - <span class="help-inline"> - <i class="icon-exclamation-sign"></i> + <span class="help-block validation-block"> {{view.serviceConfigObj.errorMessage}} </span> {{else}} {{#if view.serviceConfigObj.isKeyWarning}} - <span class="help-inline"> - <i class="icon-warning-sign"></i> - {{view.serviceConfigObj.warningMessage}} + <span class="has-warning"> + <span class="help-block validation-block"> + {{view.serviceConfigObj.warningMessage}} + </span> </span> {{/if}} {{/if}} @@ -80,19 +82,19 @@ {{/if}} </div> </div> - <div class="each-row control-group"> - <label class="control-label">{{t common.value}}</label> + <div class="each-row form-group"> + <label class="control-label col-md-2">{{t common.value}}</label> - <div class="controls"> - {{view Ember.TextArea valueBinding="view.serviceConfigObj.value" rows="4" classNames="input-block-level"}} + <div class="col-md-10"> + {{view Ember.TextArea valueBinding="view.serviceConfigObj.value" rows="4" classNames="input-block-level form-control"}} </div> </div> - <div class="each-row control-group"> - <label class="control-label">{{t common.propertyType}}</label> + <div class="each-row form-group"> + <label class="control-label col-md-2">{{t common.propertyType}}</label> - <div class="controls"> + <div class="col-md-10"> {{view Em.Select - classNames="input-block-level" + classNames="input-block-level form-control" multiple="multiple" contentBinding="view.serviceConfigObj.content" selectionBinding="view.serviceConfigObj.propertyType" http://git-wip-us.apache.org/repos/asf/ambari/blob/2a77e39c/ambari-web/app/templates/common/configs/compare_property.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/common/configs/compare_property.hbs b/ambari-web/app/templates/common/configs/compare_property.hbs index 29c6ed7..df35e9e 100644 --- a/ambari-web/app/templates/common/configs/compare_property.hbs +++ b/ambari-web/app/templates/common/configs/compare_property.hbs @@ -17,18 +17,22 @@ }} {{#each compareConfig in view.serviceConfigProperty.compareConfigs}} - <div {{bindAttr class=":control-group :overrideField"}}> - {{view compareConfig.viewClass serviceConfigBinding="compareConfig" versionBinding="compareConfig.serviceVersion.version" categoryConfigsAllBinding="view.parentView.categoryConfigsAll"}} - <span class="label label-info">{{compareConfig.serviceVersion.versionText}}</span> - {{#if compareConfig.serviceVersion.isCurrent}} - <span class="label label-success">{{t common.current}}</span> - {{/if}} - {{#unless compareConfig.isMock}} - {{#if compareConfig.supportsFinal}} - <a disabled="disabled" {{bindAttr class=":btn-small :btn-final compareConfig.isFinal:active compareConfig.hideFinalIcon:hidden" }}> - <i class="icon-lock"></i> - </a> + <div {{bindAttr class=":form-group :overrideField"}}> + <div class="row"> + <div class="col-md-9"> + {{view compareConfig.viewClass serviceConfigBinding="compareConfig" versionBinding="compareConfig.serviceVersion.version" categoryConfigsAllBinding="view.parentView.categoryConfigsAll"}} + <span class="label label-info">{{compareConfig.serviceVersion.versionText}}</span> + {{#if compareConfig.serviceVersion.isCurrent}} + <span class="label label-success">{{t common.current}}</span> {{/if}} - {{/unless}} + {{#unless compareConfig.isMock}} + {{#if compareConfig.supportsFinal}} + <a disabled="disabled" {{bindAttr class=":btn-sm :btn-final compareConfig.isFinal:active compareConfig.hideFinalIcon:hidden" }}> + <i class="glyphicon glyphicon-lock"></i> + </a> + {{/if}} + {{/unless}} + </div> </div> + </div> {{/each}} http://git-wip-us.apache.org/repos/asf/ambari/blob/2a77e39c/ambari-web/app/templates/common/configs/config_history_dropdown_row.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/common/configs/config_history_dropdown_row.hbs b/ambari-web/app/templates/common/configs/config_history_dropdown_row.hbs index dcc6b31..80e6878 100644 --- a/ambari-web/app/templates/common/configs/config_history_dropdown_row.hbs +++ b/ambari-web/app/templates/common/configs/config_history_dropdown_row.hbs @@ -16,9 +16,9 @@ * limitations under the License. }} -<div class="row-fluid version-in-dropdown" {{action doAction view.serviceVersion view.actionTypes.SWITCH target="view"}}> - <div class="span2">{{view.serviceVersion.versionText}}</div> - <div class="span6">{{view.serviceVersion.createdDate}}</div> - <div class="span3">{{view.serviceVersion.authorFormatted}}</div> - <div class="pull-right"><i class="icon-caret-right"></i></div> +<div class="row version-in-dropdown" {{action doAction view.serviceVersion view.actionTypes.SWITCH target="view"}}> + <div class="col-md-2">{{view.serviceVersion.versionText}}</div> + <div class="col-md-6">{{view.serviceVersion.createdDate}}</div> + <div class="col-md-3">{{view.serviceVersion.authorFormatted}}</div> + <div class="pull-right"><i class="glyphicon glyphicon-caret-right"></i></div> </div> http://git-wip-us.apache.org/repos/asf/ambari/blob/2a77e39c/ambari-web/app/templates/common/configs/config_history_flow.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/common/configs/config_history_flow.hbs b/ambari-web/app/templates/common/configs/config_history_flow.hbs index fa67786..59d6491 100644 --- a/ambari-web/app/templates/common/configs/config_history_flow.hbs +++ b/ambari-web/app/templates/common/configs/config_history_flow.hbs @@ -19,23 +19,23 @@ <div id="config_history_flow" {{bindAttr class="view.parentView.supportsConfigLayout:with-enhanced-config"}}> <div class="version-slider"> - <div {{bindAttr class=":icon-chevron-box :pull-left view.showLeftArrow::disabled"}} {{action shiftBack target="view"}} data-toggle="arrow-tooltip" - {{bindAttr data-original-title="view.leftArrowTooltip"}}><i class="icon-chevron-left icon-3x"></i></div> - <div {{bindAttr class=":icon-chevron-box :pull-left view.showRightArrow::disabled"}} {{action shiftForward target="view"}} data-toggle="arrow-tooltip" - {{bindAttr data-original-title="view.rightArrowTooltip"}}><i class="icon-chevron-right icon-3x"></i></div> + <div {{bindAttr class=":glyphicon :glyphicon-chevron-box :pull-left view.showLeftArrow::disabled"}} {{action shiftBack target="view"}} data-toggle="arrow-tooltip" + {{bindAttr data-original-title="view.leftArrowTooltip"}}><i class="glyphicon-chevron-left glyphicon glyphicon-3x"></i></div> + <div {{bindAttr class=":glyphicon :glyphicon-chevron-box :pull-left view.showRightArrow::disabled"}} {{action shiftForward target="view"}} data-toggle="arrow-tooltip" + {{bindAttr data-original-title="view.rightArrowTooltip"}}><i class="glyphicon-chevron-right glyphicon glyphicon-3x"></i></div> {{#each sV in view.visibleServiceVersion}} {{view App.ConfigsServiceVersionBoxView serviceVersionBinding="sV"}} {{/each}} </div> - <div class="version-info-bar-wrapper"> + <div class="version-info-bar-wrapper row"> {{#isAuthorized "SERVICE.COMPARE_CONFIGS"}} - <div {{bindAttr class="view.showCompareVersionBar::hidden :version-info-bar"}}> - <div class="row-fluid"> - <div class="span1 remove-compare-bar" {{action removeCompareVersionBar target="view"}} data-toggle="arrow-tooltip" {{translateAttr data-original-title="services.service.config.configHistory.dismissIcon.tooltip"}}> - <i class="icon-remove-circle icon-large"></i> + <div {{bindAttr class="view.showCompareVersionBar::hidden :version-info-bar :col-md-12"}}> + <div class="version-info-bar"> + <div class="col-md-1 remove-compare-bar" {{action removeCompareVersionBar target="view"}} data-toggle="arrow-tooltip" {{translateAttr data-original-title="services.service.config.configHistory.dismissIcon.tooltip"}}> + <i class="glyphicon-remove-circle glyphicon glyphicon-large"></i> </div> - <div class="label-wrapper span8" data-toggle="tooltip" {{bindAttr data-original-title="view.compareServiceVersion.fullNotes"}}> + <div class="label-wrapper col-md-8" data-toggle="tooltip" {{bindAttr data-original-title="view.compareServiceVersion.fullNotes"}}> {{t services.service.config.configHistory.comparing}} <span class="label label-info current-version-label">{{view.displayedServiceVersion.versionText}}</span> ... @@ -46,7 +46,7 @@ <strong>{{view.compareServiceVersion.authorFormatted}}</strong> {{t dashboard.configHistory.info-bar.authoredOn}} <strong>{{view.compareServiceVersion.createdDate}}</strong> </div> - {{#isAuthorized "SERVICE.MODIFY_CONFIGS"}} + {{#isAuthorized "SERVICE.MODIFY_CONFIGS"}} <div class="pull-right operations-button"> <button class="btn btn-success" {{action doAction view.serviceVersionsReferences.compare view.actionTypes.REVERT target="view"}} {{bindAttr disabled="view.versionActionsDisabled" class="view.compareServiceVersion.canBeMadeCurrent::hidden"}}>{{view.compareServiceVersion.makeCurrentButtonText}}</button> </div> @@ -64,21 +64,21 @@ <div class="notes">{{view.parentView.hoveredServiceVersion.fullNotes}}</div> </div> <div class="version-operations-buttons"> - <button {{bindAttr disabled="view.parentView.hoveredServiceVersion.disabledActionAttr.view" class=":btn view.parentView.hoveredServiceVersion.isDisplayed:not-allowed-cursor" title="view.parentView.hoveredServiceVersion.disabledActionMessages.view"}} {{action doAction view.parentView.hoveredServiceVersion view.parentView.actionTypes.SWITCH target="view.parentView"}}><i class="icon-search"></i> {{t common.view}}</button> + <button {{bindAttr disabled="view.parentView.hoveredServiceVersion.disabledActionAttr.view" class=":btn :btn-default view.parentView.hoveredServiceVersion.isDisplayed:not-allowed-cursor" title="view.parentView.hoveredServiceVersion.disabledActionMessages.view"}} {{action doAction view.parentView.hoveredServiceVersion view.parentView.actionTypes.SWITCH target="view.parentView"}}><i class="glyphicon glyphicon-search"></i> {{t common.view}}</button> {{#isAuthorized "SERVICE.COMPARE_CONFIGS"}} - <button {{bindAttr disabled="view.parentView.hoveredServiceVersion.disabledActionAttr.compare" class=":btn view.parentView.hoveredServiceVersion.isDisplayed:not-allowed-cursor" title="view.parentView.hoveredServiceVersion.disabledActionMessages.compare"}} {{action doAction view.parentView.hoveredServiceVersion view.parentView.actionTypes.COMPARE target="view.parentView"}}><i class="icon-copy"></i> {{t common.compare}}</button> + <button {{bindAttr disabled="view.parentView.hoveredServiceVersion.disabledActionAttr.compare" class=":btn :btn-default view.parentView.hoveredServiceVersion.isDisplayed:not-allowed-cursor" title="view.parentView.hoveredServiceVersion.disabledActionMessages.compare"}} {{action doAction view.parentView.hoveredServiceVersion view.parentView.actionTypes.COMPARE target="view.parentView"}}><i class="glyphicon glyphicon-copy"></i> {{t common.compare}}</button> {{/isAuthorized}} {{#isAuthorized "SERVICE.MODIFY_CONFIGS"}} - <button {{bindAttr disabled="view.parentView.hoveredServiceVersion.disabledActionAttr.revert" class=":btn view.parentView.hoveredServiceVersion.isCurrent:not-allowed-cursor view.parentView.hoveredServiceVersion.isCompatible::hidden" title="view.parentView.hoveredServiceVersion.disabledActionMessages.revert"}} {{action doAction view.parentView.hoveredServiceVersion view.parentView.actionTypes.REVERT target="view.parentView"}}>{{t dashboard.configHistory.info-bar.revert.button}}</button> + <button {{bindAttr disabled="view.parentView.hoveredServiceVersion.disabledActionAttr.revert" class=":btn :btn-default view.parentView.hoveredServiceVersion.isCurrent:not-allowed-cursor view.parentView.hoveredServiceVersion.isCompatible::hidden" title="view.parentView.hoveredServiceVersion.disabledActionMessages.revert"}} {{action doAction view.parentView.hoveredServiceVersion view.parentView.actionTypes.REVERT target="view.parentView"}}>{{t dashboard.configHistory.info-bar.revert.button}}</button> {{/isAuthorized}} </div> {{/if}} {{/view}} - <div class="version-info-bar"> - <div class="row-fluid"> + <div class="version-info-bar col-md-12"> + <div> <div class="btn-group pull-left"> - <button id="toggle-dropdown-button" class="btn dropdown-toggle" data-toggle="dropdown" href="#" {{action hideFullList target="view"}} {{bindAttr disabled="view.versionActionsDisabled"}}> - <i class="icon-random"></i> + <button id="toggle-dropdown-button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#" {{action hideFullList target="view"}} {{bindAttr disabled="view.versionActionsDisabled"}}> + <i class="glyphicon glyphicon-random"></i> <span class="caret"></span> </button> <div id="dropdown_content" class="dropdown-menu"> @@ -98,21 +98,23 @@ </ul> </div> </div> - <div class="label-wrapper span8" data-toggle="tooltip" {{bindAttr data-original-title="view.displayedServiceVersion.fullNotes"}}> + <div class="label-wrapper col-md-8" data-toggle="tooltip" {{bindAttr data-original-title="view.displayedServiceVersion.fullNotes"}}> {{#if view.displayedServiceVersion.versionText}} <span class="label label-info current-version-label">{{view.displayedServiceVersion.versionText}}</span> {{/if}} {{#if view.displayedServiceVersion.isCurrent}} - <span class="label-current label label-success icon-ok" data-toggle="tooltip" {{translateAttr title="common.current"}}></span> + <span class="label label-current label-success" data-toggle="tooltip" {{translateAttr title="common.current"}}> + <i class="glyphicon glyphicon-ok"></i> + </span> {{/if}} {{#if view.displayedServiceVersion.author}} - <strong>{{view.displayedServiceVersion.authorFormatted}}</strong> {{t dashboard.configHistory.info-bar.authoredOn}} <strong>{{view.displayedServiceVersion.createdDate}}</strong> + <strong>{{view.displayedServiceVersion.authorFormatted}}</strong> {{t dashboard.configHistory.info-bar.authoredOn}} <strong>{{view.displayedServiceVersion.createdDate}}</strong> {{/if}} </div> {{#isAuthorized "SERVICE.MODIFY_CONFIGS"}} <div class="pull-right operations-button"> <div {{bindAttr class="view.displayedServiceVersion.isCurrent::hidden"}}> - <button class="btn" {{action doCancel target="controller"}} {{bindAttr disabled="view.isDiscardDisabled"}}>{{t common.discard}}</button> + <button class="btn btn-default" {{action doCancel target="controller"}} {{bindAttr disabled="view.isDiscardDisabled"}}>{{t common.discard}}</button> <button class="btn btn-success" {{action save target="view"}} {{bindAttr disabled="view.isSaveDisabled"}}>{{t common.save}}</button> </div> <button class="btn btn-success" {{action doAction view.serviceVersionsReferences.displayed view.actionTypes.REVERT target="view"}} {{bindAttr disabled="view.versionActionsDisabled" class="view.displayedServiceVersion.canBeMadeCurrent::hidden"}}>{{view.displayedServiceVersion.makeCurrentButtonText}}</button> http://git-wip-us.apache.org/repos/asf/ambari/blob/2a77e39c/ambari-web/app/templates/common/configs/controls.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/common/configs/controls.hbs b/ambari-web/app/templates/common/configs/controls.hbs index 0a7d21e..db12e3c 100644 --- a/ambari-web/app/templates/common/configs/controls.hbs +++ b/ambari-web/app/templates/common/configs/controls.hbs @@ -21,38 +21,38 @@ {{else}} {{#if view.showIsFinal}} <a href="#" data-toggle="tooltip" - {{bindAttr class=":btn-small :btn-final view.serviceConfigProperty.isFinal:active view.serviceConfigProperty.hideFinalIcon:hidden" disabled="view.serviceConfigProperty.isNotEditable"}} + {{bindAttr class=":btn-sm :btn-final view.serviceConfigProperty.isFinal:active view.serviceConfigProperty.hideFinalIcon:hidden" disabled="view.serviceConfigProperty.isNotEditable"}} {{action "toggleFinalFlag" this target="view.parentView"}} {{translateAttr data-original-title="services.service.config.final"}}> - <i class="icon-lock"></i> + <i class="glyphicon glyphicon-lock"></i> </a> {{/if}} {{#if view.showOverride}} - <a href="#" data-toggle="tooltip" class="btn-small" + <a href="#" data-toggle="tooltip" class="btn-sm" {{action "createOverrideProperty" this target="view.parentView"}} {{translateAttr data-original-title="common.override"}}> - <i class="icon-plus-sign"></i> + <i class="glyphicon glyphicon-plus-sign"></i> </a> {{/if}} {{#if view.showUndo}} - <a href="#" data-toggle="tooltip" class="btn-small" + <a href="#" data-toggle="tooltip" class="btn-sm" {{action "doRestoreDefaultValue" this target="view.parentView"}} {{translateAttr data-original-title="common.undo"}}> <i class="icon-undo"></i> </a> {{/if}} {{#if view.showRemove}} - <a href="#" data-toggle="tooltip" class="btn-small remove-config-property-button" + <a href="#" data-toggle="tooltip" class="btn-sm remove-config-property-button" {{action "removeProperty" this target="view.parentView"}} {{translateAttr data-original-title="common.remove"}}> - <i class="icon-minus-sign"></i> + <i class="glyphicon glyphicon-minus-sign"></i> </a> {{/if}} {{#if view.showSetRecommended}} - <a href="#" data-toggle="tooltip" class="btn-small" + <a href="#" data-toggle="tooltip" class="btn-sm" {{action "setRecommendedValue" this target="view.parentView"}} {{translateAttr data-original-title="services.service.config.setRecommendedValue"}}> - <i class="icon-repeat"></i> + <i class="glyphicon glyphicon-repeat"></i> </a> {{/if}} {{/if}} http://git-wip-us.apache.org/repos/asf/ambari/blob/2a77e39c/ambari-web/app/templates/common/configs/notifications_configs.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/common/configs/notifications_configs.hbs b/ambari-web/app/templates/common/configs/notifications_configs.hbs index 062a1eb..1c589b1 100644 --- a/ambari-web/app/templates/common/configs/notifications_configs.hbs +++ b/ambari-web/app/templates/common/configs/notifications_configs.hbs @@ -16,71 +16,105 @@ * limitations under the License. }} -<div class="accordion-heading" {{action "onToggleBlock" category target="view"}}> - <i {{bindAttr class=":pull-left :accordion-toggle view.category.isCollapsed:icon-caret-right:icon-caret-down"}}></i> - <a class="accordion-toggle">{{view.category.displayName}}</a> -</div> - -<div class="accordion-body collapse in" {{bindAttr style="view.isCategoryBodyVisible"}}> - <div class="accordion-inner service-config-section"> - <form class="form-horizontal" autocomplete="off"> - - <div class="entry-row"> - {{view Ember.RadioButton name="createNotification" selectionBinding="view.createNotification" value="no"}} {{t installer.step7.misc.notification.configure.later}} - </div> +<div class="panel panel-default"> + <div class="panel-heading" {{action "onToggleBlock" category target="view"}}> + <h3 class="panel-title"> + <i {{bindAttr class=":pull-left :panel-toggle view.category.isCollapsed:icon-caret-right:icon-caret-down"}}></i> + <a class="panel-toggle">{{view.category.displayName}}</a> + </h3> + </div> - <div class="entry-row"> - {{view Ember.RadioButton name="createNotification" selectionBinding="view.createNotification" value="yes"}} {{t installer.step7.misc.notification.configure}} - </div> + <div class="panel-body collapse in" {{bindAttr style="view.isCategoryBodyVisible"}}> + <div class="service-config-section"> + <form class="form-horizontal" autocomplete="off"> - {{#each config in view.categoryConfigs}} - <div {{bindAttr class=":entry-row config.rowStyleClass config.isUserProperty:indent-1"}}> - <span {{bindAttr class="config.errorMessage:error: :control-group :control-label-span"}}> - <label class="control-label"> - {{formatWordBreak config.displayName}} + <div class="entry-row row"> + <div class="checkbox"> + <label> + {{view Ember.RadioButton name="createNotification" selectionBinding="view.createNotification" value="no" type="radio"}} + {{t installer.step7.misc.notification.configure.later}} </label> - </span> + </div> + </div> - <div {{bindAttr class="config.showLabel:controls"}}> - <div {{bindAttr class="config.errorMessage:error: config.warnMessage:warning: :control-group"}}> - {{view config.viewClass serviceConfigBinding="config" categoryConfigsAllBinding="view.categoryConfigsAll" }} + <div class="entry-row row"> + <div class="checkbox"> + <label> + {{view Ember.RadioButton name="createNotification" selectionBinding="view.createNotification" value="yes" type="radio"}} + {{t installer.step7.misc.notification.configure}} + </label> + </div> + </div> - {{#if config.isRemovable}} - {{#isAuthorized "SERVICE.MODIFY_CONFIGS"}} - {{#unless config.isComparison}} - <a class="btn-small" href="#" data-toggle="tooltip" - {{action "removeProperty" config target="view"}} - {{translateAttr data-original-title="common.remove"}}> - <i class="icon-minus-sign"></i> - </a> - {{/unless}} - {{/isAuthorized}} - {{/if}} + {{#each config in view.categoryConfigs}} + <div {{bindAttr class=":entry-row :row config.rowStyleClass config.isUserProperty:indent-1"}}> + <span {{bindAttr class="config.errorMessage:error: :form-group :control-label-span :col-md-3"}}> + <label class="control-label"> + {{formatWordBreak config.displayName}} + </label> + </span> - <span class="help-inline">{{config.errorMessage}}</span> - <span class="help-inline">{{config.warnMessage}}</span> + <div class="col-md-9"> + <div {{bindAttr class="config.errorMessage:error: config.warnMessage:warning: :form-group"}}> + <div class="row"> + <div class="col-md-9"> + {{view config.viewClass serviceConfigBinding="config" categoryConfigsAllBinding="view.categoryConfigsAll" }} + </div> + <div class="col-md-3"> + {{#if config.isRemovable}} + {{#isAuthorized "SERVICE.MODIFY_CONFIGS"}} + {{#unless config.isComparison}} + <a class="btn-sm" href="#" data-toggle="tooltip" + {{action "removeProperty" config target="view"}} + {{translateAttr data-original-title="common.remove"}}> + <i class="icon-minus-sign"></i> + </a> + {{/unless}} + {{/isAuthorized}} + {{/if}} + {{#if config.errorMessage}} + <span class="help-block validation-block">{{config.errorMessage}}</span> + {{/if}} + {{#if config.warnMessage}} + <span class="help-block validation-block">{{config.warnMessage}}</span> + {{/if}} + </div> + </div> + </div> + </div> </div> + {{/each}} + + <div class="entry-row row indent-1"> + <div class="checkbox"> + <label> + {{view Ember.RadioButton name="tlsOrSsl" disabledBinding="view.configsAreDisabled" selectionBinding="view.tlsOrSsl" value="tls"}} + {{t installer.step7.misc.notification.use_tls}} + </label> </div> </div> - {{/each}} - <div class="entry-row indent-1"> - {{view Ember.RadioButton name="tlsOrSsl" disabledBinding="view.configsAreDisabled" selectionBinding="view.tlsOrSsl" value="tls"}} {{t installer.step7.misc.notification.use_tls}} - </div> - - <div class="entry-row indent-1"> - {{view Ember.RadioButton name="tlsOrSsl" disabledBinding="view.configsAreDisabled" selectionBinding="view.tlsOrSsl" value="ssl"}} {{t installer.step7.misc.notification.use_ssl}} - </div> + <div class="entry-row row indent-1"> + <div class="checkbox"> + <label> + {{view Ember.RadioButton name="tlsOrSsl" disabledBinding="view.configsAreDisabled" selectionBinding="view.tlsOrSsl" value="ssl"}} + {{t installer.step7.misc.notification.use_ssl}} + </label> + </div> + </div> - {{#isAuthorized "SERVICE.MODIFY_CONFIGS"}} - {{#if view.canEdit}} - {{#unless view.configsAreDisabled}} - <div class="entry-row indent-1"> - <a href="#" {{action "showAddPropertyWindow" this target="view" }} >{{t installer.step7.config.addProperty}}...</a> - </div> - {{/unless}} - {{/if}} - {{/isAuthorized}} - </form> + {{#isAuthorized "SERVICE.MODIFY_CONFIGS"}} + {{#if view.canEdit}} + {{#unless view.configsAreDisabled}} + <div class="entry-row indent-1"> + <a + href="#" {{action "showAddPropertyWindow" this target="view" }} >{{t installer.step7.config.addProperty}} + ...</a> + </div> + {{/unless}} + {{/if}} + {{/isAuthorized}} + </form> + </div> </div> </div>
