1 files changed, 47 insertions, 1 deletions

diff --git a/app/assets/stylesheets/framework/responsive-tables.scss b/app/assets/stylesheets/framework/responsive-tables.scss
index f0a4c66aa1a..d2c90908baa 100644
--- a/app/assets/stylesheets/framework/responsive-tables.scss
+++ b/app/assets/stylesheets/framework/responsive-tables.scss
@@ -36,13 +36,58 @@
         align-self: stretch;
         padding: 10px;
         align-items: center;
-        height: 62px;
+        min-height: 62px;
 
         &:not(:first-of-type) {
           border-top: 1px solid $white-normal;
         }
       }
     }
+
+    &.section-wrap {
+      white-space: normal;
+
+      @media (max-width: $screen-sm-max) {
+        flex-wrap: wrap;
+      }
+    }
+  }
+}
+
+
+.table-button-footer {
+  @media (min-width: $screen-md-min) {
+    text-align: right;
+  }
+
+  @media (max-width: $screen-sm-max) {
+    background-color: $gray-normal;
+    align-self: stretch;
+    border-top: 1px solid $border-color;
+
+    .table-action-buttons {
+      padding: 10px 5px;
+      display: flex;
+
+      .btn {
+        border-radius: 3px;
+      }
+
+      > .btn-group,
+      > .external-url,
+      > .btn {
+        flex: 1 1 28px;
+        margin: 0 5px;
+      }
+
+      .dropdown-new {
+        width: 100%;
+      }
+
+      .dropdown-menu {
+        min-width: initial;
+      }
+    }
   }
 }
 
@@ -56,6 +101,7 @@
 
 .table-mobile-header {
   color: $gl-text-color-secondary;
+  text-align: left;
   @include flex-max-width(40);
 
   @media (min-width: $screen-md-min) {