Merge branch '32720-emoji-spacing' into 'master'

32720 Create equal spacing between emoji buttons and remove unnecessary margin-bottom

Closes #32720

See merge request !11889

4 files changed, 23 insertions, 10 deletions

diff --git a/app/assets/stylesheets/framework/awards.scss b/app/assets/stylesheets/framework/awards.scss
index 75907c35b7e..19166757e64 100644
--- a/app/assets/stylesheets/framework/awards.scss
+++ b/app/assets/stylesheets/framework/awards.scss
@@ -1,4 +1,7 @@
 .awards {
+  display: flex;
+  flex-wrap: wrap;
+
   .emoji-icon {
     width: 20px;
     height: 20px;
@@ -100,7 +103,6 @@
 
 .award-menu-holder {
   display: inline-block;
-  position: absolute;
 
   .tooltip {
     white-space: nowrap;
@@ -108,9 +110,11 @@
 }
 
 .award-control {
-  margin: 0 5px 6px 0;
+  margin: 4px 8px 4px 0;
   outline: 0;
   position: relative;
+  display: block;
+  float: left;
 
   &.disabled {
     cursor: default;
diff --git a/app/assets/stylesheets/pages/issuable.scss b/app/assets/stylesheets/pages/issuable.scss
index 75e0cd6eaa6..b3f310ff67d 100644
--- a/app/assets/stylesheets/pages/issuable.scss
+++ b/app/assets/stylesheets/pages/issuable.scss
@@ -58,7 +58,7 @@
   }
 
   .emoji-block {
-    padding: 10px 0 4px;
+    padding: 10px 0;
   }
 }
 
diff --git a/app/assets/stylesheets/pages/issues.scss b/app/assets/stylesheets/pages/issues.scss
index 702e7662527..f923a1104a9 100644
--- a/app/assets/stylesheets/pages/issues.scss
+++ b/app/assets/stylesheets/pages/issues.scss
@@ -249,14 +249,19 @@ ul.related-merge-requests > li {
 }
 
 @media (min-width: $screen-sm-min) {
-  .new-branch-col {
-    padding-top: 0;
-    text-align: right;
-  }
+  .emoji-block .row {
+    display: flex;
 
-  .create-mr-dropdown-wrap {
-    .btn-group:not(.hide) {
-      display: inline-block;
+    .new-branch-col {
+      padding-top: 0;
+      text-align: right;
+      align-self: center;
+    }
+
+    .create-mr-dropdown-wrap {
+      .btn-group:not(.hide) {
+        display: inline-block;
+      }
     }
   }
 }
diff --git a/changelogs/unreleased/32720-emoji-spacing.yml b/changelogs/unreleased/32720-emoji-spacing.yml
new file mode 100644
index 00000000000..da3df0f9093
--- /dev/null
+++ b/changelogs/unreleased/32720-emoji-spacing.yml
@@ -0,0 +1,4 @@
+---
+title: Create equal padding for emoji
+merge_request:
+author: