From 288bb5588f101a5218758726ca7ddf8fc48d022e Mon Sep 17 00:00:00 2001
From: Robin Ward <robin.ward@gmail.com>
Date: Tue, 1 Jul 2014 13:39:54 -0400
Subject: [PATCH] Use different approach for background image

---
 .../discourse/controllers/application.js.es6      |  6 ------
 .../discourse/views/application.js.es6            | 15 +++++++++++++++
 app/assets/stylesheets/common/base/discourse.scss |  5 ++++-
 app/assets/stylesheets/desktop/header.scss        |  2 --
 lib/sass/discourse_sass_importer.rb               |  2 +-
 5 files changed, 20 insertions(+), 10 deletions(-)
 create mode 100644 app/assets/javascripts/discourse/views/application.js.es6

diff --git a/app/assets/javascripts/discourse/controllers/application.js.es6 b/app/assets/javascripts/discourse/controllers/application.js.es6
index 0d1ccdad0c5..29d200ca082 100644
--- a/app/assets/javascripts/discourse/controllers/application.js.es6
+++ b/app/assets/javascripts/discourse/controllers/application.js.es6
@@ -1,9 +1,3 @@
 export default Ember.Controller.extend({
   styleCategory: null,
-
-  backgroundClass: function() {
-    var id = this.get('styleCategory.id');
-    if (Em.isNone(id)) { return; }
-    return "category-" + this.get('styleCategory.id');
-  }.property('styleCategory')
 });
diff --git a/app/assets/javascripts/discourse/views/application.js.es6 b/app/assets/javascripts/discourse/views/application.js.es6
new file mode 100644
index 00000000000..c354c2891ec
--- /dev/null
+++ b/app/assets/javascripts/discourse/views/application.js.es6
@@ -0,0 +1,15 @@
+export default Ember.View.extend({
+  _appendCategoryClass: function(obj, key) {
+    var newClass = Em.get(obj, key);
+    if (newClass) {
+      $('body').addClass('category-' + newClass);
+    }
+  }.observes('controller.styleCategory.id'),
+
+  _removeOldClass: function(obj, key) {
+    var oldClass = Em.get(obj, key);
+    if (oldClass) {
+      $('body').removeClass('category-' + oldClass);
+    }
+  }.observesBefore('controller.styleCategory.id')
+});
diff --git a/app/assets/stylesheets/common/base/discourse.scss b/app/assets/stylesheets/common/base/discourse.scss
index 22dc087edf1..2d28c543ffb 100644
--- a/app/assets/stylesheets/common/base/discourse.scss
+++ b/app/assets/stylesheets/common/base/discourse.scss
@@ -22,7 +22,10 @@ a.no-href {
 }
 
 body {
-    button.ok {
+  background-attachment: fixed;
+  background-size: cover;
+
+  button.ok {
     background: $success;
     color: $secondary;
     @include hover {
diff --git a/app/assets/stylesheets/desktop/header.scss b/app/assets/stylesheets/desktop/header.scss
index d8cf985229a..b8300e459c4 100644
--- a/app/assets/stylesheets/desktop/header.scss
+++ b/app/assets/stylesheets/desktop/header.scss
@@ -30,8 +30,6 @@
 
 #main-outlet {
   padding-top: 82px;
-  background-repeat: no-repeat;
-  background-position: 0 0;
 }
 
 // Dropdowns
diff --git a/lib/sass/discourse_sass_importer.rb b/lib/sass/discourse_sass_importer.rb
index 00b081ecc4f..f2404cccb75 100644
--- a/lib/sass/discourse_sass_importer.rb
+++ b/lib/sass/discourse_sass_importer.rb
@@ -50,7 +50,7 @@ class DiscourseSassImporter < Sass::Importers::Filesystem
       contents = ""
       Category.where('background_url IS NOT NULL').each do |c|
         if c.background_url.present?
-          contents << "#main-outlet.category-#{c.id} { background-image: url(#{c.background_url}) }\n"
+          contents << "body.category-#{c.id} { background-image: url(#{c.background_url}) }\n"
         end
       end
       return Sass::Engine.new(contents, options.merge(