Here is how to get Semantic-UI-Less working in Keystone:
Directory structure:
styles
|- semantic
- definitions
- elements
- globals
- themes
- semantic.less
- theme.config
- theme.less
|- site
- layout.less
- site.min.css
- variables.less
|- site.less
|- site.min.css
Make sure you have a Semantic-UI theme in the themes
directory.
Make sure you have theme.config
& theme.less
files.
Then inside your site.less
// styles/site.less
@import "semantic/semantic.less";
Inside your semantic.less
// styles/semantic/semantic.less
/* Globals */
@import "definitions/globals/reset";
@import "definitions/globals/site";
/* Elements */
@import "definitions/elements/button";
@import "definitions/elements/divider";
@import "definitions/elements/flag";
@import "definitions/elements/header"
You'll also need to remove any reference to bootstrap variables in site/layout.less