Create separate stylesheets for dashboard and the rest

Assetfile

@@ -71,10 +71,15 @@ end
 
 output 'public/styles'
 input assets.styles do
-  match '**/*.{scss,sass,css}' do
+  match 'app/**/*.{scss,sass,css}' do
     sass assets.production? ? { style: :compressed } : {}
     concat assets.styles_order, ['app.css']
   end
+
+  match 'dashboard/**/*.{scss,sass,css}' do
+    sass assets.production? ? { style: :compressed } : {}
+    concat assets.styles_order, ['dashboard.css']
+  end
 end
 
 output 'public/images'

assets/scripts/app/routes/dashboard.coffee

@@ -2,6 +2,13 @@ require 'routes/route'
 
 TravisRoute = Travis.Route
 
-Route = TravisRoute.extend()
+Route = TravisRoute.extend
+  activate: ->
+    @get('stylesheetsManager').disable('main')
+    @get('stylesheetsManager').enable('dashboard')
+
+  deactivate: ->
+    @get('stylesheetsManager').enable('main')
+    @get('stylesheetsManager').disable('dashboard')
 
 Travis.DashboardRoute = Route

assets/scripts/app/templates/dashboard.hbs

@@ -1 +1 @@
-DASHBOARD GOES HERE!
+<h1>DASHBOARD GOES HERE!</h1>

assets/scripts/travis.coffee

@@ -190,6 +190,21 @@ Travis.initializer
 
     application.inject('route', 'pusher', 'pusher:main')
 
+stylesheetsManager = Ember.Object.create
+  enable: (id) ->
+    $("##{id}").removeAttr('disabled')
+
+  disable: (id) ->
+    $("##{id}").attr('disabled', 'disabled')
+
+Travis.initializer
+  name: 'inject-stylesheets-manager'
+
+  initialize: (container, application) ->
+    application.register 'stylesheetsManager:main', stylesheetsManager, { instantiate: false }
+
+    application.inject('route', 'stylesheetsManager', 'stylesheetsManager:main')
+
 Travis.Router.reopen
   didTransition: ->
     @_super.apply @, arguments

assets/styles/app/_mixins/all.sass

@@ -1,4 +1,4 @@
-@import "app/compass"
+@import "compass"
 @import "app/_mixins/colors"
 @import "app/_mixins/fonts"
 

assets/styles/app/forms.scss

@@ -1,4 +1,4 @@
-@import "app/compass";
+@import "compass";
 
 .pro {
   form.subscription-form {

assets/styles/dashboard/dashboard.scss

@@ -0,0 +1,3 @@
+h1 {
+  color: #A80000;
+}

public/index.html

@@ -23,7 +23,8 @@
     <link rel="dns-prefetch" href="//api.github.com">
     <link rel="dns-prefetch" href="//www.gravatar.com">
     <link rel="icon" type="image/png" href="/favicon.ico">
-    <link rel="stylesheet" href="/styles/app.css">
+    <link rel="stylesheet" href="/styles/app.css" id="main">
+    <link rel="stylesheet" href="/styles/dashboard.css" id="dashboard" />
     <script src="/scripts/app.js"></script>
     <script>
       minispade.require('travis')

public/styles/dashboard.css

@@ -0,0 +1,4 @@
+/* line 1, /Users/drogus/code/travis/travis-web/assets/styles/dashboard/dashboard.scss */
+h1 {
+  color: #A80000;
+}