いよいよデザイン

今日から、いよいよデザインパートに移れる!

PC、モバイル両方対応するけど、レスポンシブルとか今考えるのめんどいので、モバイル版を先に作っていこう。

 

最初は、ヘッダーのよくあるボタンを押したらぴょこっと出て来るメニューバー。

あれ名前なんていうんだろう。

ドロワーっていうのか。

ドロップダウンメニューも良いなぁ。

share-life.biz

 

名前わからないの、ここで知れるな。

qiita.com

 

三 はハンバーガーメニューか。

theorthodoxworks.com

これかっこいいな。

 

qiita.com

この記事を読んで、ハンバーガーメニューやめても良い気もしてきた。

カテゴリも5つぐらいだから辞めてもよくね?

って思い始めてきたな。

うん、やめよう。

 

さて、早速作っていこうと思い、画面サイズをモバイルのシミュレーターにしたら、文字がやたら小さくに・・・

なんでやねん。 Come on!

 

なんか知らんけど、Ctrl + 0を押したら治った。

前テストしたときに、俺小さくして表示していたのかな・・・

 

今後Google開発者ツールで困ったら、Ctral+0を押しておこう。

 

検索キーワード:Google 開発者ツール 縮小されてしまう

こんなん書いておけば誰かの役に立てるかも?

 

さて、脱線しまくりだけど、メニュー画面の表示をつくりますかっと。

 

だめだ、集中力がない・・・夜更かしが原因か。

気を取り直して、対応する。

今日はダメだ。乗らない。

 

TWBSColor - Generate your own Bootstrap navbar

 

ここで、メニューバーの色を変更しよう。

とその前に、まずメニュー作れよ俺・・・一体どんだけ無駄な時間過ごしているんだ。

 

Default Twitter Bootstrap nav bar, in the Slim templating language · GitHub

いちいちslimに変更しているの面倒くさいので、コピペしてから調整しよう。

 

やっぱだめだ。今日はだめだ。やめよう。終わり。

くそぉ。。ナビメニューすらできないなんて。