[ 解決済 ] Paleのモバイル固定ナビとスライドメニューの高さ

[森内愛民]

Lightning Pro + Paleにてサイト構築しています。
Paleのモバイル固定ナビとスライド（グローバル）メニューの高さですが、
スライドメニューを出した際にモバイル固定ナビの上端ピッタリに出てくるようになっています。

モバイル固定ナビのボタンを大きくしたい（＋20pxくらい）のですが、
モバイル固定ナビを大きく変えて、更にスライドメニューを短く（-20px）し、上端ピッタリにスライドメニューが揃うようにしたいと考えています。カスタマイズの方法ご教授お願いします。

[うなこ]

固定ナビの高さを＋20pxしたcssを記述しました。
追加CSSや子テーマのstyle.cssなどに以下を追加してみてください。

@media screen and (max-width: 782px){
.admin-bar .vk-mobile-nav{
height: calc(100% - 82px - 46px);
}
}
.admin-bar .vk-mobile-nav{
height: calc(100% - 82px - 46px);
}

.mobile-fix-nav .mobile-fix-nav-menu {
height: 82px;
}

こんな感じの意味合いであっていますか？
違っていましたらまた教えてください。

[石川＠Vektor,Inc.]

CSSのカスタマイズについては下記も参照ください

全てのWordPressテーマで使える！デザインをピンポイントで変更する方法 〜親テーマのCSSは書き換えないで〜

[森内愛民]

ありがとうございます。
教えていただいた記述でモバイル固定ナビの高さを変更することができました！
モバイル固定ナビはこれで大丈夫なのですが、今の状態だと、
左上のメニューボタンを押してスライドメニューが表示された際に
サイズ変更前のモバイル固定ナビの上端の位置までメニューが表示されてモバイル固定ナビの上部が隠れてしまいます。
20px大きくしたモバイル固定ナビの上部が隠れないようにスライドメニューを20px短くする方法もご教授いただければ助かります。
質問内容が分かりにくくて申し訳ありません…

[うなこ]

以下でいかがでしょうか？

@media screen and (max-width: 782px){
.admin-bar .vk-mobile-nav{
height: calc(100% - 82px - 46px);
}
.admin-bar .vk-mobile-nav.vk-mobile-nav-open{
top: 0px;
}
}
.admin-bar .vk-mobile-nav{
height: calc(100% - 82px - 46px);
}

.mobile-fix-nav_enable .vk-mobile-nav-open{
height: calc(100% - 82px);
}

.mobile-fix-nav .mobile-fix-nav-menu{
height: 82px;
}

[森内愛民]

ありがとうございます！
上記のコードで解決できました。
勉強になり助かりました。

[投稿者]

投稿