[PATCH] ui: Add tooltip when hovering long names

If the storage pool or network names are very long strings, they are trimmed (e.g. "myverylongnetworkname" becomes something like "myverylo..."). If multiple names have the same prefixes, the user will not be able to distinguish them. Add tooltips displaying the full names when hovering storage pool and network names. Signed-off-by: Crístian Viana <vianac@linux.vnet.ibm.com> --- ui/pages/tabs/network.html.tmpl | 2 +- ui/pages/tabs/storage.html.tmpl | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/ui/pages/tabs/network.html.tmpl b/ui/pages/tabs/network.html.tmpl index 81c1566..83c1d7e 100644 --- a/ui/pages/tabs/network.html.tmpl +++ b/ui/pages/tabs/network.html.tmpl @@ -87,7 +87,7 @@ </div> <script id="networkItem" type="text/html"> <div id='{name}' class='item'> - <span class='column column-name cell'>{name}</span><!-- + <span class='column column-name cell' title="{name}">{name}</span><!-- --><span class='column column-state cell'><span class='network-state {state}'></span></span><!-- --><span class='column column-type cell'>{type}</span><!-- --><span class='column column-interface cell'>{interface}</span><!-- diff --git a/ui/pages/tabs/storage.html.tmpl b/ui/pages/tabs/storage.html.tmpl index b38eb63..6930c22 100644 --- a/ui/pages/tabs/storage.html.tmpl +++ b/ui/pages/tabs/storage.html.tmpl @@ -48,7 +48,7 @@ <li id="{name}"> <div class="storage-li in" data-name="{name}" data-stat="{state}"> <div class="storage-name"> - <span class="storage-title">{name}</span> + <span class="storage-title" title="{name}">{name}</span> <span class="storage-title usage">{usage}%</span> </div> <div class="storage-state"> -- 1.8.5.3

Reviewed-by: Leonardo Garcia <lagarcia@br.ibm.com> Tested-by: Leonardo Garcia <lagarcia@br.ibm.com> On 02/18/2014 10:58 AM, Crístian Viana wrote:
If the storage pool or network names are very long strings, they are trimmed (e.g. "myverylongnetworkname" becomes something like "myverylo..."). If multiple names have the same prefixes, the user will not be able to distinguish them.
Add tooltips displaying the full names when hovering storage pool and network names.
Signed-off-by: Crístian Viana <vianac@linux.vnet.ibm.com> --- ui/pages/tabs/network.html.tmpl | 2 +- ui/pages/tabs/storage.html.tmpl | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-)
diff --git a/ui/pages/tabs/network.html.tmpl b/ui/pages/tabs/network.html.tmpl index 81c1566..83c1d7e 100644 --- a/ui/pages/tabs/network.html.tmpl +++ b/ui/pages/tabs/network.html.tmpl @@ -87,7 +87,7 @@ </div> <script id="networkItem" type="text/html"> <div id='{name}' class='item'> - <span class='column column-name cell'>{name}</span><!-- + <span class='column column-name cell' title="{name}">{name}</span><!-- --><span class='column column-state cell'><span class='network-state {state}'></span></span><!-- --><span class='column column-type cell'>{type}</span><!-- --><span class='column column-interface cell'>{interface}</span><!-- diff --git a/ui/pages/tabs/storage.html.tmpl b/ui/pages/tabs/storage.html.tmpl index b38eb63..6930c22 100644 --- a/ui/pages/tabs/storage.html.tmpl +++ b/ui/pages/tabs/storage.html.tmpl @@ -48,7 +48,7 @@ <li id="{name}"> <div class="storage-li in" data-name="{name}" data-stat="{state}"> <div class="storage-name"> - <span class="storage-title">{name}</span> + <span class="storage-title" title="{name}">{name}</span> <span class="storage-title usage">{usage}%</span> </div> <div class="storage-state">
participants (3)
-
Aline Manera
-
Crístian Viana
-
Leonardo Augusto Guimarães Garcia