Discourse フルワイドコンポーネント

:information_source: 概要 Discourse をブラウザの全幅で表示させる
:eyeglasses: プレビュー プレビュー
: hammer_and_wrench: リポジトリ Full-width component
: question: インストールガイド テーマまたはテーマコンポーネントのインストール方法
: open_book: Discourse テーマ初心者の方へ Discourse テーマの使用に関する初心者ガイド

このテーマコンポーネントをインストール


: warning: これはまだ実験的なコンポーネントであり、ウィジェットをオーバーライドするため、ヘッダーのリファクタリングで破損する可能性が高く、他のヘッダーコンポーネントとはうまく連携しません。

このコンポーネントのメンテナンスと、破壊的な変更を最小限に抑えるよう最善を尽くしますが、それらが決して発生しないことを保証することはできません。修正はほとんどの場合行われますが、しばらくお待ちいただく必要があるかもしれません。


例:

このコンポーネントは現在、Meta の Fully および「デフォルト(フル幅)」テーマでも使用されています。

非常に幅の広い画面では、これはあまり適さない場合があります。

「いいね!」 12

シンメトリーのために、このコンポーネントが右側のサイドバーコンポーネントと連携し、できるだけ右に移動するとクールだと思います。

「いいね!」 5

最新バージョンにアップデートしたところ、画面にエラーが表示されるようになりました

Discourseのバージョン:3.3.0.beta1

「いいね!」 3

Discourse をアップグレードすれば、問題が解決するはずです。

3 日前、Discourse コアの最近の追加機能に依存するコンポーネントが更新されました。

「いいね!」 6

あなたの言う通りでした

「いいね!」 2

私もです。
Fully Theme とこのテーマコンポーネントを使用しています。トピックページ全体に挿入されたテーブルを拡張するにはどうすればよいですか?
よろしくお願いします!

「いいね!」 1

CSS変数を上書きしてみてください。

テーマコンポーネントを作成し、それをFullyにアタッチします。
Color Definitionsで、変数を追加・調整します。

:root {
    --topic-body-width: 100% !important; // 690px
    --d-max-width: 100% !important;  // 1110px;
}

「いいね!」 3

成功しました。本当にありがとうございます :slight_smile:

「いいね!」 1


このテーマと互換性があることを願っています

投稿が新しいトピックに分割されました:「トピックのタイトルと抜粋が異なるフォントサイズで表示される」/t/topic-titles-and-excerpts-appear-in-different-font-sizes/313635

一部のカテゴリ名は長く、サイドバーに完全に表示されません。

カテゴリ名に合わせてサイドバーの幅を広げるにはどうすればよいですか?

ありがとうございます!

こんにちは。

  1. このコンポーネントはまだ実験的なものですか、それとも本番環境にデプロイしても問題ないですか?

  2. このコンポーネントは公式にサポートされていますか?

ありがとうございます!

「いいね!」 1

バグが報告された場合は対応するため、公式にはサポートされていますが、すべてのテーマやテーマコンポーネントでうまく機能することが期待されるものではないという意味で、まだ実験的なものです。

「いいね!」 4

こちらのアナウンスを踏まえて、Full Widthコンポーネントとヘッダー検索機能を使用する際の体験におけるいくつかの不一致を指摘したいと思います。

セーフモード:

セーフモード + Full Widthコンポーネント:

少なくとも同じ体験が期待されるはずですが、そうでなければ、非常に狭いページ幅(モバイルビューなど)ではヘッダー検索を単にアイコンに折りたたむだけでよいでしょう。

ヘッダーの検索バーが小さい画面幅でアイコンに折りたたまれるように修正をマージしました。Discourseをアップデートしたら、確認して、改善されたかどうか教えていただけますか?

「いいね!」 2