こんにちは 
DiscoTOCスタイルは、トピック内に2つ以上の投稿がある場合に.topic-navigationに追加される.with-topic-progressクラスに接続されています。そのため、返信がないとDiscoTOCスタイルが壊れてしまいます。
返信がないトピックでもTOCがアクティブになるべきだと思います。なぜなら、返信数とは関係がないからです。デスクトップでは、返信がないトピックでも正常に動作します。
テスト用のトピックはこちらです: Customizing the topic list
この動作は変更を検討すべきだと思います。
おそらく新しいことではありませんが、私はまだ気づいていませんでした。今、私たちはより積極的に使用し始めています。
ありがとうございます 
私もここで同じ問題に遭遇しました。
(iPhone/Safari) 修正していただけると助かります。長いドキュメントの末尾までスクロールして目次を取得するのは少し面倒です。
私の基本的なコーディングスキルとChatGPTとのやり取りで、機能するようになったと思います。
カスタムコンポーネントを作成し、CSSタブに以下を追加しました。
/* CSS for Discourse component - Mobile only */
@media (max-width: 767px) {
#topic-progress-wrapper.sticky-bottom {
position: fixed !important;
bottom: 0;
left: 0;
right: 0;
z-index: 1000;
}
}
そしてJSタブに以下を追加しました。
import { apiInitializer } from "discourse/lib/api";
export default apiInitializer((api) =
u003e {
api.onPageChange(() =
u003e {
const observer = new MutationObserver(() =
u003e {
const wrapper = document.getElementById("topic-progress-wrapper");
const tocButton = wrapper?.querySelector(".d-toc-mini button");
if (wrapper) {
if (tocButton) {
wrapper.classList.add("sticky-bottom");
} else {
wrapper.classList.remove("sticky-bottom");
}
}
});
observer.observe(document.body, {
childList: true,
subtree: true,
});
});
});
これは、返信なしでも問題なく動作しているようです。
繰り返しますが、私は専門家ではありません。私は単に「質問が上手」なだけで、適切な質問と課題をChatGPTと何度か「やり取り」した後、機能するようになったようです。
JavaScriptの専門家で改善できる方がいれば、ぜひ共有してください。
こんにちは
これは素晴らしいのですが、CSSだけでも実現できると思います。 
.with-topic-progress で使用されているのと同じCSSを .topic-navigation に使用するだけです。 .with-topic-progress クラスがないと、トピックに返信がない場合にスタイルがブロックされます。
以下のようなものでうまくいくはずです。
モバイルCSS
// 固定トピックナビゲーション
.container.posts .topic-navigation:not(.with-topic-progress) {
position: sticky;
bottom: calc(env(safe-area-inset-bottom) + var(--composer-height, 0px));
z-index: z("timeline");
pointer-events: none; // ラッパーがモバイルコントロールをブロックする可能性がある
> * {
pointer-events: auto; // 上記のルールを解除し、子要素をインタラクティブにする
}
// TOCスタイルの追加
.d-toc-wrapper {
position: fixed;
margin-top: 0.25em;
height: calc(100vh - 50px - var(--header-offset));
opacity: 0.5;
right: -100vw;
top: var(--header-offset);
width: 75vw;
max-width: 350px;
background-color: var(--secondary);
box-shadow: var(--shadow-dropdown);
z-index: z("modal", "overlay");
transition: all 0.2s ease-in-out;
.d-toc-main {
width: 100%;
padding: 0.5em;
height: 100%;
#d-toc {
max-height: calc(100% - 3em);
}
}
&.overlay {
right: 0;
width: 75vw;
opacity: 1;
.d-toc-main #d-toc li.d-toc-item ul {
transition: none;
}
}
a.scroll-to-bottom,
a.d-toc-close {
display: inline-block;
padding: 0.5em;
}
.d-toc-icons {
text-align: right;
}
}
}
// RTLサポート
.rtl {
.topic-navigation .d-toc-wrapper {
right: unset;
left: -100vw;
&.overlay {
right: unset;
left: 0;
}
}
}
これで修正されるはずです
このトピックは、最後の返信から7日後に自動的に閉じられました。新しい返信は許可されなくなりました。