issues detail navigation

app/partials/issues-detail.jade

@@ -12,10 +12,12 @@ block content
                 a.button.button-green(href="", title="Edit") Edit
             section.us-story-main-data
                 div.us-title
-                    h2
+                    h2.us-title-text
                         span.us-number(tg-bo-html="issue.ref")
                         span.us-name(ng-bind="issue.subject")
-
+                    div.issue-nav
+                        a.icon.icon-arrow-left(href="", title="next issue")
+                        a.icon.icon-arrow-right(href="", title="previous issue")
                 // div.blocked-warning
                 //     span.icon.icon-warning
                 //     p.blocked Blocked!

app/styles/layout/us-detail.scss

@@ -16,13 +16,23 @@
         background: $whitish;
         margin-bottom: 1rem;
         padding: 2rem 1rem;
-        text-transform: uppercase;
+        position: relative;
+        .us-title-text {
+            margin-bottom: 0;
+        }
         .us-number {
             color: $gray-light;
             margin-right: .5rem;
         }
         .us-name {
             color: $grayer;
+            display: inline-block;
+            line-height: 1.5rem;
+            max-width: 80%;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            text-transform: uppercase;
+            white-space: nowrap;
         }
     }
     .blocked-warning {
@@ -56,6 +66,15 @@
     }
 }
 
+.issue-nav {
+    position: absolute;
+    right: 1rem;
+    top: 2rem;
+    a {
+        @extend %xlarge;
+    }
+}
+
 .us-content {
     ul {
         margin-left: 1rem;