開発環境で、bulma-railsを使い、ヘッダー部分のスタイリングを行おうとしているのですが、cssが反映されません。どうすれば反映されるようになるでしょうか。
application.cssに直接body { background-color: green; }
など書いても反映されないので、bulmaの導入でハマっているのではなく、ファイルの読み込みができていないのではないかと個人的に思っていますが、原因がよくわかりません。
テンプレートエンジンにslimを導入しています。
application.css
@import "bulma"; /*============================================= import variables =============================================*/ @import "fundation/variables"; /*============================================= import layout =============================================*/ @import "layout/header"; /*============================================= import object =============================================*/ @import "object/examination";
application.html.slim
doctype html html head title | Each Univ = csrf_meta_tags meta content=("text/html; charset=UTF-8") http-equiv="Content-Type" meta[content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"] meta[http-equiv="X-UA-Compatible" content="IE=edge"] = stylesheet_link_tag 'application', media: 'all' = javascript_include_tag 'application' - body_classes ||= @body_classes body class=body_classes == render partial: 'layouts/header' == yield
_header.scss
nav.navbar { font-size: 62.5%; background-color: $color-green; &__logo { font-size: 1.1rem; color: $color-white; } }
_header.html.slim
nav.navbar .container nav.navbar__logo | Each Univ
追記
rails serverを再起動してapplication.cssに直接body {background-color: green;}
と書くと反映されるようになりました。ということは、application.css内のimportがうまく行ってないと思うのですが、スペルにも間違いはないと思いますし、階層も間違ってはいないと思います。なぜうまく読み込まれていないのでしょうか。原因を探る方法でもなんでもご教授お願いいたします。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
退会済みユーザー
2018/03/11 05:27
2018/03/11 12:34
退会済みユーザー
2018/03/11 13:45
2018/03/11 14:03
退会済みユーザー
2018/03/11 14:27
2018/03/11 14:39