logined user panel tooltips

static/client/css/main.css

@@ -14324,3 +14324,24 @@ h1 .preview_toggle:hover{
     font-weight: 100;
     margin: 0 0 15px;
 }
+
+[data-tooltip]{
+    position: relative;
+}
+
+[data-tooltip]:hover:before{
+    content: attr(data-tooltip);
+    position: absolute;
+    background-color: #666666;
+    color: #ffffff;
+    top: -26px;
+    left: 50%;
+    -webkit-transform: translateX(-50%);
+        -ms-transform: translateX(-50%);
+         -o-transform: translateX(-50%);
+            transform: translateX(-50%);
+    padding: 0 10px;
+    font-size: 12px;
+    line-height: 22px;
+    white-space: nowrap;
+}

templates/client/includes/header.html

@@ -89,24 +89,30 @@
 
                                 <div class="clb-settings">
 {#                                    <a class="cl-btn icon-gear" href="/profile/settings/">{% trans 'настройки' %}</a>#}
-                                    <a href="/profile/settings/"><i class="fa fa-cog"></i></a>
+                                    <a href="/profile/settings/" data-tooltip="{% trans 'Настройки' %}">
+                                        <i class="fa fa-cog"></i>
+                                    </a>
                                     {% if user.is_superuser %}
-                                        <a href="/admin/"><i class="fa fa-lock"></i></a>
+                                        <a href="/admin/" data-tooltip="{% trans 'Админпанель' %}"><i class="fa fa-lock"></i></a>
                                     {% endif %}
                                 </div>
 
                                 <div class="clb-messages">
 {#                                    <a class="icon-msg" style="float: left;" href="/profile/messages/">{% if messages_inbox_count %} {{ messages_inbox_count }} {% endif %}</a>#}
 {#                                    <a href="{% url 'accounts-mailing_settings' %}" style="font-size: 18px" target="_blank">@</a>#}
-                                    <a style="float: left;" href="/profile/messages/"><i class="fa fa-envelope-o"></i>{% if messages_inbox_count %} {{ messages_inbox_count }} {% endif %}</a>
+                                    <a style="float: left;" href="/profile/messages/" data-tooltip="{% trans 'Сообщения' %}">
-                                    <a href="{% url 'accounts-mailing_settings' %}" style="font-size: 18px" target="_blank"><i class="fa fa-at"></i></a>
+                                        <i class="fa fa-envelope-o"></i>{% if messages_inbox_count %} {{ messages_inbox_count }} {% endif %}
+                                    </a>
+                                    <a href="{% url 'accounts-mailing_settings' %}" style="font-size: 18px" target="_blank" data-tooltip="{% trans 'Настройки рассылки' %}">
+                                        <i class="fa fa-at"></i>
+                                    </a>
                                 </div>
 
                                 <div class="clb-docs">
 {#									<a class="cl-btn icon-cal" href="{% url 'account_calendar' %}">{% trans 'календарь' %}</a>#}
 {#									<a class="cl-btn icon-doc" href="/profile/feed/">{% trans 'документы' %}</a>#}
-                                    <a href="{% url 'account_calendar' %}"><i class="fa fa-calendar"></i></a>
+                                    <a href="{% url 'account_calendar' %}" data-tooltip="{% trans 'Календарь' %}"><i class="fa fa-calendar"></i></a>
-									<a href="/profile/feed/"><i class="fa fa-file-text-o"></i></a>
+									<a href="/profile/feed/" data-tooltip="{% trans 'Документы' %}"><i class="fa fa-file-text-o"></i></a>
 								</div>
 
                                 <div class="clb-profile">