0

I am using Foundation 6 with SASS and have a question.

I would like to make a copy of the _panels.scss file and make some changes, but also keep the formatting of the standard _panels.scss.

I made a direct copy, titled it _panels-foo.scss and added the @import in the foundation.scss file.

I see that my bundle watcher created the new entry in the CSS file, but any changes to the _panels-foo.scss file don't get updated. Only changes to the _panels.scss modify the CSS

What did I do incorrectly?

cimmanon
  • 67,211
  • 17
  • 165
  • 171
SteveV
  • 429
  • 3
  • 8
  • 18
  • Have you placed it after the @import for **_panels.scss**? If they're using the identical selectors the last declared property is used over any earlier properties. – BurpmanJunior Dec 03 '15 at 10:17
  • Yes, I did. Is there a way to divorce the two files? – SteveV Dec 03 '15 at 18:26
  • Did you try restarting the watch task? It might not detect changes to new files until you restart the watcher. – Colin Marshall Dec 04 '15 at 01:25
  • Yes, restarted the watcher. The order in which they files are referenced in the _foundation.scss file seems to be the key, but not sure why. – SteveV Dec 04 '15 at 18:52
  • Why not just override the scss file in your own custom styles.scss file? – Nathaniel Flick Dec 05 '15 at 09:46
  • @NathanielFlick, that's exactly what I'm trying to do, but being a SASS Padawan, I'm still learning how to do it. Can you recommend an article that describes how this is done? – SteveV Dec 07 '15 at 19:17
  • Just check the order your scss files are loaded and put your change in the last scss file. It will override any attribute references to it that are loaded before it. I recommend not editing the partial, that's your default, put the change in your own style.scss file instead, and make sure this file is loaded last in the chain. – Nathaniel Flick Dec 07 '15 at 20:19

0 Answers0