Wrap note actions below timestamp on discussions31727-timestamps-in-merge-request-discussion-overflow-role-badge

1 files changed, 13 insertions, 1 deletions

diff --git a/app/assets/stylesheets/pages/notes.scss b/app/assets/stylesheets/pages/notes.scss
index f89150ebead..259bc09b997 100644
--- a/app/assets/stylesheets/pages/notes.scss
+++ b/app/assets/stylesheets/pages/notes.scss
@@ -111,9 +111,12 @@ ul.notes {
     }
 
     .note-header {
-      padding-bottom: 8px;
       padding-right: 20px;
 
+      & > div {
+        padding-bottom: 8px;
+      }
+
       @media (min-width: $screen-sm-min) {
         padding-right: 0;
       }
@@ -365,6 +368,10 @@ ul.notes {
 .note-header {
   display: flex;
   justify-content: space-between;
+
+  @media (max-width: $screen-xs-max) {
+    flex-flow: row wrap;
+  }
 }
 
 .note-header-info {
@@ -416,6 +423,11 @@ ul.notes {
   margin-left: 10px;
   color: $gray-darkest;
 
+  @media (max-width: $screen-xs-max) {
+    float: none;
+    margin-left: 0;
+  }
+
   .note-action-button {
     margin-left: 8px;
   }