Repository: ambari Updated Branches: refs/heads/trunk f24531d1b -> 55c0f792f
AMBARI-10643. Widget title need to utilize more horizontal space to prevent wrapping.(xiwang) Project: http://git-wip-us.apache.org/repos/asf/ambari/repo Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/55c0f792 Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/55c0f792 Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/55c0f792 Branch: refs/heads/trunk Commit: 55c0f792f76e16abd252d63bbf27d0f77c91adb4 Parents: f24531d Author: Xi Wang <xiw...@apache.org> Authored: Tue Apr 21 17:38:46 2015 -0700 Committer: Xi Wang <xiw...@apache.org> Committed: Tue Apr 21 17:38:54 2015 -0700 ---------------------------------------------------------------------- .../app/styles/enhanced_service_dashboard.less | 29 +++++++++++++------- .../templates/common/widget/gauge_widget.hbs | 6 ++-- .../templates/common/widget/graph_widget.hbs | 7 +++-- .../templates/common/widget/number_widget.hbs | 6 ++-- .../templates/common/widget/template_widget.hbs | 6 ++-- 5 files changed, 32 insertions(+), 22 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ambari/blob/55c0f792/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 78ea297..73ee1a3 100644 --- a/ambari-web/app/styles/enhanced_service_dashboard.less +++ b/ambari-web/app/styles/enhanced_service_dashboard.less @@ -60,22 +60,25 @@ margin: 5px 0 5px 5px; } .widget { + .thumbnail { + position: relative; + } .spinner { margin: 55px auto; } .title { - padding: 5px 0 0 5px; - height: 25px; + padding: 5px 0 0 1px; font-weight: bold; text-align: left; - position: relative; + height: 45px; + overflow: hidden; + text-overflow: ellipsis; } .content { text-align: center; color: @health-status-green; font-weight: bold; font-size: 35px; - position: relative; } .template-widget, .number-widget { @@ -133,20 +136,26 @@ .widget { .thumbnail .corner-icon { display: none; - position: relative; .icon-remove-sign{ color: #000000; text-shadow: #fff 0px 0px 15px; - position: relative; - left: -17px; - top: -11px; + position: absolute; + left: -7px; + top: -7px; } .icon-edit,.icon-copy{ color: #555555; - position: relative; + font-weight: bold; + text-shadow: #ffffff -8px 8px 10px; + background-color: rgba(255,255,255,0.6); + position: absolute; + padding: 5px 5px; + } + .icon-copy { + right: 25px; } .icon-edit { - left: 2px; + right: 5px; } } .thumbnail:hover { http://git-wip-us.apache.org/repos/asf/ambari/blob/55c0f792/ambari-web/app/templates/common/widget/gauge_widget.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/common/widget/gauge_widget.hbs b/ambari-web/app/templates/common/widget/gauge_widget.hbs index 3dd54c1..7ba1600 100644 --- a/ambari-web/app/templates/common/widget/gauge_widget.hbs +++ b/ambari-web/app/templates/common/widget/gauge_widget.hbs @@ -21,11 +21,11 @@ <a {{bindAttr class=":corner-icon :span1 view.parentView.isMoving:hidden"}} href="#" {{action hideWidget view.id target="view"}}> <i class="icon-remove-sign icon-large"></i> </a> - <div class="caption title span9">{{view.content.displayName}}</div> - <a class="corner-icon span1" href="#" {{action cloneWidget target="view"}}> + <div class="caption title span11">{{view.content.displayName}}</div> + <a class="corner-icon pull-right" href="#" {{action cloneWidget target="view"}}> <i class="icon-copy"></i> </a> - <a class="corner-icon span1" href="#" {{action editWidget target="view"}}> + <a class="corner-icon pull-right" href="#" {{action editWidget target="view"}}> <i class="icon-edit"></i> </a> <div class="content"> {{view view.chartView}}</div> http://git-wip-us.apache.org/repos/asf/ambari/blob/55c0f792/ambari-web/app/templates/common/widget/graph_widget.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/common/widget/graph_widget.hbs b/ambari-web/app/templates/common/widget/graph_widget.hbs index 9c1560f..6fffd92 100644 --- a/ambari-web/app/templates/common/widget/graph_widget.hbs +++ b/ambari-web/app/templates/common/widget/graph_widget.hbs @@ -21,13 +21,14 @@ <a {{bindAttr class=":corner-icon :span1 view.parentView.isMoving:hidden"}} href="#" {{action hideWidget view.id target="view"}}> <i class="icon-remove-sign icon-large"></i> </a> - <div class="caption title span9">{{view.content.displayName}}</div> - <a class="corner-icon span1" href="#" {{action cloneWidget target="view"}}> + <div class="caption title span11">{{view.content.displayName}}</div> + <a class="corner-icon pull-right" href="#" {{action cloneWidget target="view"}}> <i class="icon-copy"></i> </a> - <a class="corner-icon span1" href="#" {{action editWidget target="view"}}> + <a class="corner-icon pull-right" href="#" {{action editWidget target="view"}}> <i class="icon-edit"></i> </a> + <div class="content"> {{view view.graphView}}</div> {{else}} <div class="spinner"></div> http://git-wip-us.apache.org/repos/asf/ambari/blob/55c0f792/ambari-web/app/templates/common/widget/number_widget.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/common/widget/number_widget.hbs b/ambari-web/app/templates/common/widget/number_widget.hbs index d1bdc97..59c5420 100644 --- a/ambari-web/app/templates/common/widget/number_widget.hbs +++ b/ambari-web/app/templates/common/widget/number_widget.hbs @@ -21,11 +21,11 @@ <a {{bindAttr class=":corner-icon :span1 view.parentView.isMoving:hidden"}} href="#" {{action hideWidget view.id target="view"}}> <i class="icon-remove-sign icon-large"></i> </a> - <div class="caption title span9">{{view.content.displayName}}</div> - <a class="corner-icon span1" href="#" {{action cloneWidget target="view"}}> + <div class="caption title span11">{{view.content.displayName}}</div> + <a class="corner-icon pull-right" href="#" {{action cloneWidget target="view"}}> <i class="icon-copy"></i> </a> - <a class="corner-icon span1" href="#" {{action editWidget target="view"}}> + <a class="corner-icon pull-right" href="#" {{action editWidget target="view"}}> <i class="icon-edit"></i> </a> <div {{bindAttr class="view.contentColor :content"}}>{{view.value}}</div> http://git-wip-us.apache.org/repos/asf/ambari/blob/55c0f792/ambari-web/app/templates/common/widget/template_widget.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/common/widget/template_widget.hbs b/ambari-web/app/templates/common/widget/template_widget.hbs index c4f9597..0d5cc27 100644 --- a/ambari-web/app/templates/common/widget/template_widget.hbs +++ b/ambari-web/app/templates/common/widget/template_widget.hbs @@ -21,11 +21,11 @@ <a {{bindAttr class=":corner-icon :span1 view.parentView.isMoving:hidden"}} href="#" {{action hideWidget view.id target="view"}}> <i class="icon-remove-sign icon-large"></i> </a> - <div class="caption title span9">{{view.content.displayName}}</div> - <a class="corner-icon span1" href="#" {{action cloneWidget target="view"}}> + <div class="caption title span11">{{view.content.displayName}}</div> + <a class="corner-icon pull-right" href="#" {{action cloneWidget target="view"}}> <i class="icon-copy"></i> </a> - <a class="corner-icon span1" href="#" {{action editWidget target="view"}}> + <a class="corner-icon pull-right" href="#" {{action editWidget target="view"}}> <i class="icon-edit"></i> </a> <div class="content"> {{view.value}}</div>