feat(seo): Do not use h3 header for poster author in posts stream (#3732

) * Do not use h3 header for poster author in posts stream. * Change back `.PostUser-name` tag to h3.
flarum · Feb 15, 2023 · fee6ffe · fee6ffe
1 parent 7a60a52
commit fee6ffe
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 11 deletions.
diff --git a/framework/core/js/src/forum/components/PostUser.js b/framework/core/js/src/forum/components/PostUser.js
@@ -22,7 +22,7 @@ export default class PostUser extends Component {
     if (!user) {
       return (
         <div className="PostUser">
-          <h3>
+          <h3 class="PostUser-name">
             {avatar(user, { className: 'PostUser-avatar' })} {username(user)}
           </h3>
         </div>
@@ -41,7 +41,7 @@ export default class PostUser extends Component {
 
     return (
       <div className="PostUser">
-        <h3>
+        <h3 class="PostUser-name">
           <Link href={app.route.user(user)}>
             {avatar(user, { className: 'PostUser-avatar' })}
             {userOnline(user)}
@@ -60,11 +60,11 @@ export default class PostUser extends Component {
     let timeout;
 
     this.$()
-      .on('mouseover', 'h3 a, .UserCard', () => {
+      .on('mouseover', '.PostUser-name a, .UserCard', () => {
         clearTimeout(timeout);
         timeout = setTimeout(this.showCard.bind(this), 500);
       })
-      .on('mouseout', 'h3 a, .UserCard', () => {
+      .on('mouseout', '.PostUser-name a, .UserCard', () => {
         clearTimeout(timeout);
         timeout = setTimeout(this.hideCard.bind(this), 250);
       });

diff --git a/framework/core/js/src/forum/components/ReplyPlaceholder.js b/framework/core/js/src/forum/components/ReplyPlaceholder.js
@@ -21,7 +21,7 @@ export default class ReplyPlaceholder extends Component {
         <article className="Post CommentPost editing" aria-busy="true">
           <header className="Post-header">
             <div className="PostUser">
-              <h3>
+              <h3 class="PostUser-name">
                 {avatar(app.session.user, { className: 'PostUser-avatar' })}
                 {username(app.session.user)}
               </h3>

diff --git a/framework/core/less/forum/Post.less b/framework/core/less/forum/Post.less
@@ -40,10 +40,14 @@
   font-weight: normal;
   position: relative;
 
-  h3 {
+  // TODO: remove styles for h3 on Flarum 2.0 cleanup - they may be used by extensions, but they should target `.PostUser-name` class instead
+  h3,
+  .PostUser-name {
     display: inline;
   }
-  h3, h3 a {
+  // TODO: remove styles for h3 on Flarum 2.0 cleanup - they may be used by extensions, but they should target `.PostUser-name` class instead
+  h3, h3 a,
+  .PostUser-name, .PostUser-name a {
     color: var(--heading-color);
     font-weight: bold;
     font-size: 14px;
@@ -190,18 +194,31 @@
 }
 
 .Post--hidden {
-  .Post-header, .Post-header a, .PostUser h3, .PostUser h3 a {
+  .Post-header, .Post-header a,
+  // TODO: remove styles for h3 on Flarum 2.0 cleanup - they may be used by extensions, but they should target `.PostUser-name` class instead
+  .PostUser h3, .PostUser h3 a,
+  .PostUser .PostUser-name, .PostUser .PostUser-name a {
     color: var(--muted-more-color);
   }
   &:not(.revealContent) {
     .Post-header {
       margin-bottom: 0;
     }
-    .Post-body, .Post-footer, h3 .Avatar, .PostUser-badges {
+    .Post-body,
+    .Post-footer,
+    // TODO: remove styles for h3 on Flarum 2.0 cleanup - they may be used by extensions, but they should target `.PostUser-name` class instead
+    h3 .Avatar,
+    .PostUser-name .Avatar,
+    .PostUser-badges {
       display: none;
     }
   }
-  .Post-body, .Post-footer, h3 .Avatar, .PostUser-badges {
+  .Post-body,
+  .Post-footer,
+  // TODO: remove styles for h3 on Flarum 2.0 cleanup - they may be used by extensions, but they should target `.PostUser-name` class instead
+  h3 .Avatar,
+  .PostUser-name .Avatar,
+  .PostUser-badges {
     opacity: 0.5;
   }
   .Post-header .Button--more {

diff --git a/framework/core/views/frontend/content/discussion.blade.php b/framework/core/views/frontend/content/discussion.blade.php
@@ -5,7 +5,7 @@
         @foreach ($posts as $post)
             <article>
                 @php $user = ! empty($post->relationships->user->data) ? $getResource($post->relationships->user->data) : null; @endphp
-                <h3>{{ $user ? $user->attributes->displayName : $translator->trans('core.lib.username.deleted_text') }}</h3>
+                <div class="PostUser"><h3 class="PostUser-name">{{ $user ? $user->attributes->displayName : $translator->trans('core.lib.username.deleted_text') }}</h3></div>
                 <div class="Post-body">
                     {!! $post->attributes->contentHtml !!}
                 </div>