Permalink
Browse files

added tooltips to the icon header links

  • Loading branch information...
1 parent fa26f2e commit 30d344a72afb28661ef4ad1069c8d38d906bf906 @enricoberti enricoberti committed Apr 9, 2012
Showing with 24 additions and 2 deletions.
  1. +24 −2 desktop/core/src/desktop/templates/common_header.html
@@ -39,6 +39,20 @@
body {
padding-top: {{padding}};
}
+ .tooltip.fade.bottom{
+ border-style: none;
+ background-color: transparent;
+
+
+ }
+ .tooltip{
+ margin-left: -10px;
+ margin-top: -10px;
+ }
+ .tooltip-inner{
+ margin-top: -10px;
+
+ }
</style>
<script src="/static/ext/js/jquery/jquery-1.7.1.min.js"></script>
@@ -50,6 +64,7 @@
<script src="/static/ext/js/jquery/plugins/jquery.simpleplaceholder.js"></script>
<script src="/static/ext/js/jquery/plugins/jquery.dataTables.1.8.2.min.js"></script>
<script src="/static/ext/js/bootstrap.min.js"></script>
+ <script src="/static/ext/js/bootstrap-tooltip.js"></script>
<script src="/static/ext/js/fileuploader.js"></script>
<script type="text/javascript" charset="utf-8">
@@ -65,18 +80,25 @@
});
$("#checkConfig").load("/debug/check_config_ajax");
});
+
+ function showTooltip(appDisplayName){
+ $('#' + appDisplayName + "Icon").tooltip({title:appDisplayName, placement:'bottom'})
+ $('#' + appDisplayName + "Icon").tooltip('show')
+ }
+
+
</script>
</head>
<body>
- <div class="navbar navbar-fixed-top">
+<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container-fluid">
<a class="brand" href="#">Hue 2</a>
<div class="nav-collapse">
<ul class="nav">
{% for app in apps %}
- <li {% is_selected section app.display_name %}><a href="/{{app.display_name}}">{%if app.icon_path%}<img width="25" height="25" src="{{app.icon_path}}"/>{%else%}{{app.nice_name}}{%endif%} </a></li>
+ <li id="{{app.display_name}}Icon" {% is_selected section app.display_name %}><a href="/{{app.display_name}}">{%if app.icon_path%}<img width="25" height="25" onmouseover="showTooltip('{{app.display_name}}')" src="{{app.icon_path}}"/>{%else%}{{app.nice_name}}{%endif%} </a></li>
{% endfor %}
<li class="divider-vertical"></li>
<li id="checkConfig"><li>

0 comments on commit 30d344a

Please sign in to comment.