title: Rails assets are in a sub directory and cannot load in production
body: <p>Currently my event CSS is in <code>app/assets/stylesheets/pages/events.scss</code> and in development mode it looks fine and the assets are loaded. But on production, it looks like these pages are not loaded at all. I'm not sure how to fix this problem. I've looked at <a href="https://stackoverflow.com/questions/18700219/rails-4-assets-not-loading-in-production">Rails 4: assets not loading in production</a> but I am not familiar with the <code>config.assets.precompile += %w( *.js ^[^_]*.css *.css.erb)</code> since it seems like the path itself is not working in production. </p>
  
  <p>app/assets/stylesheets/application.scss: </p>
  
  <pre><code>/*
   * This is a manifest file that'll be compiled into application.css, which will include all the files
   * listed below.
   *
  
  
   *#= require bootstrap-wysihtml5
   *#= require rails_bootstrap_forms
   *#= require jquery.jcrop
   *= require custom
   *= require_self 
  */
  
  @import "bootstrap-sprockets";
  @import "bootstrap";
  @import "scaffolds";
  </code></pre>
  
  <p>app/views/events/index.html.erb: </p>
  
  <pre><code>&lt;% content_for :head do %&gt;
    &lt;%= stylesheet_link_tag "pages/events", :media =&gt; "all" %&gt;
  &lt;% end %&gt;
  </code></pre>
  
  <p>app/assets/stylesheets/pages/events.scss</p>
  
  <pre><code>@import "globals/helpers";
  @import "vendors/animate";
  
  .events-bar {
  /*  a[class*="btn"] {
    height: 36px;
    display: inline-block;
  }*/
  #toggleBar {
    margin-top: 14px;
  }
  .btn-dashboard { 
     background-color: #fdf9ff;
     color: $eventsColour !important;  
     &amp;:hover {
       background-color: $eventsColour-dark !important;
     }
   }
  }
  </code></pre>
  
  <p>It's been hard to debug since it works fine in development and not in production. It looks like that all of the files in subdirectory (app/assets/stylesheet/pages/*.scss) are not working in production. Any insight will help, thanks.</p>