Dawn 11.0.0 ヘッダーにある検索アイコンをクリックした際の検索窓内の背景を透明ではなく、白にしたい

[猫好き初心者]

Dawn 11.0.0を使用しています。

PCの場合、ヘッダーにデフォルト付いている検索アイコンをクリックすると背景が透過された検索窓が表示されるため、ヘッダメニューが後ろに丸見え状態になっています。

文字を入力し始めてもメニューが見えている状態で、入力したテキストとかぶってしまっています。

そのため、検索窓の背景を白にして後ろに文字が透けて見える状態をなんとかしたいです。

component-search.cssあたりをいじるのかなと、以下のclassに対して、background-colorで記述してみたのですが、違ったようでした・・・

.search__input.field__input

上記実現する方法をご教示いただけますと幸いです。

よろしくお願いいたします。

[Qcoltd]

@猫好き初心者 様

初期設定ですと、

検索窓のモーダルの背景は透過されないと思いますが、

透過されるように変更された、ということですね。

下記を、

テーマカスタマイズ画面にて、

ヘッダーのカスタムCSSに設定されてみてはいかがでしょうか？

.search-modal {
  opacity: 1;
}

ご参考まで。

(キュー田辺)

[猫好き初心者]

ご丁寧にありがとうございます。

メニュー設定時にz-index指定を誤っておりました。

デフォルトでは透過していないとご指摘いただいたおかげで修正すべき箇所に気づけました。

ありがとうございました。

[Qcoltd]

@猫好き初心者 様

なるほどです。

z-indexを変更されていたのですね。

検討外れの回答になってしまいましたが、ご自身で解決できたとのことで安心いたしました。

(キュー田辺)