More expressive user top menu

app/assets/javascripts/user/app/templates/application.emblem

@@ -11,20 +11,21 @@ header.top-menu
           App.MenuItemListNeedsHelpView
           App.MenuItemListNeedsPaymentView
         App.MenuItemProductOrdersView
-      section.extra-info
-        if list
-          .supplier-info-row
-            .supplier-name= list.supplier.name
-            .table-number
-              |# 
-              = list.table.number
-          .supplier-info-row
-            .counter.supplier-orders-placed-count
-              = list.supplier.orders_placed_count
-              span.orders-placed-count-icon
-            .counter.supplier-orders-in-process-count
-              = list.supplier.orders_in_process_count
-              span.orders-in-process-count-icon
+  if list
+    .extra-info
+      .supplier-info-row
+        / .supplier-name= list.supplier.name
+        .table-number
+          |# 
+          = list.table.number
+      .supplier-info-row
+        .counter.supplier-orders-placed-count
+          = list.supplier.orders_placed_count
+          span.orders-placed-count-icon
+      .supplier-info-row
+        .counter.supplier-orders-in-process-count
+          = list.supplier.orders_in_process_count
+          span.orders-in-process-count-icon
 aside.side-menu
   ul
     li.title: h3 Menu

app/assets/stylesheets/user/foundation/components/_menu_main.css.sass

@@ -32,25 +32,29 @@ header.top-menu
       line-height: 48px
       &.main-buttons
         float: left
+        font-size: 1.5em
         @media #{$medium-up}
           padding-left: 14px
-      &.extra-info
-        float: right
-        .supplier-info-row
-          float: right
-          clear: right
-          line-height: 27px
-          padding-right: 7px
-        .table-number
-          display: inline-block
-          //text-transform: lowercase
-        .supplier-name
-          display: inline-block
-        .supplier-orders-placed-count
-          display: inline-block
-          margin-right: 15px
-        .supplier-orders-in-process-count
-          display: inline-block
+  .extra-info
+    position: absolute
+    top: 0
+    right: 0
+    color: white
+    .supplier-info-row
+      // float: right
+      // clear: right
+      // line-height: 27px
+      // padding-right: 7px
+    .table-number
+      display: inline-block
+      //text-transform: lowercase
+    .supplier-name
+      display: inline-block
+    .supplier-orders-placed-count
+      display: inline-block
+      // margin-right: 15px
+    .supplier-orders-in-process-count
+      display: inline-block
   .menu-list-item
     margin-left: 20px
     cursor: pointer
@@ -59,7 +63,7 @@ header.top-menu
     border-radius: 0.1em
     display: inline-block
     line-height: 1em
-    margin-top: 10px
+    margin-top: 6px
     color: #999
     &.active
       color: $current-color