[Rails5]Administrateで独自のcssを利用する

結論

Administrateの標準のcssを自分のアプリに入れる

$ rails generate administrate:assets:stylesheets

上記コマンドでapp/assets/stylesheets/administrateフォルダが作成されて、さらにその配下にフォルダとファイルが作成される。

app/assets/stylesheets/administrate/application.scssで各css(scss)の読み込みの管理をしている。

今回は、app/assets/stylesheets/administrate/customフォルダを作成し、そこに独自のcssを作る。cssは_(アンダースコア)で始まるファイル名。ファイル名は_custom.scssとした場合、app/assets/stylesheets/administrate/application.scssに下記のように記述

@import "custom/custom";

環境

Rails 5.2.2
administrate 0.10.0

気をつけること

gemのバージョンアップしたりすると死ぬと思うので元々のファイルは変更せず、customフォルダなど変更可能な場所を用意し、そこを変更したほうがいい。

その他

他の方法も存在すると思うが、assets.rbを変更したり、レイアウトファイルに修正を加えたりと影響範囲が多いのでこの方法が一番いいと思う。

デフォルトでできてしまうファイルをアプリケーションに組み込まないようにするには、別の方法しかなさそう。

作成されたフォルダを消して読み込まないようにしたりして試してみたが、純粋にcssが読み込まれなくなるだけだったから、アプリでadministrate/application.scssを読み込むようにしたら、全部のcssを組み込む必要があると思われる。

軽微なものであれば、view側でstyleを直書きすればいいと思う。

なので、そもそもcssを読み込むようにしているのは、範疇を超えている気がする。新しいadmin画面を作ったほうが良いかもしれない。

参考

How to add custom CSS? · Issue #748 · thoughtbot/administrate
Hi 🙂 How can I add custom css to the dashboard?

コメント