My css file is overridden due to activeadmin

Question

First I have created an active_admin css file as app/assets/stylesheets/active_admin.css.scss

/* active_admin.css.scss */
@import "active_admin/mixins";
@import "active_admin/base";

/* application.css.scss*/
@import "active_admin.css.scss"

So I have a lot of css of mine been overriden, I followed instructions of this post but still doesn't work. I changed files location from app/assets/stylesheets/active_admin.css.scss to vendor/assets/stylesheets/active_admin.css.scss but still having the problem.

So, how can I load activeadmin css files only when needed?

Answer 1

Based on seanlinsley comment on selected answer and nathan's answer too, it seems to me that the 'cleanest' way is indeed to move active_admin.css.scss from app/assets/stylesheets/ to vendor/assets/stylesheets/.

No need to any other (configuration) modification: 'main' app has it's styles back to normal and AA display is normal too.

(I didn't want to manually include each of my ressources instead of require_tree ... !)

This is the way AA is getting into: AA (still) opened issue on the matter.

Answer 2

For active_admin to play nice don't include it in the application.css, i.e.: remove the

require_tree .

and require each file separately inside app/assets/stylesheets but don't put active_admin.css

and on config/production.rb put this

config.assets.precompile += ['active_admin.css']

Answer 3

What worked for me (Rails 5) was adding the following line on my app/assets/stylesheets/application.css after the *= require_self line:

*= stub "active_admin"

Answer 4

Remove this line from your app/assets/stylehseets/application.css.sass

*= require_tree ../../../vendor/assets/stylesheets/

Move active_admin.css.scss to vendor/assets/stylesheets/

Answer 5

This is the link that addresses this issue. I am reposting an existing answer that I found very helpful because it also addressed the js issues. Again Not My Answer.

https://github.com/activeadmin/activeadmin/issues/3819#issuecomment-351377822

arif362 commented on Dec 13, 2017

the same problem I faced and I have solved this following below:

Firstly you have to create a directory named assets in the vendor directory,

Then in the assets directory of vendor folder, you have to create two directories (i) stylesheets and the second one is (ii) javascripts.

After that, you have to move the active_admin.scss file from assets/stylesheets to vendor/assets/stylesheets and the active_admin.js.coffee file from assets/javascripts to vendor/assets/javascripts,

And finally, restart your rails server then reload your apps. Hope this will work for you.

Answer 6

This post is pretty old, so I figured including my recent findings with an updated version of Rails (6.1.4) was worth it.

Moving active_admin.css.scss from app/assets/stylesheets/ to vendor/assets/stylesheets/ worked for me too.

Using Rails 6.1.4