Merge branch '28230-new-mr-spacing' into 'master'

consistent padding on new MR panels

Closes #28230

See merge request !9568

5 files changed, 33 insertions, 60 deletions

diff --git a/app/assets/stylesheets/framework/lists.scss b/app/assets/stylesheets/framework/lists.scss
index 55ed4b7b06c..7adbb0a4188 100644
--- a/app/assets/stylesheets/framework/lists.scss
+++ b/app/assets/stylesheets/framework/lists.scss
@@ -229,44 +229,6 @@ ul.content-list {
   }
 }
 
-// Table list
-.table-list {
-  display: table;
-  width: 100%;
-
-  .table-list-row {
-    display: table-row;
-  }
-
-  .table-list-cell {
-    display: table-cell;
-    vertical-align: top;
-    padding: 10px 16px;
-    border-bottom: 1px solid $gray-darker;
-
-    &.avatar-cell {
-      width: 36px;
-      padding-right: 0;
-
-      img {
-        margin-right: 0;
-      }
-    }
-  }
-
-  &.table-wide {
-    .table-list-cell {
-      &:last-of-type {
-        padding-right: 0;
-      }
-
-      &:first-of-type {
-        padding-left: 0;
-      }
-    }
-  }
-}
-
 .panel > .content-list > li {
   padding: $gl-padding-top $gl-padding;
 }
diff --git a/app/assets/stylesheets/framework/panels.scss b/app/assets/stylesheets/framework/panels.scss
index efe93724013..9d8d08dff88 100644
--- a/app/assets/stylesheets/framework/panels.scss
+++ b/app/assets/stylesheets/framework/panels.scss
@@ -48,11 +48,3 @@
     line-height: inherit;
   }
 }
-
-.panel-default {
-  .table-list-row:last-child {
-    .table-list-cell {
-      border-bottom: 0;
-    }
-  }
-}
diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss
index c3d45d708c1..2029b6893ef 100644
--- a/app/assets/stylesheets/pages/commits.scss
+++ b/app/assets/stylesheets/pages/commits.scss
@@ -78,6 +78,7 @@
   padding: 5px 10px;
   background-color: $gray-light;
   border-bottom: 1px solid $gray-darker;
+  border-top: 1px solid $gray-darker;
   font-size: 14px;
 
   &:first-child {
@@ -117,10 +118,37 @@
   }
 }
 
+.commit.flex-list {
+  display: flex;
+}
+
+.avatar-cell {
+  width: 46px;
+  padding-left: 10px;
+
+  img {
+    margin-right: 0;
+  }
+}
+
+.commit-detail {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  flex-grow: 1;
+  padding-left: 10px;
+
+  .merge-request-branches & {
+    flex-direction: column;
+  }
+}
+
+.commit-content {
+  padding-right: 10px;
+}
+
 .commit-actions {
   @media (min-width: $screen-sm-min) {
-    width: 300px;
-    text-align: right;
     font-size: 0;
   }
 
diff --git a/app/assets/stylesheets/pages/merge_requests.scss b/app/assets/stylesheets/pages/merge_requests.scss
index f41eeb8ca45..d3496e19dde 100644
--- a/app/assets/stylesheets/pages/merge_requests.scss
+++ b/app/assets/stylesheets/pages/merge_requests.scss
@@ -240,8 +240,7 @@
 
   .commit {
     margin: 0;
-    padding-top: 2px;
-    padding-bottom: 2px;
+    padding: 10px 0;
     list-style: none;
 
     &:hover {
@@ -409,7 +408,7 @@
   }
 
   .panel-footer {
-    padding: 5px 10px;
+    padding: 0;
 
     .btn {
       min-width: auto;
diff --git a/app/assets/stylesheets/pages/tree.scss b/app/assets/stylesheets/pages/tree.scss
index 8d1063fc26f..fc4da4c495f 100644
--- a/app/assets/stylesheets/pages/tree.scss
+++ b/app/assets/stylesheets/pages/tree.scss
@@ -139,18 +139,10 @@
 .blob-commit-info {
   list-style: none;
   background: $gray-light;
-  padding: 6px 0;
+  padding: 16px 16px 16px 6px;
   border: 1px solid $border-color;
   border-bottom: none;
   margin: 0;
-
-  .table-list-cell {
-    border-bottom: none;
-  }
-
-  .commit-actions {
-    width: 260px;
-  }
 }
 
 #modal-remove-blob > .modal-dialog { width: 850px; }