This is a sandbox project, which contains experimental code for developer use only.
Clarus is a SASS-enabled starter theme based on Susy for building custom responsive Drupal 7 themes. It uses semantic HTML5 elements and SMACSS classes for cleaner markup.
This theme is not meant to be used out of the box. Rather, it serves as a blank slate for projects which require a bespoke theme, thus this starter theme has all theme-able elements stripped of styles and layouts so the themer has a truly blank canvas to work with.
Included with this theme are basic extends and mixins for the following:
- removing all list styles
- centering block elements
- image replacement
- set element invisible on screen but visible for accessibility
- changing placeholder colours
- changing selection styles
- css shape mixins
- breakpoint mixins
- type-scale mixin
This theme uses Gulp to compile the Sass files to CSS. It also makes use of BrowserSync for live-reloading.
- NodeJS - You can use the installer, but I personally like using Homebrew
npm install -g bower
npm install -g gulp
drush dl browsersync -y
- This Drupal module is required for Browsersync to work. Go to Appearance > Settings and check Enable Browsersync.
- Clone this repository into your working directory.
- Navigate to the directory and run
npm install. This will install the required node modules for the project.
- Also run
bower install. This will install Susy for this project.
Running Gulp during theming
gulp. This will run the Gulp tasks needed for:
- compiling Sass,
- clearing cache after changes to info, inc and php files
- watching for changes to relevant folders and reloading the browser accordingly.