m-toggle
メニューを展開するためのトグルボタンを表示する。
aria-expanded 属性を付与する前提となっており、値が true のときにアイコンが変化する。
aria-expanded = "false"
aria-expanded = "true"
<button class="m-toggle" aria-expanded="false" aria-label="Menu"><span class="m-toggle-line"></span><span class="u-sr">メニュー</span></button>
<button class="m-toggle" aria-expanded="true" aria-label="Menu"><span class="m-toggle-line"></span><span class="u-sr">メニュー</span></button>m-toggle-inverse
トグルボタンの色を反転する。包括要素、もしくは.m-toggle自体に濃い背景色を指定する必要がある。
aria-expanded = "false"
aria-expanded = "true"
<button class="m-toggle m-toggle-inverse" aria-expanded="false" aria-label="Menu"><span class="m-toggle-line"></span><span class="u-sr">メニュー</span></button>
<button class="m-toggle m-toggle-inverse" aria-expanded="true" aria-label="Menu"><span class="m-toggle-line"></span><span class="u-sr">メニュー</span></button>