Improve styling of inbox counter in greeting bar

diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index b5e7af5dd1e64c7120452583f42af481b571ca41..8a848e9ee58395b9640346230c17ec6c4fed9c2f 100644 (file)
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -309,6 +309,15 @@ h2 {
   text-decoration: none;
 }
 
   text-decoration: none;
 }
 

+.count-number {
+  padding: 2px 5px;
+  border-radius: 3px;
+  background: #eee;
+  margin: 0 2px;
+  font-size: 11px;
+  color: #333;
+}
+

 /* Rules for greeting bar in the top right corner */
 
 #greeting {
 /* Rules for greeting bar in the top right corner */
 
 #greeting {

diff --git a/app/views/layouts/_inbox.html.erb b/app/views/layouts/_inbox.html.erb
index 18716618fa7e828958986542b5be73ba6f8766ea..2af76f9ed29e357ecbd6871c9f593e9fde0e43ec 100644 (file)
--- a/app/views/layouts/_inbox.html.erb
+++ b/app/views/layouts/_inbox.html.erb
@@ -1,7 +1,7 @@
-<%
-inbox_attributes = {}
-inbox_attributes[:id] = "inboxanchor"
-inbox_attributes[:class] = 'greeting-bar-unread' if @user.new_messages.size > 0
-inbox_attributes[:title] = t 'layouts.inbox_tooltip', :count => @user.new_messages.size
-%>
-<%= link_to t('layouts.inbox', :count => @user.new_messages.size), {:controller => 'message', :action => 'inbox', :display_name => @user.display_name}, inbox_attributes %>
+<%= link_to raw(t('layouts.inbox',
+    :count => @user.new_messages.size > 0 ? "<span class='count-number'>#{@user.new_messages.size}</span>" : '')),
+    {
+        :action => 'inbox',
+        :display_name => @user.display_name,
+        :controller => 'message'
+    }, { :id => 'inboxanchor' } %>

diff --git a/config/locales/en.yml b/config/locales/en.yml
index e89158f2fae13d538ff86fff60e50b10ebd4ee1a..76beb030a06e5a76da3e3de25f64f7d5e92472f3 100644 (file)
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -948,7 +948,7 @@ en:
     welcome_user_link_tooltip: Your user page
     home: home
     home_tooltip: Go to home location
     welcome_user_link_tooltip: Your user page
     home: home
     home_tooltip: Go to home location

-    inbox: "inbox (%{count})"
+    inbox: "inbox %{count}"

     inbox_tooltip:
       zero: Your inbox contains no unread messages
       one: Your inbox contains 1 unread message
     inbox_tooltip:
       zero: Your inbox contains no unread messages
       one: Your inbox contains 1 unread message