-
Notifications
You must be signed in to change notification settings - Fork 1
SCSS
metamn edited this page Jun 17, 2015
·
3 revisions
There should be a site/assets/styles/site.scss and a styleguide/assets/styles/styleguide.scss file @importing all other .scss files from components. These two files will be then compiled and minified with gulp scss.
If you are using the BEM folders the site.scss should look like:
@import '../../components/framework/structure/**/*.scss';
@import '../../components/framework/design/**/*.scss';
@import '../../components/framework/behavior/**/*.scss';
@import '../../components/project/**/*.scss';
@import '../../components/pages/**/*.scss';
If you are using the BEM folders the styleguide.scss should look like:
// Import everything from /site
@import '../../../site/components/framework/structure/**/*.scss';
@import '../../../site/components/framework/design/**/*.scss';
@import '../../../site/components/framework/behavior/**/*.scss';
@import '../../../site/components/project/**/*.scss';
@import '../../../site/components/pages/**/*.scss';
// Styleguide
@import '../../components/framework/structure/**/*.scss';
@import '../../components/framework/design/**/*.scss';
@import '../../components/framework/behavior/**/*.scss';
@import '../../components/project/**/*.scss';
@import '../../components/pages/**/*.scss';
It is very important the order of importing files. First all common, later-reused components should be imported then the top level ones. Otherwise some mixins might not be found