Refine user menu CSS

This commit is contained in:
John Firebaugh 2013-10-01 17:06:28 -07:00
parent a8b68a751e
commit d359cd70f1
3 changed files with 27 additions and 23 deletions

View file

@ -392,11 +392,17 @@ nav.secondary {
position: absolute; position: absolute;
right: 0; right: 0;
> ul a { > ul {
margin-right: 10px;
}
> ul a,
.dropdown-toggle {
display: inline-block;
font-weight: bold; font-weight: bold;
text-decoration: none; text-decoration: none;
color: $darkgrey; color: $darkgrey;
padding-right: 10px; padding: 5px 5px;
} }
.dropdown { .dropdown {
@ -404,27 +410,26 @@ nav.secondary {
border-radius: 4px; border-radius: 4px;
} }
img { .caret {
vertical-align: top; border-top-color: $grey;
border-radius: 2px 0 0 2px; margin-top: 10px;
margin-right: 5px; margin-right: 5px;
} }
img.user_thumbnail_tiny {
border: 0;
vertical-align: top;
margin: 2px 0 0 3px;
border-radius: 2px 0 0 2px;
}
#inboxanchor { #inboxanchor {
display: inline-block; display: inline-block;
position: relative; vertical-align: top;
height: 20px; height: 20px;
top: -2px; margin: 2px 7px 0 0;
margin: 0 2px 0 0; background-color: $grey;
padding: 0 5px 0 0; border-radius: 0 2px 2px 0;
border-radius: 2px;
}
.dropdown-toggle {
display: block;
padding: 3px 7px;
color: #000;
text-decoration: none;
} }
.dropdown-menu { .dropdown-menu {
@ -713,7 +718,7 @@ nav.secondary {
} }
.leaflet-top.leaflet-right { .leaflet-top.leaflet-right {
top: 10px !important; top: $lineheight !important;
.leaflet-control { .leaflet-control {
margin-right: 0px !important; margin-right: 0px !important;
margin-top: 0px !important; margin-top: 0px !important;

View file

@ -1,3 +1 @@
<span id="inboxanchor" class="count-number"> <span id="inboxanchor" class="count-number"><%= @user.new_messages.size %></span>
<%= user_thumbnail_tiny(@user, :size => 20, :width => 20, :height => 20) %><span><%= @user.new_messages.size %></span>
</span>

View file

@ -1,7 +1,8 @@
<div class='dropdown'> <div class='dropdown'>
<a class='dropdown-toggle' data-toggle='dropdown' href="#"> <a class='dropdown-toggle' data-toggle='dropdown' href="#">
<%= render :partial => 'layouts/inbox' %> <%= user_thumbnail_tiny(@user, :size => 20, :width => 20, :height => 20)
<%= @user.display_name %> %><%= render :partial => 'layouts/inbox'
%><span class='username'><%= @user.display_name %></span>
<b class="caret"></b> <b class="caret"></b>
</a> </a>
<ul class='dropdown-menu'> <ul class='dropdown-menu'>