Customize a Grail Build

This page will list ways of customizing a build of grail-css.

Namingspacing classes

If you have existing classes in use that conflict with those specified by Grail, then you can create a custom class prefix by overwriting the $grail-class-prefix Sass variable.

@use "/path/to/node_modules/grail-css/src/variables.scss" with (
  $grail-class-prefix: 'layout-'
);

@import "/path/to/node_modules/grail-css/src/grail.scss";

Using the above, all grail classes will begin with layout-. For example: layout-html, layout-body, layout-main