make the view responsive for extra small device

1 files changed, 20 insertions, 0 deletions

diff --git a/app/assets/stylesheets/pages/labels.scss b/app/assets/stylesheets/pages/labels.scss
index 1d5d402ba04..e77d43fa29c 100644
--- a/app/assets/stylesheets/pages/labels.scss
+++ b/app/assets/stylesheets/pages/labels.scss
@@ -52,6 +52,10 @@
   .label-name {
     display: inline-block;
     width: 21%;
+
+    @media (max-width: $screen-xs-min) {
+      display: block;
+    }
   }
 
   .label {
@@ -80,10 +84,21 @@
   .prepend-left-10 {
     display: inline-block;
     width: 45%;
+
+    @media (max-width: $screen-xs-min) {
+      display: block;
+      width: 100%;
+      margin-left: 0px;
+      padding: 10px 0;
+    }
   }
 
   .pull-right {
 
+    @media (max-width: $screen-xs-min) {
+     float: none !important;
+    }
+
     .action-buttons {
       border-color: transparent;
       margin: 7px;
@@ -97,6 +112,11 @@
       a {
         color: $gl-text-color;
       }
+
+      @media (max-width: $screen-xs-min) {
+        display: block;
+        margin-bottom: 10px;
+      }
     }
   }
 }