UX: Post action button simplifications (#34141)

app/assets/stylesheets/common/base/topic-post.scss

@@ -449,14 +449,6 @@ nav.post-controls {
     }
 
     button {
-      flex: 0 1 auto;
-      font-size: var(--font-up-1);
-      padding: 8px 10px;
-      vertical-align: top;
-      background: transparent;
-      border: none;
-      border-radius: var(--d-post-control-border-radius);
-
       .discourse-no-touch & {
         &:hover,
         &:focus-visible,
@@ -491,7 +483,6 @@ nav.post-controls {
       }
 
       &.create {
-        margin-right: 0;
         color: var(--d-post-control-create-text-color);
 
         .d-icon {

app/assets/stylesheets/common/components/buttons.scss

@@ -342,8 +342,6 @@
 /* Bonus Buttons */
 .btn-flat {
   background: var(--d-button-flat-bg-color);
-  border: 0;
-  line-height: var(--line-height-small);
   transition: var(--d-button-transition);
 
   .d-icon {

app/assets/stylesheets/desktop/topic-list.scss

@@ -58,6 +58,7 @@
 
   button.bulk-select {
     padding: 0;
+    border: 0;
     margin-right: var(--space-2);
     line-height: var(--line-height-large);
   }

app/assets/stylesheets/desktop/topic-post.scss

@@ -78,27 +78,13 @@ section.post-menu-area {
 }
 
 nav.post-controls {
-  // for consistency, try to control spacing by editing these variables
-  --control-margin: 0.33em;
-  --control-icon-space: 0.33em;
-
   .actions {
+    gap: var(--space-1);
+  }
+
+  @include viewport.until(sm) {
     button {
-      margin-left: var(--control-margin);
-
-      &.btn-icon-text,
-      &.create {
-        margin-left: calc(var(--control-margin) * 1.52);
-
-        .d-icon {
-          margin-right: var(--control-icon-space);
-        }
-      }
-    }
-
-    // Some buttons can be doubled up, like likes or flags
-    .double-button {
-      margin-left: var(--control-margin);
+      font-size: var(--font-up-1);
     }
   }
 
@@ -113,11 +99,6 @@ nav.post-controls {
       margin-right: var(--space-2);
     }
 
-    .d-icon {
-      margin-inline: var(--control-icon-space);
-      margin-left: 0;
-    }
-
     &[aria-expanded="true"] {
       background: var(--primary-low);
       color: var(--primary-high);