From 3f488cbf0d8d8aac7fe7800d3b1b38e9dc1bd9ef Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Xavier=20Juli=C3=A1n?= <xavier.julian@kaleidos.net>
Date: Mon, 23 Jun 2014 10:34:06 +0200
Subject: [PATCH] Blocked module

---
 app/partials/us-detail.jade             |  3 ++-
 app/styles/components/buttons.scss      |  9 ++++++++
 app/styles/dependencies/typography.scss |  4 ++--
 app/styles/layout/us-detail.scss        | 29 +++++++++++++++++++++++++
 4 files changed, 42 insertions(+), 3 deletions(-)

diff --git a/app/partials/us-detail.jade b/app/partials/us-detail.jade
index 6a6a9f48..812685a9 100644
--- a/app/partials/us-detail.jade
+++ b/app/partials/us-detail.jade
@@ -18,7 +18,8 @@ block content
                 div.blocked-warning
                     span.icon.icon-warning
                     p.blocked Blocked!
-                    p
+                    p We need Pilar to make a prototype out of this or we are not sure what to show at this part.
+                    a.button.button-red.button-block(href="", title="Unblock US") Unblock
                 div.user-story-tags
                     - for(var y = 0; y < 6; y++)
                         include views/components/tag
diff --git a/app/styles/components/buttons.scss b/app/styles/components/buttons.scss
index 0cebeec2..00aa30d1 100755
--- a/app/styles/components/buttons.scss
+++ b/app/styles/components/buttons.scss
@@ -59,6 +59,15 @@
     }
 }
 
+a.button-block {
+    background: $white;
+    color: $red;
+    &:hover {
+        background: $red-light;
+        color: $white;
+    }
+}
+
 .button-bulk {
     @extend %button;
     background: $green-taiga;
diff --git a/app/styles/dependencies/typography.scss b/app/styles/dependencies/typography.scss
index 470494db..75a28d83 100755
--- a/app/styles/dependencies/typography.scss
+++ b/app/styles/dependencies/typography.scss
@@ -196,8 +196,8 @@ a:visited {
     content: 'z';
 }
 .icon-graph:before {
-    content: "B";
+    content: 'B';
 }
 .icon-warning:before {
-    content: "C";
+    content: 'C';
 }
diff --git a/app/styles/layout/us-detail.scss b/app/styles/layout/us-detail.scss
index e17a41a2..9a86a3f8 100644
--- a/app/styles/layout/us-detail.scss
+++ b/app/styles/layout/us-detail.scss
@@ -7,6 +7,7 @@
         top: 0;
     }
 }
+
 .us-story-main-data {
     margin-bottom: 2rem;
     .us-title {
@@ -22,6 +23,34 @@
             color: $grayer;
         }
     }
+    .blocked-warning {
+        background: $red;
+        color: $white;
+        margin-bottom: 1rem;
+        padding: 1rem;
+        position: relative;
+        .icon {
+            @extend %xxlarge;
+            display: inline;
+            left: 1rem;
+            position: absolute;
+            top: 1rem;
+        }
+        .blocked {
+            @extend %xlarge;
+            margin-bottom: .3em;
+        }
+        p {
+            margin-bottom: 0;
+            margin-left: 4rem;
+            margin-right: 10rem;
+        }
+        .button-block {
+            position: absolute;
+            right: 1rem;
+            top: 1rem;
+        }
+    }
 }
 
 .us-content {