未読トピック（モバイル版）

[PaulinaMX (ForosMX)]

数日前に私のフォーラムでこの問題が発生しましたが、トピックに入っても未読のように見えます。デスクトップ版でも同じ問題が発生しましたが、テンプレートで解決できましたが、正直なところモバイル版では解決できませんでした。誰か助けてくれることを願っています。これが私が使用しているテンプレートです。

<script type='text/x-handlebars' data-template-name='mobile/list/topic-list-item.raw'>
    <td>
      {{#unless expandPinned}}
      <div class='pull-left'>
        <a href="/users/{{topic.creator.username}}">{{avatar topic.creator imageSize="50"}}</a>
              </div>
              
      <div class='right'>
      {{else}}
      <div>
            {{/unless~}}
            

<div class='main-link'>
          {{raw "topic-status" topic=topic}}
          {{topic-link topic}}
          {{#if topic.featured_link}}
            {{topic-featured-link topic}}
          {{/if}}
          
          
{{#if hideCategory}}
   <div class='category'>
          <span class="author-name">
            <a href="{{topic.creator.path}}" data-user-card="{{topic.creator.username}}">{{topic.creator.username}}</a>
          </span>
        </div>
{{else}}

{{/if}}
                    {{#if topic.unseen}}
                      <span class="badge-notification new-topic"></span>
                      
             {{/if}}
          {{~#if expandPinned}}
          {{raw "list/topic-excerpt" topic=topic}}
          {{/if~}}
        </div>
                <div class='pull-right'>
          {{raw "list/post-count-or-badges" topic=topic postBadgesEnabled=showTopicPostBadges}}
        </div>
    
        <div class="topic-item-stats clearfix">
          {{#unless hideCategory}}
            <div class='category'>
              {{category-link topic.category}}
            </div>
          {{/unless}}
    
          {{discourse-tags topic mode="list"}}
    
          <div class="pull-right">
            <div class='num activity last'>
            <span class="age activity" title="{{topic.bumpedAtTitle}}">
              <a href="{{topic.lastPostUrl}}">{{format-date topic.bumpedAt format="tiny" noTitle="true"}}</a>
            </span>
            </div>
          </div>
              <div class="clearfix"></div>
        </div>
      </div>
    </td>
</script>

[Don]

コアテンプレートに変更があったため、比較する必要があります。
正しく理解していれば、この <a> href="/users/{{topic.creator.username}}">{{avatar topic.creator imageSize="50"}}</a> でプロフィールアバターセクションを変更しました。 /users/ パスは正しいですか？これはユーザーカードを開くのではなく、ユーザープロフィールに移動します。デフォルトのユーザーパスでは /u/ になるはずです。

テンプレートのもう1つの変更点は、カテゴリが非表示の場合にユーザー名を表示することです。これはスクリーンショットで明確にわかります。私はそのセクションを次のように変更しました。

テンプレートからこれを削除してください:

{{#if hideCategory}}
   <div>
          <span class="author-name"><a>{{topic.creator.username}}</a></span>
   </div>
{{else}}

{{/if}}

---

そしてこれをデフォルトの {{#unless hideCategory}} に {{else}} と共に追加してください。

{{#unless hideCategory}}
{{~raw-plugin-outlet name="topic-list-before-category"}}
<div>
  {{category-link topic.category}}
</div>
{{else}}
<span class="author-name">
  <a href="{{topic.creator.path}}" data-user-card="{{topic.creator.username}}">{{topic.creator.username}}</a>
</span>
{{/unless}}

---

したがって、テンプレート全体をインポートして、必要に応じて次のように変更することを提案します。

<script type='text/x-handlebars' data-template-name='mobile/list/topic-list-item.raw'>
<td class="topic-list-data">
  {{~raw-plugin-outlet name="topic-list-before-columns"}}
  <div class='pull-left'>
    <a href="/users/{{topic.creator.username}}">{{avatar topic.creator imageSize="50"}}</a>
  </div>
  <div class='right'>
    {{~raw-plugin-outlet name="topic-list-before-link"}}
    <div class='main-link'>
      {{~raw-plugin-outlet name="topic-list-before-status"}}
      {{~raw "topic-status" topic=topic~}}
      {{~topic-link topic class="raw-link raw-topic-link"}}
      {{~#if topic.featured_link~}}
      {{~topic-featured-link topic~}}
      {{~/if~}}
      {{~raw-plugin-outlet name="topic-list-after-title"}}
      {{~#if topic.unseen~}}
        <span class="topic-post-badges">&nbsp;<span class="badge-notification new-topic"></span></span>
      {{~/if~}}
      {{~#if expandPinned~}}
      {{~raw "list/topic-excerpt" topic=topic~}}
      {{~/if~}}
    </div>
    <div class='pull-right'>
      {{raw "list/post-count-or-badges" topic=topic postBadgesEnabled=showTopicPostBadges}}
    </div>
    <div class="topic-item-stats clearfix">
      {{#unless hideCategory}}
        {{~raw-plugin-outlet name="topic-list-before-category"}}
        <div class='category'>
          {{category-link topic.category}}
        </div>
        {{else}}
        <span class="author-name">
          <a href="{{topic.creator.path}}" data-user-card="{{topic.creator.username}}">{{topic.creator.username}}</a>
        </span>
      {{/unless}}
      {{discourse-tags topic mode="list"}}
      <div class="pull-right">
        <div class='num activity last'>
          <span class="age activity" title="{{topic.bumpedAtTitle}}"><a
              href="{{topic.lastPostUrl}}">{{format-date topic.bumpedAt format="tiny" noTitle="true"}}</a>
          </span>
        </div>
      </div>
      <div class="clearfix"></div>
    </div>
  </div>
</td>
</script>

---

これはテーマクリエーターでうまく機能しているようです。何か見落としがあれば申し訳ありません。

タイトルパディングを薄くして、ユーザー名をクリック可能にするための小さなCSS修正。

.topic-list .main-link a.title {
  padding: 0.5em 0;
}

[PaulinaMX (ForosMX)]

ありがとうございます。解決しました。素晴らしいです。

もう一つ、著者名のフォントサイズを大きくして色を付けるCSSはありますか？

[Don]

解決してよかったです。もちろん変更できます。このように
サイズや色はお好きなように変更してください。

.topic-list .topic-item-stats .author-name a {
  font-size: var(--font-up-1);
  color: red;
}

[PaulinaMX (ForosMX)]

改めて、ご希望通りの仕上がりで大変嬉しく思います。