
じろう
2019年11月02日に参加
学習履歴詳細
[基本情報]1h 過去問道場でアルゴリズムとプログラミングの問題を58問 [Rails]デザイン改修、Scssファイルが反映されないバグが1ヶ月半越しの解決
やったこと
過去問道場でアルゴリズムとプログラミングの問題を58問解いた
log/indexのデザイン改修+色見直しに入った
追加したテーマカラーのspacered
, spacegreen
を一旦すべてspaceblue
に書き換え、YWTのカードを同じ色に設定
三色でセンスのいい色 156Pのカラーパレットを試しに使用
card-footer
の背景色がおかしかったのを修正
card-header
を白色にし、付箋風デザインをborder-left
で試す
application.scss
以外のview別scssファイルの読み込みがうまくいったりいかなかったりするのを修正
わかったこと
viewごとに設定しようと思って作ったScssファイルが、反映されたりされなかったりするバグはこう解決した。
application.scss
@import "variables"; @import "bootstrap"; @import "font-awesome-sprockets"; @import "font-awesome"; @import "bootstrap-tagsinput"; @import "logs/index.scss"; @import "users/show.scss";
この下2行から拡張子を取り除き、こう書き換える
@import "logs/index.scss"; @import "users/show.scss";
そして、development.rb
に
config.assets.compile = true #動的コンパイルを有効化
を追加したところ、Scssファイルの保存・更新→ページの更新でしっかり反映されるようになった。
参考
RailsでCSS(Sass)が反映されない時の対処法
また付箋風の新デザインはborder-left
で実装
.dones{ .card { background-color: rgba(248, 248, 248, 0.897); } .card-header{ background-color: rgba(248, 248, 248, 0.897); border-left: thick outset $spaceblue; } }
borderの参考情報
基本のborder
border-style
border-width
次やること
border-left
で付箋風になったはいいものの、ちょっと隙間があるので修正
YWT全てのカラムにこれを適用
Tのカードのwhen-to-do
カラムをcard-footer
に追いやってもいいかも?
Wのcomment
が空のとき、カードの開閉を無効にする
Rails
Bootstrap
基本情報技術者
2020年06月25日(木)
2.7時間