fix(a11y): reply placeholder not accessible (#3793)

Signed-off-by: Sami Mazouz <sychocouldy@gmail.com>
flarum · Apr 16, 2023 · aa33cfd · aa33cfd
1 parent 4901c58
commit aa33cfd
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 4 deletions.
diff --git a/framework/core/js/src/forum/components/ReplyPlaceholder.js b/framework/core/js/src/forum/components/ReplyPlaceholder.js
@@ -38,11 +38,11 @@ export default class ReplyPlaceholder extends Component {
     };
 
     return (
-      <article className="Post ReplyPlaceholder" onclick={reply}>
-        <header className="Post-header">
+      <button className="Post ReplyPlaceholder" onclick={reply}>
+        <span className="Post-header">
           {avatar(app.session.user, { className: 'PostUser-avatar' })} {app.translator.trans('core.forum.post_stream.reply_placeholder')}
-        </header>
-      </article>
+        </span>
+      </button>
     );
   }
 

diff --git a/framework/core/less/forum/Post.less b/framework/core/less/forum/Post.less
@@ -437,6 +437,9 @@
   border: 2px dashed var(--control-bg);
   color: var(--muted-color);
   border-radius: 10px;
+  background-color: transparent;
+  width: 100%;
+  display: flex;
 
   .Post-header {
     margin: 0;