DEV: flexify post actions (#9926)

DEV: flexify post actions (#9926)

  • DEV: flexify post actions

  • more tweaks

diff --git a/app/assets/javascripts/discourse/app/widgets/post-menu.js b/app/assets/javascripts/discourse/app/widgets/post-menu.js
index d014a67..be4bc89 100644
--- a/app/assets/javascripts/discourse/app/widgets/post-menu.js
+++ b/app/assets/javascripts/discourse/app/widgets/post-menu.js
@@ -395,7 +395,7 @@ function replaceButton(buttons, find, replace) {
 }
 
 export default createWidget("post-menu", {
-  tagName: "section.post-menu-area.clearfix",
+  tagName: "section.post-menu-area",
 
   settings: {
     collapseButtons: true,
@@ -573,7 +573,7 @@ export default createWidget("post-menu", {
 
     const contents = [
       h(
-        "nav.post-controls.clearfix" +
+        "nav.post-controls" +
           (this.state.collapsed ? ".collapsed" : ".expanded"),
         postControls
       )
diff --git a/app/assets/stylesheets/common/components/buttons.scss b/app/assets/stylesheets/common/components/buttons.scss
index 643975e..cc2a7d0 100644
--- a/app/assets/stylesheets/common/components/buttons.scss
+++ b/app/assets/stylesheets/common/components/buttons.scss
@@ -264,6 +264,11 @@
   .d-icon {
     color: $primary-low-mid;
   }
+
+  .d-button-label + .d-icon {
+    margin-left: 0.5em;
+  }
+
   @include hover {
     .d-icon {
       color: $primary;
diff --git a/app/assets/stylesheets/common/printer-friendly.scss b/app/assets/stylesheets/common/printer-friendly.scss
index ce0d468..8fb6348 100644
--- a/app/assets/stylesheets/common/printer-friendly.scss
+++ b/app/assets/stylesheets/common/printer-friendly.scss
@@ -6,7 +6,7 @@
   header,
   .topic-above-post-stream-outlet.topic-above-post-stream,
   .topic-map,
-  .post-menu-area.clearfix,
+  .post-menu-area,
   div#topic-footer-buttons,
   div.suggested-topics,
   div#progress-topic-wrapper,
diff --git a/app/assets/stylesheets/desktop/topic-post.scss b/app/assets/stylesheets/desktop/topic-post.scss
index ed1b906..5b7a77a 100644
--- a/app/assets/stylesheets/desktop/topic-post.scss
+++ b/app/assets/stylesheets/desktop/topic-post.scss
@@ -52,11 +52,15 @@ section.post-menu-area {
 
 nav.post-controls {
   padding: 0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
 
   .actions {
-    text-align: right;
-    float: right;
-    display: inline-block;
+    display: flex;
+    justify-content: flex-end;
+    margin-left: auto;
+
     .more-actions {
       display: none;
       overflow: hidden;
diff --git a/app/assets/stylesheets/mobile/topic-post.scss b/app/assets/stylesheets/mobile/topic-post.scss
index 7031810..7dea3ab 100644
--- a/app/assets/stylesheets/mobile/topic-post.scss
+++ b/app/assets/stylesheets/mobile/topic-post.scss
@@ -28,6 +28,8 @@ span.badge-posts {
 
 .topic-post {
   nav.post-controls {
+    display: flex;
+
     color: dark-light-choose($primary-low-mid, $secondary-high);
     .actions {
       display: flex;

GitHub sha: 6ef0e98f

This commit appears in #9926 which was approved by awesomerobot. It was merged by SamSaffron.