Theme Engine

[julianlam]

Allow users to plug in other bootstrap themes, settable via admin panel.

For kicks -- see if you can get this theme to be loaded

[julianlam]

6e91810 introduces the theme engine

[julianlam]

Spec Doc for Theme Engine

• Base foundation is Twitter Bootstrap
• /public/css/ is to be deprecated
• A base theme is installed by default via npm package nodebb-theme-vanilla
  • It's primary purpose is to override the "bootstrappiness" of Bootstrap
• If the meta config theme:id (referred to here as {theme:id}) is set, NodeBB will look for a theme in /node_modules/nodebb-theme-{theme:id}, and attempt to load its theme.json file
  • Installation script will automatically set theme:id to "vanilla", thus defaulting loading of nodebb-theme-vanilla
• src in theme.json is now deprecated
• If /node_modules/nodebb-theme-{theme:id}/{theme:id}.css exists, use that as the main CSS file for NodeBB. end., else...
• theme.json will look for a .less file at /node_modules/nodebb-theme-{theme:id}/{theme:id}.less
  • This file will import (using less' @import) subsidiary LESS files as necessary
  • If the theme is a child of another theme, then the parent theme will be a dependency (included in the theme's package.json, so it is installed automatically)
  • e.g. @import "account.less";, @import "node_modules/nodebb-theme-vanilla/topic.less";
• Then, NodeBB will automatically call a LESS compiler to combine and minify the .less file (/node_modules/nodebb-theme-{theme:id}/{theme:id}.less) into a single .css file
  • This means we will be deprecating less-middleware in favour of less
• This .css file (named {theme:id}.css) will be served to the end user.
  • app.use("/css/myfile.css", express.static(__dirname + '/css/myfile.css')); -- source
• While we're at it, add a --clear-cache flag to NodeBB so the .css file is regenerated on server restart
  • Maybe a --no-cache?