Make ui-box-show more visible. Refactor some css classes

6 files changed, 30 insertions, 27 deletions

diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
index a3156ec10fc..dc36d6f7923 100644
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@ -140,27 +140,6 @@ p.time {
   border-bottom: 2px solid #F90;
 }
 
-.status_info {
-  font-size: 14px;
-  padding: 5px 15px;
-  line-height: 26px;
-  text-align: center;
-  float: right;
-  position: relative;
-  top: -5px;
-  @include border-radius(4px);
-
-  &.success {
-    background: #4A4;
-    color: #FFF;
-  }
-
-  &.error {
-    background: #DA4E49;
-    color: #FFF;
-  }
-}
-
 .thin_area{
   height: 150px;
 }
diff --git a/app/assets/stylesheets/gitlab_bootstrap/blocks.scss b/app/assets/stylesheets/gitlab_bootstrap/blocks.scss
index f0a77bb8add..1493367317f 100644
--- a/app/assets/stylesheets/gitlab_bootstrap/blocks.scss
+++ b/app/assets/stylesheets/gitlab_bootstrap/blocks.scss
@@ -34,6 +34,8 @@
   &.ui-box-show {
     margin:20px 0;
     background: #FFF;
+    box-shadow: inset 0 1px 0 #fff, 0 1px 5px #f1f1f1;
+    @include linear-gradient(#fafafa, #f1f1f1);
 
     .control-group {
       margin-bottom: 0;
diff --git a/app/assets/stylesheets/gitlab_bootstrap/common.scss b/app/assets/stylesheets/gitlab_bootstrap/common.scss
index bc6c786da50..e7780b9c510 100644
--- a/app/assets/stylesheets/gitlab_bootstrap/common.scss
+++ b/app/assets/stylesheets/gitlab_bootstrap/common.scss
@@ -87,3 +87,24 @@ pre.well-pre {
   font-weight: bold;
   @include box-shadow(inset 0 2px 4px rgba(0,0,0,.15));
 }
+
+/** Big Labels **/
+.state-label {
+  font-size: 14px;
+  padding: 5px 15px;
+  text-align: center;
+  float: right;
+  position: relative;
+  top: -5px;
+  @include border-radius(4px);
+
+  &.state-label-green {
+    background: #4A4;
+    color: #FFF;
+  }
+
+  &.state-label-red {
+    background: #DA4E49;
+    color: #FFF;
+  }
+}
diff --git a/app/views/projects/issues/show.html.haml b/app/views/projects/issues/show.html.haml
index 6d1a088721c..d08a8af2bb9 100644
--- a/app/views/projects/issues/show.html.haml
+++ b/app/views/projects/issues/show.html.haml
@@ -32,7 +32,7 @@
   .ui-box-head
     %h4.box-title
       - if @issue.closed?
-        .error.status_info Closed
+        .state-label.state-label-red Closed
       = gfm escape_once(@issue.title)
 
   .ui-box-body
diff --git a/app/views/projects/merge_requests/show/_mr_box.html.haml b/app/views/projects/merge_requests/show/_mr_box.html.haml
index 1f750e22c65..93ae602a696 100644
--- a/app/views/projects/merge_requests/show/_mr_box.html.haml
+++ b/app/views/projects/merge_requests/show/_mr_box.html.haml
@@ -3,11 +3,12 @@
     %h4.box-title
       = gfm escape_once(@merge_request.title)
       - if @merge_request.merged?
-        .success.status_info
+        .state-label.state-label-green
           %i.icon-ok
           Merged
       - elsif @merge_request.closed?
-        .error.status_info Closed
+        .state-label.state-label-red
+          Closed
 
   .ui-box-body
     %div
@@ -32,7 +33,7 @@
       %span
         %i.icon-remove
         Closed by #{link_to_member(@project, @merge_request.closed_event.author)}
-        %small #{time_ago_in_words(@merge_request.closed_event.created_at)} ago.
+        %span #{time_ago_in_words(@merge_request.closed_event.created_at)} ago.
   - if @merge_request.merged?
     .ui-box-bottom.alert-success
       %span
diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml
index dc7fd40d5e3..2e115026ed3 100644
--- a/app/views/projects/milestones/show.html.haml
+++ b/app/views/projects/milestones/show.html.haml
@@ -26,9 +26,9 @@
   .ui-box-head
     %h4.box-title
       - if @milestone.closed?
-        .error.status_info Closed
+        .state-label.state-label-red Closed
       - elsif @milestone.expired?
-        .error.status_info Expired
+        .state-label.state-label-red Expired
 
       = gfm escape_once(@milestone.title)