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>

Reply via email to