ハンバーガー食べたい


変更後のテーマ、モバイル端末サイズ閲覧時のグローバルメニューのトグルがどうも味気ないので無理矢理ハンバーガーにしました。

.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を用意してもいいんですよね。悩むっちゃ悩む。