Assets

używam w css plików z assets/images
kod z ror assets/stylesheets

#top{ clear: both; background-image: url("logo.jpg"); width:200px;}
do przeglądarki jakby nie trafiały linie z użytymi assets
kod ze źródła strony:

[code]#top{
clear: both;
width: 200px;

}[/code]
może ma ktoś sugestie co zrobiłam źle , wcześniej działało…

no i takie cuś

bundle exec rake assets:precompile /usr/local/rvm/rubies/ruby-1.8.7-p371/bin/ruby /usr/local/rvm/gems/ruby-1.8.7-p371@alicja/bin/rake assets:precompile:all RAILS_ENV=production RAILS_GROUPS=assets rake aborted! File to import not found or unreadable: bootstrap.

Wydaje mi się, że musisz dodać gem bootstrapa do pliku Gemfile:

gem "bootstrap-sass"

Po instalacji gema zrestartuj serwer, wykonaj pre-kompilację i sprawdź co leci do przeglądarki.

mam wdrozonego gema zgodnie z

gem 'compass' gem 'json' gem 'bootstrap-sass', '2.1.0.1' gem 'sass-rails', '~> 3.2.3' gem 'coffee-rails', '~> 3.2.1' gem 'uglifier', '>= 1.0.3' gem 'execjs','1.4.0' gem 'therubyracer','0.10.2'

[quote=alicja]mam wdrozonego gema zgodnie z

gem 'compass' gem 'json' gem 'bootstrap-sass', '2.1.0.1' gem 'sass-rails', '~> 3.2.3' gem 'coffee-rails', '~> 3.2.1' gem 'uglifier', '>= 1.0.3' gem 'execjs','1.4.0' gem 'therubyracer','0.10.2'
[/quote]
A nie jest to czasem umieszczone w grupie :assets ? Jeśli tak, to bootstrap-sass należy przenieść do ogólnej listy gemów (bez przypisania grupy). Podeślij może cały Gemfile.
Upewnij się również czy gem jest na pewno zainstalowany:

gem list --local

może spróbuj:

background-image: url("/assets/logo.jpg");

Bardzo dziękuje za odpowiedzi, wszystkie ustawienia jakie podałam były prawidłowe pomogło dodanie

@import “bootstrap”

do wszystkich plików css , myslałam , że wystarczy do application.css

wtedy przeszła prekompilacja prawidłowo

pzdr.
ala

[quote=alicja]Bardzo dziękuje za odpowiedzi, wszystkie ustawienia jakie podałam były prawidłowe pomogło dodanie

@import “bootstrap”

do wszystkich plików css , myslałam , że wystarczy do application.css

wtedy przeszła prekompilacja prawidłowo

pzdr.
ala[/quote]
Importowanie bootstrap do każdego pliku css nie jest wg mnie wskazane. Przy pre-kompilacji w każdym pliku, który importuje bootstrap, będą dołączane te same style. W wyniku tego utworzy się wiele powtórzeń. Lepszym rozwiązaniem będzie zaciągniecie bootstrapa tylko raz. Zgodnie z tym tutorialem, najlepiej to zrobić przez utworzenie nowego pliku:

app/assets/stylesheets/bootstrap_and_overrides.css.scss

@import "bootstrap";

Plik ten zostanie automatycznie dołączony przy kompilacji pod warunkiem, że posiadasz linijkę:

*= require_tree .

w pliku app/assets/stylesheets/application.css.scss

[quote=alicja]Bardzo dziękuje za odpowiedzi, wszystkie ustawienia jakie podałam były prawidłowe pomogło dodanie
@import “bootstrap”
do wszystkich plików css , myslałam , że wystarczy do application.css[/quote]
W żadnym wypadku! :wink:

Tak jak pisze Dawids, spowoduje to ogromny plik css. Należy rozróżnić przede wszystkim require i @import. Różnica jest zasadnicza, require umieści wprawdzie kod w pliku css, ale chcąc korzystać ze wszystkich dobrodziejstw bootstrapa trzeba użyć @import, które jest słowem kluczowym sass (zresztą tak samo jest przy używaniu less). Zauważ tutaj, że require jest używane zarówno do plików css, jak i js.

Gdybyś chciała pobawić się bootstrapem jeszcze fajniej, to możesz na przykład sama definiować, co chcesz zaciągnąć. Nie wiem jak wygląda Twój plik bootstrap_and_overrides, ale możesz zamiast:

@import "bootstrap"

napisać:

[code=css]// Reset
@import “bootstrap/reset”

// Core variables and mixins
@import “bootstrap/variables”
@import “bootstrap/mixins”

// Grid system and page structure
@import “bootstrap/scaffolding”
@import “bootstrap/grid”
@import “bootstrap/layouts”

// … cała reszta[/code]
Daje Ci to dwie fajne rzeczy. Możesz dodać tylko te części, które Ci pasują (ja często biorę grid / layout / responsive, ale już reszty nie) i oczywiście nadpisać pliki bootstrap/variables jakimiś swoimi.

Pełną listę masz w tym pliku: https://github.com/twitter/bootstrap/blob/master/less/bootstrap.less
Oczywiście musisz dodawać przedrostek bootstrap/ i usuwać rozszerzenie .less, ale ogólnie nazwy plików powinny się zgadzać.

Listę zmiennych masz tutaj: http://twitter.github.com/bootstrap/customize.html

Importowanie bootstrapa niesie za sobą jeszcze jedno dobrodziejstwo, o którym pisałem, tzn. używanie zmiennych i mixinów. Czyli możesz napisać:

.my-fancy-alert @extend .alert-danger font: @serifFontFamily //to jest zmienna bootstrapa
Jest to w wielu przypadkach znacznie lepsze niż dodawanie klas w kodzie html. Nie jestem tylko pewien, czy tu właśnie powinno być @extend, czy @include alert-danger. Ogólnie w less to jest słitaśnie rozwiązane, bo zarówno dziedziczenie właściwości jak i mixiny są załatwione tak samo, czyli po prostu:

.my-fancy-alert { .alert-danger; }
Jak to jest w sass bootstrap - możesz sprawdzić empirycznie lub patrząc w kod.

I jeszcze ostatnia uwaga na temat assetów, która niektórm przysparza z tego co wiem sporo kłopotów. Jeśli koniecznie chcemy umieścić na stronie jakiś plik css inny niż application.css, za pomocą htmlowego (bo na przykład będzie potrzebny tylko na jednej specyficznej stronie), to plik ten musi być wymieniony w enviroments/production.rb w sekcji:

config.assets.precompile += %w( my_weird_css_file.css )

Wtedy ten plik również będzie prekompilowany i będzie można go umieścić w htmlu za pomocą:

= stylesheet_link_tag 'my_weird_css_file.css'

Z taką wiedzą możesz teraz w pełni wykorzystać moc bootstrapa :smiley: Pisz, jakbyś jeszcze miała wątpliwości, bo temat assetów wcale nie jest taki prosty jak się to niektórym wydaje :slight_smile:

bardzo dziękuje, wczesniej używałam twitter-bootstrapa lass jednak na tej wersji ruby i gemach mam problem z uruchomieniem tego gema.
jeszcze raz bardzo dziękuje sarniak za materiały, cos super xd