Improve top nav

app/assets/stylesheets/main.css.scss

@@ -47,7 +47,7 @@ h2 {
   left: 0;
 }
 
-#menu {
+#topnav {
   display: block;
   width: 300px;
   position: absolute;
@@ -57,17 +57,22 @@ h2 {
   font-family: Verdana;
 }
 
-#menu .links {
+#session-info {
   background-color: #172322;
   list-style: none;
   padding: 10px;
   border-bottom-left-radius: 10px;
-}
 
-#menu .links li {
-  color: #eee;
-  display: inline-block;
-  margin-right: 20px;
+  li {
+    color: #eee;
+    display: inline-block;
+    margin-right: 20px;
+  }
+
+  .avatar {
+    width: 24px;
+    height: 24px;
+  }
 }
 
 #all {

app/views/layouts/_session_info.html.erb

@@ -0,0 +1,11 @@
+<ul id="session-info">
+  <% if current_user %>
+    <li>
+      <%= avatar_img current_user %>
+      <%= link_to "Sign out", logout_path %>
+    </li>
+  <% else %>
+    <li><%= link_to "Twitter Sign in", twitter_auth_path %></li>
+    <li><%= link_to "Github Sign in", github_auth_path %></li>
+  <% end %>
+</ul>

app/views/layouts/application.html.erb

@@ -13,15 +13,8 @@
       <div id="logo">
         <h1>ascii.io</h1>
       </div>
-      <div id="menu">
-        <ul class="links">
-          <% if current_user %>
-            <li><%= link_to "Sign out", logout_path %></li>
-          <% else %>
-            <li><%= link_to "Twitter Sign in", twitter_auth_path %></li>
-            <li><%= link_to "Github Sign in", github_auth_path %></li>
-          <% end %>
-        </ul>
+      <div id="topnav">
+        <%= render :partial => 'layouts/session_info' %>
       </div>
     </div>
     <div id="main">