
じろう
2019年11月02日に参加
学習履歴詳細
[卒業制作]Indexページ上部にYWTのボタン設置。アイコンで編集と削除が出来るように。ユーザーのマイページにデザイン当てる……もScssファイルの変更が反映されない。アセットパイプラインについて調べたりした
やったこと
font-awesomeのアイコンをcard-headerの右に設置
デザイン系のissueをまとめて立てる
ユーザー系はマイページのデザインから着手する
ジャンボトロンを使って上部にはユーザーの情報
その下にはボタンを横並びにしてYWTの数を表示
font-weight: lighterでいい感じになった
users/show.scssファイルの変更が反映されず、色々試すも解決できない
アセットパイプラインについて調べるも、下に書いてあるし優先されるように読み込んでいるはず
しょうがないのでapplication.scssにCSSを書いていく
要素を浮かせてジャンボトロン内でうまい具合に配置する
レベルに必要なExpをプログレスバーで実装。ちゃんとユーザーの経験値とバーが連動するように
バーのwidthを求める式をコントローラに書いた
わかったこと
application.scssに書けばとりあえずデザインはあたる
後に読み込まれたファイルや呼び出された要素が優先される
プログレスバーのwidthに変数を使うのは#{}だけでいける
fdivで小数点まで求める割り算が出来る
検証ツールで、どのファイルのどの文章でどのようなスタイルが当たってるか全部わかるのでCSSのデバッグはこれを頼りにするしかない
btn-groupが便利。ボタンを横に同じ幅で並べたいときいいかも
次やること
ユーザーの他のページのデザインを実装する
users/show.scssファイルがなぜあたらないか引き続き調べる
font-weightを気にする
けっきょく、よはくを読み返してデザインを考え直す
Rails
Bootstrap
2020年05月15日(金)
7.4時間