コアでダーク/ライトモードトグルが利用可能になりました

[Osama]

ダーク/ライトモードトグルテーマコンポーネントは、ユーザーがライトモードとダークモードを簡単に切り替えられるトグルを追加するもので、interface color selectorサイト設定を通じて有効化できるようDiscourseコアにマージされました。

さまざまなバグ修正と改善に加えて、コアバージョンは元のテーマコンポーネントとわずかに異なり、ユーザーのデバイスのシステム設定に合わせてサイトのカラーモードを調整する3番目の「自動」オプションがあります。

カラーセレクターは、interface color selectorサイト設定を通じて、サイトヘッダーの検索アイコンの隣、またはサイドバーのフッターに表示するように構成できます。

サイドバーフッターに表示した場合のスクリーンショットを以下に示します。

ヘッダーに表示した場合のスクリーンショットを以下に示します。

テーマコンポーネントの既存ユーザー

テーマコンポーネントは非推奨となり、コアバージョンが利用可能かどうかを検出し、管理者に削除してコアバージョンを有効にするよう警告する最終アップデートがプッシュされました。管理者の警告のスクリーンショットを以下に示します。

コアバージョンが有効になると、テーマコンポーネントはサイトに影響を与えなくなります。ただし、将来的な破損を防ぐために、テーマコンポーネントのメンテナンスは今後行われないため、完全に削除する必要があります。

[Kevin7 (Kévin .)]

こんにちは、この新機能ありがとうございます。しかし、ダークモードに切り替えたときに、ボタンのテキストとアイコンが白くなるのではなく、黒いままになっている理由がわかりません。ダークモードが有効なときに、ボタンのテキストとアイコンを白くするにはどうすればよいですか？ありがとうございます。

[Osama]

@Kevin7

ダークモードに切り替えたときに、ボタンのテキストとアイコンが白くなるのではなく、黒いままなのはなぜだろうか。ダークモードが有効なときに、ボタンのテキストとアイコンを白くするにはどうすればよいか？

見ている問題のスクリーンショットを共有してもらえますか？

[Kevin7 (Kévin .)]

以下に例を示します。Discourseをダークモードに切り替えると、一部のボタンのテキストが黒いままになります。テキストを白くした方が理にかなっていると思いますが、この問題を解決するためにうまく機能すると思うCSSソリューションを見つけました。

$button-text-color: dark-light-choose(#ffffff, $primary);

:root {
  --button-text-color: #{$button-text-color};
}

.btn-primary {
  color: var(--button-text-color) !important;

  .d-icon {
    color: var(--button-text-color) !important;
  }
}

[Osama]

@Kevin7

一部のボタンのテキストが黒いままです。

これは、プライマリボタン（デフォルトのカラーパレットで青い背景を持つもの）に関する当社の意図的な設計上の決定ですので、全員に対して変更する予定はありません。ただし、Discourseは非常に柔軟で、コアCSSをオーバーライドするためのテーマシステムを備えています。

[joo (slower)]

設定はすでに行いましたが、オプションが表示されません。理由を説明していただけますか？

[Osama]

/my/preferences/interface でライトとダークのパレットが両方とも選択されていますか？ トグルが表示されるのは、ライトとダークの両方のパレットが選択されている場合のみです。

[patrickemin]

こんにちは、「テーマ」と「ダークモード」しか表示されず、カラーパレットの設定が設定画面に表示されません。

[Osama]

「モードソンブレ」はフランス語でダークモードを意味すると仮定して、ダークモードのチェックボックスを有効にすると、トグルが表示されると思います。試していただけますか？

私の前回の投稿にあるカラーパレットの設定は、サイトに複数のダークパレットがあり、ユーザーが選択できる場合に表示されます。利用可能なカラーパレットが1つしかない場合、ドロップダウンメニューは、あなたが見ているチェックボックスに置き換えられます。

[Andrew_Rowe]

申し訳ありませんが、この機能をオンにする設定はどこにありますか？
インストールは不要ですか？
新しい管理インターフェースで少し混乱しています。

[StefanoCecere]

モバイル/iPhoneに表示されません

デスクトップでは完璧です。

以前のバージョン（コンポーネントバージョン）は表示されていたのを覚えています。

[Jagster (Jakke Lehtonen)]

一部のiPhoneとフォーラムが機能することを示しているだけです。

これはコアにあるため…セーフモードで試したときに表示されるはずだと思います。もしそうであれば、それは他のコンポーネント、テーマ、またはプラグインとの競合です。

そうでなければ

• Discourseが十分に新しくない
• トグルがサイト設定で有効になっていない
• ダークモードがサイトレベルまたはユーザー設定で有効になっていない

[StefanoCecere]

数日前まで動作していたので奇妙です。

数日後に戻ってきます。見てみましょう。
ありがとうございます。

[StefanoCecere]

これらの2つのオプションがありません… 通常のものだけです…

[StefanoCecere]

了解しました！しかし、それは大変でした
いくつかの設定と個人的な好みを組み合わせています… テーマにダークとライトの2つの配色を簡単に提供できるようにすべきだと思います。

[patrickemin]

@Osama

ダークモードのチェックボックス（「Mode sombre」はフランス語でダークモードのことだと仮定します）を有効にすると、トグルが表示されると思います。試していただけますか？

いいえ、サイドバーのフッターには表示されません。

[Osama]

@Andrew Rowe、投稿：10、トピック：350991、全文：true、ユーザーネーム：Andrew_Rowe

本当に申し訳ありません…この機能をオンにする設定はどこですか？
インストールは必要ありませんか？
新しい管理インターフェースで少し混乱しています

あなたのサイトの /admin/site_settings/category/all_results?filter=interface_color_selector にアクセスすると、その設定を見ることができるはずです。

@Patrick EMIN、投稿：17、トピック：350991、ユーザーネーム：patrickemin

いや、サイドバーフッターには表示されません。

携帯電話やコンピュータのシステム設定をライトからダーク（またはその逆）に切り替えると、あなたのDiscourseインターフェースはシステム設定に合わせて変わりますか、それともそのままでしょうか（ライトモードやダークモードのまま）？

ここではコアセレクタが機能しており、多くの他のサイトでも動作しているため、あなたの側で何らかの設定の問題があり、セレクタが表示されていない可能性があります。あなたのアカウントにログインしている状態で、次のコマンドをブラウザのコンソールで実行したときの出力を共有できますか？

(({dark_scheme_id, color_scheme_id}) => { return {dark_scheme_id, color_scheme_id}} )((await (await fetch(`/u/${Discourse.User.current().username}.json`)).json()).user.user_option)

Discourse.SiteSettings.default_dark_mode_color_scheme_id

[patrickemin]

私の設定は問題ありません（サイドバーの下部）。モバイルまたはPCでダークモードに切り替えても、何も変化がありません。コンソールについては、使い方がわからないので申し訳ありません:grimacing:

[Jagster (Jakke Lehtonen)]

しかし、システム設定や個人設定のダークカラー設定が正しくない可能性があります。

[patrickemin]

多分そうでしょう。私は常にそのタイプの設定に苦労してきましたが、それほど重要ではないので、そのままにしておきます。助けようとしてくれてありがとう。