Pytanie w sprawie twitter-bootstrap, ruby-on-rails, asset-pipeline, css – Rails Active Admin css kolidujący z Twitter Bootstrap css

40

Jestem trochę nowy w potoku zasobów Rails, więc mogę robić coś złego. Próbuję użyć Active Admin dla mojego css backend i bootstrap dla mojej aplikacji frontonu.

Dodałem bootstrap.css do/ app / assets / stylesheets następnie dodano również:

<code>//= require bootstrap
</code>

do application.css - wtedy zrobiłem prekompilację zasobów lokalnie

Wygląda na to, że działa dobrze, ale niektóre style nie przechodzą dokładnie i myślę, że to dlatego, że css aktywnego administratora nadpisuje go.

Rozumiem, że aplikacja kompiluje zasoby css w zasób publiczny aplikacji css, a aplikacja używa tego pliku podczas działania.

Muszę jakoś oddzielić te dwie rzeczy i sprawić, by je wykorzystałytwitter bootstrap css jako główny css na froncie i może powiedzieć mu, żeby nie używałaktywny css administratora pliki na przednim panelu.

Jak najlepiej to zrobić?

Dlaczego ActiveAdmin po prostu zmienia pliki klas, aby użyć prefiksu, takiego jak_active-admin- więc nie kolidują z niczym innym? Sposób działania bibliotek C. Myślę, że jest to błąd w ActiveAdmin. Chloe

Twoja odpowiedź

3   odpowiedź
28

Czy oglądałeś wideo RailsCasts przy użyciu ActiveAdmin? W filmie Ryan pokazuje, jak uniemożliwić CSS ActiveAdmin wkroczenie do głównej aplikacji CSS.

http://railscasts.com/episodes/284-active-admin

Przeniesienie informacji z filmu do odpowiedzi

W aplikacji.css usuniesz:

*= require_tree .

Dla szyn 4,Jiten K sugeruje dodanie tego doproduction.rb:

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

Jednak jeden z komentarzy na temat odpowiedzi SO mówi, że nie jest to konieczne. Nie potrzebowałem tego do tej pory.

MattSlay ma rację ... Ryan's RailsCast (# 284) pokaże ci, jak to obejść (wszystko dzięki „require_tree.” W application.css). Usunięcie / edycja, która rozwiąże problem z CSS. craig.kaminsky
Ta metoda działa dobrze dla mnie w trybie programowania, ale podczas produkcji mam problem podczas uruchamianiabundle exec rake assets:precompile: w moim przypadku pliki css kończą się mieszaniem, a bootstrap.css jest nadpisywany przez ActiveaAdmin. Dowolny pomysł?. Dzięki! CristianOrellanaBak
ale alerequire_tree . jest magią, która pozwala, by wszystkie pliki CSS zostały magicznie zmienione w Rails ... ta odpowiedź jest przesadna i powinna być nieakceptowana AlexChaffee
9

Dla mnie się zmieniaapplication.css do rozwiązania rozwiązuje problem:

<code> *= require bootstrap
 *= require_tree .
 *= stub "active_admin"
</code>
To wydaje się działać dla mnie, dzięki. Nie byłem w stanie dokładnie ustalić, costub czy mógłbyś dać mi szybką wskazówkę? justinraczak
132

Miałem ten sam problem i udało mi się to naprawić, przesuwając

<code>app/assets/stylesheets/active_admin.css.scss
</code>

do

<code>vendor/assets/stylesheets/active_admin.css.scss
</code>

Aktywne zasoby administracyjnepowinien być wvendor/ jak wspomniano wprzewodnik po szynach:

„Dostawca / zasoby są przeznaczone dla zasobów będących własnością podmiotów zewnętrznych, takich jak kod wtyczek JavaScript i frameworków CSS”.

To idealne rozwiązanie. Po co ładować kilka dodatkowych css poza obszarem nazw / admin, jeśli nie ma takiej potrzeby (nawet jeśli nie powoduje to konfliktu)? Spowalnia tylko czas ładowania strony dla przeciętnego użytkownika. Abram
I zrób to samo dlaactive_admin.js. Przenieś to dovendor/assets/javascripts/active_admin.js Arcolye
Działa dobrze podczas pracybundle exec rake assets:precompile? W moim przypadku pliki css kończą się mieszaniem, a bootstrap.css jest nadpisywany przez activeadmin. Dowolny pomysł?. CristianOrellanaBak
nie działa dla mnie theDazzler

Powiązane pytania