compile stylesheets separately

assets/brunch-config.js

@@ -1,7 +1,19 @@
 module.exports = {
   files: {
     javascripts: {joinTo: 'js/app.js'},
-    stylesheets: {joinTo: 'css/app.css'}
+    stylesheets: {
+      joinTo: {
+        'css/default.css': [
+          'css/themes/default.scss'
+        ],
+        'css/dark.css': [
+          'css/themes/dark.scss'
+        ],
+        'css/red.css': [
+          'css/themes/red.scss'
+        ]
+      }
+    }
   },
   plugins: {
     rollup: {
@@ -28,7 +40,7 @@ module.exports = {
     assets: /static\//
   },
   paths: {
-    watched: ['css/themes/default.scss', 'js/app.js', 'vendor', 'fonts', 'static'],
+    watched: ['css/themes/default.scss', 'css/themes/dark.scss', 'css/themes/red.scss', 'js/app.js', 'vendor', 'fonts', 'static'],
     public: '../priv/static'
   },
   modules: {

lib/philomena_web/templates/layout/app.html.slime

@@ -10,7 +10,7 @@ html lang="en"
         ' - Philomena
       - else
         ' Philomena
-    link rel="stylesheet" href=Routes.static_path(@conn, "/css/app.css")
+    link rel="stylesheet" href=stylesheet_path(@conn, @current_user)
     link rel="icon" href="/favicon.ico" type="image/x-icon"
     link rel="icon" href="/favicon.svg" type="image/svg+xml"
     meta name="generator" content="philomena"

lib/philomena_web/views/layout_view.ex

@@ -42,4 +42,13 @@ defmodule PhilomenaWeb.LayoutView do
 
     tag(:div, class: "js-datastore", data: data)
   end
+
+  def stylesheet_path(conn, %{theme: "dark"}),
+    do: Routes.static_path(conn, "/css/dark.css")
+
+  def stylesheet_path(conn, %{theme: "red"}),
+    do: Routes.static_path(conn, "/css/red.css")
+
+  def stylesheet_path(conn, _user),
+    do: Routes.static_path(conn, "/css/default.css")
 end