AMBARI-22700 Post-install: UI style fixes. (atkach)
Project: http://git-wip-us.apache.org/repos/asf/ambari/repo Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/02887284 Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/02887284 Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/02887284 Branch: refs/heads/branch-feature-AMBARI-21674 Commit: 02887284a1d19666e52b61884ad9daf8db040e68 Parents: 935ea92 Author: Andrii Tkach <[email protected]> Authored: Wed Dec 27 17:31:03 2017 +0200 Committer: Andrii Tkach <[email protected]> Committed: Wed Dec 27 18:18:09 2017 +0200 ---------------------------------------------------------------------- ambari-web/app/styles/application.less | 2 +- .../app/styles/config_versions_control.less | 6 +- .../app/styles/enhanced_service_dashboard.less | 4 +- ambari-web/app/styles/modal_popups.less | 19 ++- ambari-web/app/templates/application.hbs | 6 +- .../common/configs/config_versions_dropdown.hbs | 2 +- .../service_config_layout_tab_compare.hbs | 6 +- .../templates/common/host_progress_popup.hbs | 115 ++++++++++--------- .../app/templates/main/service/menu_item.hbs | 6 +- .../service_config_layout_tab_compare_view.js | 10 ++ .../common/host_progress_popup_body_view.js | 12 ++ 11 files changed, 116 insertions(+), 72 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ambari/blob/02887284/ambari-web/app/styles/application.less ---------------------------------------------------------------------- diff --git a/ambari-web/app/styles/application.less b/ambari-web/app/styles/application.less index c12864a..670ae7d 100644 --- a/ambari-web/app/styles/application.less +++ b/ambari-web/app/styles/application.less @@ -1140,7 +1140,7 @@ a.services-menu-blocks{ color: @health-status-red; } .menu-item-name.UNKNOWN { - color: @health-status-orange; + color: @health-status-yellow; } } http://git-wip-us.apache.org/repos/asf/ambari/blob/02887284/ambari-web/app/styles/config_versions_control.less ---------------------------------------------------------------------- diff --git a/ambari-web/app/styles/config_versions_control.less b/ambari-web/app/styles/config_versions_control.less index e7375d6..5b947a4 100644 --- a/ambari-web/app/styles/config_versions_control.less +++ b/ambari-web/app/styles/config_versions_control.less @@ -23,6 +23,7 @@ #config-versions-control { .dropdown-menu { min-width: 600px; + padding-bottom: 20px; li { padding: 3px 20px; } @@ -109,8 +110,9 @@ padding: 10px; } .caret { - float: right; - margin-top: 5px; + position: absolute; + top: 15px; + right: 10px; } } .filter-combobox { http://git-wip-us.apache.org/repos/asf/ambari/blob/02887284/ambari-web/app/styles/enhanced_service_dashboard.less ---------------------------------------------------------------------- diff --git a/ambari-web/app/styles/enhanced_service_dashboard.less b/ambari-web/app/styles/enhanced_service_dashboard.less index 00b46a8..4c97539 100644 --- a/ambari-web/app/styles/enhanced_service_dashboard.less +++ b/ambari-web/app/styles/enhanced_service_dashboard.less @@ -88,7 +88,7 @@ margin: 55px auto; } .title { - padding: 4px 0 0 1px; + padding: 4px 0 0 8px; font-size: 14px; color: #666666; line-height: 17px; @@ -135,7 +135,7 @@ .frame; .content { padding-top: 45px; - width: 99%; + width: 100%; } .screensaver{ // graph onload wait width: 90%; http://git-wip-us.apache.org/repos/asf/ambari/blob/02887284/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 dc951c9..b26bf1a 100644 --- a/ambari-web/app/styles/modal_popups.less +++ b/ambari-web/app/styles/modal_popups.less @@ -33,6 +33,7 @@ } .host-component-popup-wrap { + min-height: 220px; .task-top-wrap { .operation-name-top { width: 36%; @@ -70,6 +71,22 @@ } } } + .status-dropdown { + .btn.dropdown-toggle:first-child { + min-width: 150px; + padding: 10px; + position: relative; + text-align: left; + .caret { + position: absolute; + top: 15px; + right: 10px; + } + } + ul.dropdown-menu { + min-width: 150px; + } + } } .modal { @@ -395,7 +412,7 @@ } .modal-xlg { - width: 100%; + width: 98%; .wizard { .container { width: 1236px; http://git-wip-us.apache.org/repos/asf/ambari/blob/02887284/ambari-web/app/templates/application.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/application.hbs b/ambari-web/app/templates/application.hbs index 5c47406..adedde1 100644 --- a/ambari-web/app/templates/application.hbs +++ b/ambari-web/app/templates/application.hbs @@ -174,15 +174,13 @@ </div> <div class="navbar-nav navbar-text navbar-right brand-wrapper"> - {{#if enableLinks}} {{! cluster name }} - <a href="#" {{bindAttr title="clusterName"}} {{action "showPopup" target="App.router.backgroundOperationsController"}} class="cluster-name"> + <div {{bindAttr title="clusterName"}} class="cluster-name"> {{#unless App.isClusterUser}} <span>{{clusterDisplayName}}</span> {{/unless}} - </a> + </div> {{! cluster name end }} - {{/if}} </div> </div> </nav> http://git-wip-us.apache.org/repos/asf/ambari/blob/02887284/ambari-web/app/templates/common/configs/config_versions_dropdown.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/common/configs/config_versions_dropdown.hbs b/ambari-web/app/templates/common/configs/config_versions_dropdown.hbs index 18083f9..1442145 100644 --- a/ambari-web/app/templates/common/configs/config_versions_dropdown.hbs +++ b/ambari-web/app/templates/common/configs/config_versions_dropdown.hbs @@ -19,7 +19,7 @@ <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> {{t common.version}}: - <span class="pull-right"><strong>{{view.displayedServiceVersion.version}}</strong><span class="caret"></span></span> + <span><strong>{{view.displayedServiceVersion.version}}</strong><span class="caret"></span></span> </button> <div class="dropdown-menu"> <li class="input-group search-input"> http://git-wip-us.apache.org/repos/asf/ambari/blob/02887284/ambari-web/app/templates/common/configs/service_config_layout_tab_compare.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/common/configs/service_config_layout_tab_compare.hbs b/ambari-web/app/templates/common/configs/service_config_layout_tab_compare.hbs index ccf47f3..7cf6dcf 100644 --- a/ambari-web/app/templates/common/configs/service_config_layout_tab_compare.hbs +++ b/ambari-web/app/templates/common/configs/service_config_layout_tab_compare.hbs @@ -17,7 +17,7 @@ }} {{#if view.dataIsReady}} - {{#unless tab.isHiddenByFilter}} + {{#unless view.content.isHiddenByFilter}} <div class="row bottom-border comparison-table-header"> <div class="col-md-3 property-name-column">{{t common.propertyName}}</div> <div class="col-md-4 property-value-column"> @@ -35,7 +35,7 @@ </div> <div class="accordion"> - {{#each row in tab.sectionRows}} + {{#each row in view.content.sectionRows}} {{#each section in row}} <div class="panel-group"> <div class="panel panel-default"> @@ -47,7 +47,7 @@ </a> </h3> </div> - <div class="panel-body collapse in" {{bindAttr class="section.isCollapsed:hide"}} {{QAAttr "panel-body"}}> + <div class="panel-body collapse in" {{bindAttr style="view.isCategoryBodyVisible"}} {{QAAttr "panel-body"}}> <div class="service-config-section"> {{#each subRow in section.subsectionRows}} {{#each subsection in subRow}} http://git-wip-us.apache.org/repos/asf/ambari/blob/02887284/ambari-web/app/templates/common/host_progress_popup.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/common/host_progress_popup.hbs b/ambari-web/app/templates/common/host_progress_popup.hbs index 31358e4..cc2f073 100644 --- a/ambari-web/app/templates/common/host_progress_popup.hbs +++ b/ambari-web/app/templates/common/host_progress_popup.hbs @@ -16,24 +16,25 @@ * limitations under the License. }} -<div class="host-component-popup-wrap col-sm-12"> +<div class="host-component-popup-wrap"> {{#if view.parentView.isLoaded}} {{!-- OPERATIONS --}} <div {{bindAttr class="view.parentView.isServiceListHidden:hidden :task-list-main-wrap :table-body-wrap"}}> - <div class="row top-wrap"> - <h2 class="table-title col-sm-6">{{view view.parentView.titleClass}}</h2> - <div class="table-controls row col-sm-6 pull-right"> - <div class="col-sm-12"> - <div class="btn-group pull-right"> - {{view Ember.Select - contentBinding="view.categories" - optionValuePath="content.value" - optionLabelPath="content.label" - selectionBinding="view.serviceCategory" - classNames="form-control" - }} + <div class="top-wrap"> + <div class="row"> + <h2 class="table-title col-sm-6">{{view view.parentView.titleClass}}</h2> + <div class="table-controls col-sm-6"> + <div class="btn-group pull-right status-dropdown"> + <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> + {{view.serviceCategory.label}} <span class="caret"></span> + </button> + <ul class="dropdown-menu"> + {{#each category in view.categories}} + <li><a href="#" {{action selectServiceCategory category target="view"}}>{{category.label}}</a></li> + {{/each}} + </ul> </div> </div> </div> @@ -104,18 +105,19 @@ {{!-- HOSTS ---}} <div {{bindAttr class="view.parentView.isHostListHidden:hidden :task-list-main-wrap :table-body-wrap"}}> - <div class="row top-wrap"> - <h2 class="table-title col-sm-2">{{t common.hosts}}</h2> - <div class="table-controls row col-sm-10 pull-right"> - <div class="col-sm-12"> - <div class="btn-group pull-right"> - {{view Ember.Select - contentBinding="view.categories" - optionValuePath="content.value" - optionLabelPath="content.label" - selectionBinding="view.hostCategory" - classNames="form-control" - }} + <div class="top-wrap"> + <div class="row"> + <h2 class="table-title col-sm-2">{{t common.hosts}}</h2> + <div class="table-controls col-sm-10"> + <div class="btn-group pull-right status-dropdown"> + <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> + {{view.hostCategory.label}} <span class="caret"></span> + </button> + <ul class="dropdown-menu"> + {{#each category in view.categories}} + <li><a href="#" {{action selectHostCategory category target="view"}}>{{category.label}}</a></li> + {{/each}} + </ul> </div> </div> </div> @@ -188,19 +190,19 @@ {{!-- TASKS ---}} <div {{bindAttr class="view.parentView.isTaskListHidden:hidden :task-list-main-wrap :table-body-wrap"}}> - <div class="row top-wrap"> - <h2 class="table-title col-sm-2">{{t common.tasks}}</h2> - <div class="table-controls row col-sm-10 pull-right"> - <div class="col-sm-12"> - <div class="btn-group pull-right"> - {{view Ember.Select - class="form-control" - contentBinding="view.categories" - optionValuePath="content.value" - optionLabelPath="content.label" - selectionBinding="view.taskCategory" - classNames="form-control" - }} + <div class="top-wrap"> + <div class="row"> + <h2 class="table-title col-sm-2">{{t common.tasks}}</h2> + <div class="table-controls col-sm-10"> + <div class="btn-group pull-right status-dropdown"> + <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> + {{view.taskCategory.label}} <span class="caret"></span> + </button> + <ul class="dropdown-menu"> + {{#each category in view.categories}} + <li><a href="#" {{action selectTaskCategory category target="view"}}>{{category.label}}</a></li> + {{/each}} + </ul> </div> </div> </div> @@ -252,24 +254,27 @@ <div class="task-top-wrap top-wrap"> <div {{bindAttr class="view.hostComponentLogsExists:task-detail-log-nav-actions :row"}}> <h2 class="table-title col-sm-5">{{t common.taskLog}}</h2> - <div class="table-controls row col-sm-7 pull-right"> - <div class="col-sm-12"> - {{#if App.supports.logSearch}} - {{#if view.isLogSearchInstalled}} - {{#havePermissions "SERVICE.VIEW_OPERATIONAL_LOGS"}} - <button type="button" class="btn btn-link pull-right" {{action navigateToHostLogs target="view"}} {{bindAttr class="view.isLogsLinkVisible::hidden" disabled="App.router.wizardWatcherController.isNonWizardUser"}}> - <i class="glyphicon glyphicon-file"></i> {{t common.host}} {{t common.logs}} - </button> - {{/havePermissions}} - {{/if}} + <div class="table-controls col-sm-7 pull-right"> + {{#if App.supports.logSearch}} + {{#if view.isLogSearchInstalled}} + {{#havePermissions "SERVICE.VIEW_OPERATIONAL_LOGS"}} + <button type="button" class="btn btn-link pull-right" {{action navigateToHostLogs target="view"}} + {{bindAttr class="view.isLogsLinkVisible::hidden" disabled="App.router.wizardWatcherController.isNonWizardUser"}}> + <i class="glyphicon glyphicon-file"></i> {{t common.host}} {{t common.logs}} + </button> + {{/havePermissions}} {{/if}} - <button type="button" class="btn btn-link pull-right" {{translateAttr title="common.openNewWindow"}} {{action openTaskLogInDialog}}> - <i class="icon icon-external-link"></i> {{t common.open}} - </button> - <button type="button" class="btn btn-link pull-right copy-clipboard" {{translateAttr title="common.fullLogPopup.clickToCopy"}} {{action "textTrigger" taskInfo target="view"}}> - <i class="glyphicon glyphicon-copy"></i> {{t common.copy}} - </button> - </div> + {{/if}} + <button type="button" class="btn btn-link pull-right" + {{translateAttr title="common.openNewWindow"}} + {{action openTaskLogInDialog}}> + <i class="icon icon-external-link"></i> {{t common.open}} + </button> + <button type="button" class="btn btn-link pull-right copy-clipboard" + {{translateAttr title="common.fullLogPopup.clickToCopy"}} + {{action "textTrigger" taskInfo target="view"}}> + <i class="glyphicon glyphicon-copy"></i> {{t common.copy}} + </button> </div> </div> <ul {{bindAttr class="view.hostComponentLogsExists::hide :nav :nav-tabs :task-detail-nav"}}> http://git-wip-us.apache.org/repos/asf/ambari/blob/02887284/ambari-web/app/templates/main/service/menu_item.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/main/service/menu_item.hbs b/ambari-web/app/templates/main/service/menu_item.hbs index 723f4f6..6d5bb5c 100644 --- a/ambari-web/app/templates/main/service/menu_item.hbs +++ b/ambari-web/app/templates/main/service/menu_item.hbs @@ -17,12 +17,12 @@ }} <a class="services-menu-blocks" {{bindAttr href="view.link" data-href="view.dataHref"}}> - {{#if view.content.alertsCount}} - <span {{bindAttr class=":icon-circle view.hasCriticalAlerts:service-alerts-critical:service-alerts-warning"}}></span> - {{/if}} <span class="pull-right"> <i rel="tooltip" {{action goToConfigs target="view"}} {{bindAttr class=":glyphicon :glyphicon-refresh :restart-required-service view.content.isRestartRequired::hidden" data-original-title="view.restartRequiredMessage"}}></i> </span> + {{#if view.content.alertsCount}} + <span {{bindAttr class=":icon-circle view.hasCriticalAlerts:service-alerts-critical:service-alerts-warning"}}></span> + {{/if}} <span {{bindAttr class=":menu-item-name view.content.workStatus" data-original-title="view.content.toolTipContent"}} rel="serviceHealthTooltip"> {{unbound view.content.displayName}} </span> http://git-wip-us.apache.org/repos/asf/ambari/blob/02887284/ambari-web/app/views/common/configs/service_config_layout_tab_compare_view.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/views/common/configs/service_config_layout_tab_compare_view.js b/ambari-web/app/views/common/configs/service_config_layout_tab_compare_view.js index ee4f751..5e84ae5 100644 --- a/ambari-web/app/views/common/configs/service_config_layout_tab_compare_view.js +++ b/ambari-web/app/views/common/configs/service_config_layout_tab_compare_view.js @@ -27,5 +27,15 @@ App.ServiceConfigLayoutTabCompareView = App.ServiceConfigLayoutTabView.extend({ onToggleBlock: function(event) { event.context.toggleProperty('isCollapsed'); + $(event.currentTarget).siblings('.panel-body').slideToggle(500); + }, + + didInsertElement: function() { + this._super(); + this.get('content.sectionRows').forEach(function(row) { + row.setEach('isCollapsed', false); + row.setEach('isCategoryBodyVisible', Em.computed.ifThenElse('isCollapsed', 'display: none;', 'display: block;')); + }); } + }); http://git-wip-us.apache.org/repos/asf/ambari/blob/02887284/ambari-web/app/views/common/host_progress_popup_body_view.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/views/common/host_progress_popup_body_view.js b/ambari-web/app/views/common/host_progress_popup_body_view.js index 49d7dea..3674ec5 100644 --- a/ambari-web/app/views/common/host_progress_popup_body_view.js +++ b/ambari-web/app/views/common/host_progress_popup_body_view.js @@ -290,6 +290,18 @@ App.HostProgressPopupBodyView = App.TableView.extend({ this.unsubscribeResize(); }, + selectServiceCategory: function (e) { + this.set('serviceCategory', e.context); + }, + + selectHostCategory: function (e) { + this.set('hostCategory', e.context); + }, + + selectTaskCategory: function (e) { + this.set('taskCategory', e.context); + }, + /** * Subscribe for window <code>resize</code> event. *
