カテゴリ名が極端に長いと CSS レイアウトに問題が発生する

Discourse の 404 ページを CSS で修正するテスト中に、いくつかの問題を発見しました。

すべてのスクリーンショットは safe-mode で作成されたもので、カスタムスタイルシートはまだ追加されておらず、公式プラグインのみがインストールされています。

CSS の 404 ページでのレンダリングをテストするために、非常に長い名前(Discourse で設定されているデフォルトの最大 50 文字)と、非常に短いまたは通常の長さの名前を持つカテゴリとサブカテゴリを作成しました。

以下が問題点です:

カテゴリスタイルが none に設定されている場合:



カテゴリ名が非常に長い場合、名前がホームページでもハンバーガーメニューでも適切に切り詰められていません。
ブラウザのコンソールで簡易検索したところ、.badge-wrapper.none span.badge-category の項目とその関連する CSS 設定が Discourse のスタイルシートから欠落していることがわかりました。

カテゴリスタイルが bullet に設定されている場合:

カテゴリ名が非常に長い場合、箇条書きの記号が正方形の形状を失います(この問題は 404 ページのカスタマイズ にも引き継がれています)。これは親カテゴリです。
ここでは、.badge-wrapper.bullet に対する display: inline-flex の設定が問題の原因だと考えられます。

50 文字もの長いカテゴリ名を作成するサイトはあまりないことは承知していますが、そのような名前を設定できる以上、これらのレイアウトエラーは修正されるべきです。

v1.9.0.beta8 +100

「いいね!」 3