管理画面でサイドバーメニューのアイコンを調整する

* 2014.09.08 11:00 追記しました
* 2014.09.08 16:00 PowerCMS依存のコードでしたので、修正しました。


先日、MTの管理画面で、Font Awesome をつかって、アイコンを使う話を書きました。

Movable Type の管理画面で Font Awesome を使おう | かたつむりくんのWWW
http://www.tinybeans.net/blog/2014/09/03-224501.html

MTのデフォルトでもアイコンがありますよね。

メニューが開いていても閉じていてもこのアイコンは下に向いてます。
なので、メニューが開いてるときは上に向けてみましょう。

このカスタマイズは MTAppjQuery がインストールされている前提です。

user.css に以下の様な記述をします。

#menu .active .toggle-button img{
  transform: rotate(-180deg);
}

これでメニューが開いてるときはアイコンが上を向くようになります。

気になる方はこれで調整してみてはいかがでしょうか?


【2014.09.08 11:00 追記ここから】

デフォルトを横向き、開いてる時は下向きということもありそうです。

右向き

#menu .toggle-button img{
  transform: rotate(-90deg);
}
#menu .active .toggle-button img{
  transform: rotate(0deg);
}

左向き

#menu .toggle-button img{
  transform: rotate(90deg);
}
#menu .active .toggle-button img{
  transform: rotate(0deg);
}

【2014.09.08 11:00 追記ここまで】


Comments

comments powered by Disqus