ページ移行Again
昨日は、Sassでつまずいてしまったけど、シミュレーターも判明したので、とても満足!
速度はゆっくりだけど。
さて、今日こそは画面移行を完成させる!
さて、画像制御のSASSを作る盤面が来たよ。
昨日の成果を見せてやる!
small mid largeの画像サイズCSSを用意したい。
やるぞっ!
Twitter Bootstrap使っているんだから smallとかにしないで
xs sm md lg xl 使えばいいじゃんね。。
今回は、横幅で合わせよう。
// サイズ = xs, sm, md, lg
$size: xs, sm, md, lg;
$value:50,100,150,300;
@for $i from 1 through 4 {
.img-#{nth($size, $i)}
{ width:#{nth($value, $i)}px;}
}
ひとまず、こんなもんか。
自由に後からサイズ変更できるように、掛け算で計算するのは辞めておいた。
あれー、Something went wrongと表示されてしまった。
SASSの方の設定で、セミコロンが抜けていたためのエラーでした。
うーむ。初歩的。
よし、これで画像制御もできるようになったので、次に進もう。
何行も同じの各の面倒くさくなってきたので、配列を使う。
Ruby 配列で検索。
配列はうまく行ったけど、for文が今度はうまくいかないなぁ。
コメント文章が邪魔だった事に気がついた!!
コメントをわざわざ途中にいれて、Tabを削除したのが問題だった。
そして、forの後にもう一つTabを押して入れ子にするというのをしていなかった。
解決!!
@移行の文字列を追加したいなぁ。
連想配列でしないと対応できなさそう。
- books = { 'こころ' => ,'こころ' => 300,'坊っちゃん' => 380,'明暗' => 700,}
- books.each do |key, val|
#{key} | #{val}円
これで、金額は表示されるが、Keyが表示されない。
意味がわからん。。。
うーん、配列の仕方がそもそも間違っている気もしてきた。
名前は名前、画像は画像という事で配列を作り直した。
あっさりと出来たよ。
ここまで来るのに全然あっさりじゃないけど。
ひとまず、ここで一旦セーブ。
危ない!北朝鮮のミサイルニュース記事が目に入ったので、見てしまった。そのままネットサーフィンをしてしまうところだった。
今は集中!
はやくViewを完成してしまい、デザインに移りたい。
ようやっとトップページのHTMLを移行した。
for文使えると楽だなぁ。
420行あったソースコードが、133行に!
slimの使い方が少しずつわかってきた。
重要なのは、TAB!
うぉぉ。面倒くさくなってきた。
一段落したというのもあるけど、なんか集中力切れた。
完全に切れちまったぜ。
5分だけ休憩。
よし、再開。
検索結果のページを追加完了した。
うん。移行はまだ終わってないね。Very遅いね。
フォームはここを見るのが一番だという事に気がついた。
めでたしめでたし。