変更後のテーマ、モバイル端末サイズ閲覧時のグローバルメニューのトグルがどうも味気ないので無理矢理ハンバーガーにしました。
.menu-toggle {
font-size: 0px;
width: 46px;
height: 46px;
border: 0px;
outline: 2px solid white;
}
.menu-toggle::after {
content: "\f0c9";
font-family: "Font Awesome 5 Free";
font-weight: 900;
color: #FFF;
font-size: 25px;
}
.menu-toggle:active,
.menu-toggle:focus {
background-color: #303030;
outline: 2px solid white;
}
これを追加CSSにぶちこむだけ!脳筋極まる。スマートなやり方があるんだろうなとは思います。
見ての通りFont Awesomeを利用していますが、別途SVGを用意してもいいんですよね。悩むっちゃ悩む。