corygibbons / soba

Kirby starter theme that uses Twig, PostCSS, and Browsersync

Soba

Starter theme for Kirby that uses Twig, PostCSS, and Browsersync.

Get Started

Make sure you have node & npm installed then download all of Soba's dependencies by running:

$ npm install

By default Soba will try to start PHP via command line with php -S then proxy it with Browsersync.

# Start PHP, PostCSS watcher, and Browsersync
$ npm start

If this doesn't work or you'd like a different PHP environment (Vagrant, MAMP, etc.) you can adjust the Browsersync config manually to fit your setup (likely just changing the proxy).

To run without starting PHP:

# Start PostCSS watcher and Browsersync
$ npm watch

Customization

CSS Syntax

Soba uses postcss-scss syntax but it can easily be switched out for something else. See available syntaxes.

To switch to sugarss for example:

$ npm install --save-dev sugarss

Edit parser in postcss.config.js:

module.exports = {
  ...
  parser: 'sugarss'
  ...
}