Glyphicon works locally but not on Heroku

Question

If you look at my app here: http://quiet-brushlands-5712.herokuapp.com/, close to the button is an icon, a glyphicon. But it's not appearing on heroku. locally it show as nicely like this:

I tried the "solution" from here Using boostrap.css file in Rails production/heroku w/o LESS or SASS and from other links in Google. I need the glyph to show on Heroku as well. Any help?

I didn't download the Twitter Bootstrap manually, I'm just using a gem. In my Javascript console I have this:

GET http://quiet-brushlands-5712.herokuapp.com/assets/glyphicons-halflings.png 404 (Not Found)

My Gemfile if it helps:

source 'https://rubygems.org'

gem 'rails', '4.0.2'
gem 'sass-rails', '~> 4.0.0'
gem 'uglifier', '>= 1.3.0'
gem 'coffee-rails', '~> 4.0.0'
gem 'jquery-rails', '3.0.4'
gem 'turbolinks', '2.0.0'
gem 'jbuilder', '~> 1.2'
gem 'bootstrap-sass', '2.1'
gem 'jquery-ui-rails', '4.1.0'
gem 'pg'
gem 'font-awesome-rails', '4.0.3.0'

group :doc do
  # bundle exec rake doc:rails generates the API under doc/api.
  gem 'sdoc', require: false
end

group :development, :test do
  gem 'rspec-rails', '2.11.0'
  gem 'guard-rspec', '1.2.1'
  gem 'guard-spork', '1.2.0'
  gem 'childprocess', '0.3.6'
  gem 'spork', '0.9.2'
end

group :production do
  gem 'rails_12factor'
end

Answer 1

The solution was to change config.assets.compile = false to config.assets.compile = true in the config/environments/production.rb file.

Answer 2

Solution that not use the compilation fallback (tested on Rails 4.1): In your scss files, import bootstrap-sprockets just before bootstrap.

@import "bootstrap-sprockets";
@import "bootstrap";