Menu icon Foundation
SCSS files in Foundation 6 project

I am fairly new to scss and I am trying to understand the various file relationships. I've created a basic sites site using Yeti Launch and I get the standard file structure. I understand that the _settings.scss file can control the various variable, but I am confused on the scss files in the components folder (ie see the last example on the scss page - http://foundation.zurb.com/sites/docs/sass.html). When I make a change in one of these files, I do not see Yeti Launch compiling anything. How do I compile these files and where do they go?

Second question, when I add the mix-in @include top-bar-stacked; where does it go? Does this go in the app.scss?

Thanks for the help. I slowly teaching myself Foundation 6 with a test website and I appreciate any help.

-Scott

foundation 6scssyeti launch

I am fairly new to scss and I am trying to understand the various file relationships. I've created a basic sites site using Yeti Launch and I get the standard file structure. I understand that the _settings.scss file can control the various variable, but I am confused on the scss files in the components folder (ie see the last example on the scss page - http://foundation.zurb.com/sites/docs/sass.html). When I make a change in one of these files, I do not see Yeti Launch compiling anything. How do I compile these files and where do they go?

Second question, when I add the mix-in @include top-bar-stacked; where does it go? Does this go in the app.scss?

Thanks for the help. I slowly teaching myself Foundation 6 with a test website and I appreciate any help.

-Scott

Hans McMurdy over 3 years ago

Open the project in terminal and run gulp sass. If you don't get an error it should be fine.

As for the second question, yes app.scss because that file is pulling in data from settings.scss and has access to the mixin.

Scott Koons over 3 years ago

Thanks Hans. I'll play around with it tonight.