ネタバレ表示には「ネタバレを表示!」のようなツールチップテキストを追加。詳細を隠す場合も同様。

私はよく、宿題の回答には blur spoilers を、投稿のスペースを占める必要のない詳細には Hide details を使っています。

以前に書いた StackOverflow の 回答 を確認したところ、スパイラーに素敵なツールチップが表示されているのに気づきました。つまり、次のようなものです。

image

ご存知の通り、Discourse に慣れない多くのユーザーは Discourse の使い方を学ぶ手間を惜しむため、スパイラーの使い方を説明することがよくあります。

このテキストはぼかされます

または、詳細を隠すこともできます。

要約

このテキストは隠されます

これらにツールチップがあれば、もう少し安心できるのですが。:slightly_smiling_face:


編集

この文章を書いたとき、何故か tooltip という名前を思い出せませんでした。@merefield さん、ありがとうございます。

そのため、overlay texttooltip に変更しました。もし一部の回答がおかしなものに見えたら、私のせいだと思ってください。

「いいね!」 2

この CSS は回避策になるかもしれません:

.spoiler-blurred {
    filter: blur(0);
    
    & > * {
        filter: blur(0.5em);
    }
    &:after {
        content: "ネタバレを表示 ⚠";
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
}
「いいね!」 4

ここには簡単なツールチップがあると役立つかもしれませんね。正直、100% 直感的だとは思えません。少しツールチップで案内があると嬉しいのですが…

はい、@canapin さん、それで問題ありません :slight_smile: :+1:

「いいね!」 1