ログイン/サインアップスプラッシュ画面用に別々の mobile_logo_dark 設定を追加

貢献 特徴
,
1

現在、ログイン済みのモバイルヘッダーと未認証のログイン/サインアップスプラッシュスクリーンでは、同じモバイルロゴが使用されているようです。

例えば、以下のような個別のサイト設定があると便利です。

mobile_logo_dark

より具体的には、

login_mobile_logo_dark

これにより、管理者はスプラッシュスクリーンの背景に適したロゴを使用できるようになり、ログイン済みのユーザーに表示されるコンパクトなヘッダーロゴに影響を与えることなく設定できます。

使用ケース

モバイル環境では、ログイン/サインアップスプラッシュスクリーンの視覚的要件は、ログイン済みのヘッダーとは異なることがよくあります。

例えば、サイトは以下のような設定を望む場合があります。

  • スプラッシュスクリーンでは、より大きく装飾的なロゴを使用する
  • ダークモード用として、暗色または背景に馴染むバージョンのロゴを使用する
  • ログイン済みのモバイルヘッダーでは、簡略化されたコンパクトなロゴを使用する

現在、スプラッシュスクリーンに適したモバイルロゴに変更すると、ログイン済みのヘッダーが過大表示されたり、視覚的に不自然になったりする可能性があります。逆に、ヘッダー用にロゴを最適化すると、スプラッシュスクリーンが地味すぎたり、背景と調和しなかったりする場合があります。

提案される動作

ダークモード用のスプラッシュ/ログインモバイルロゴのアップロード設定を別途追加します。

考えられる優先順位:

  1. login_mobile_logo_dark または mobile_logo_dark が設定されている場合はそれを使用
  2. 既存のダークモバイルロゴにフォールバック
  3. 通常のモバイルロゴにフォールバック

これにより、管理者は未認証の最初の画面でのブランディングをより細かく制御できるようになり、既存のログイン済みヘッダーの動作は維持されます。

この機能のメリット

スプラッシュスクリーンは新規ユーザーが最初に目にする画面であることが多く、その文脈に特化したロゴが役立ちます。一方、ログイン済みのモバイルヘッダーはスペースの制約が厳しいため、通常は異なるアセットが必要となります。

「いいね！」 1
2

この機能のドラフト実装 PR を作成しました：

これにより、ダークモードの別スプラッシュスクリーン画像のサポートが追加され、ダークカラーテーマが有効な場合にログイン/サインアップのスプラッシュスクリーンで異なるアセットを使用できるようになります。

現在の実装には以下が含まれます：

  • splash_screen_image_dark サイト設定
  • ダークモード対応のスプラッシュスクリーン画像選択
  • ダークアセットが設定されていない場合の既存のスプラッシュ画像へのフォールバック
  • 更新されたヘルパーメソッド/リファクタリング
  • 対応する RSpec カバレッジ

また、PR の履歴にこの機能に関連するコミットのみが含まれるよう、作業をクリーンなブランチにリベース/チerryピックしました。

特に以下の点についてフィードバックを歓迎します：

  • 設定名の適切さ
  • フォールバック動作の適切さ
  • スプラッシュスクリーン固有の機能として残すか、さらに一般化すべきか
「いいね！」 1