fix: show avatar and badges in reply placeholder composing state on mobile (#4533)

Fixes #4513

Author: imorland

framework/core/js/src/forum/components/ReplyPlaceholder.tsx

@@ -30,12 +30,12 @@ export default class ReplyPlaceholder<CustomAttrs extends IReplyPlaceholderAttrs
           <div className="Post-container">
             <div className="Post-side">
               <Avatar user={app.session.user} className="Post-avatar" />
+              <ul className="PostUser-badges badges badges--packed">{listItems(app.session.user!.badges().toArray())}</ul>
             </div>
             <div className="Post-main">
               <header className="Post-header">
                 <div className="PostUser">
                   <h3 className="PostUser-name">{username(app.session.user)}</h3>
-                  <ul className="PostUser-badges badges badges--packed">{listItems(app.session.user!.badges().toArray())}</ul>
                 </div>
               </header>
               <div className="Post-body">

framework/core/less/forum/Post.less

@@ -386,6 +386,26 @@
       margin-left: -13px;
     }
   }
+  .CommentPost.editing {
+    .Post-side {
+      position: relative;
+      width: 32px;
+      .Post-avatar {
+        display: block;
+        .Avatar--size(32px);
+      }
+    }
+    .Post-container {
+      display: grid;
+      grid-template-columns: auto 1fr;
+      gap: 10px;
+    }
+    .Post-side .PostUser-badges {
+      top: -4px;
+      left: 6px;
+      width: 32px;
+    }
+  }
   .EventPost {
     padding-left: 50px;
   }