Problem/Motivation
When creating a sub-theme in 7.x-5.0-rc1, there is a 'vendor' folder inside of the 'scss' folder which contains 'ie.scss', 'pie.scss', and a 'foundation' folder. This 'vendor' folder is no longer present in 7.x-5.0-rc2 (and all the files included inside of it).
I caught onto this because the README.txt file in the STARTER folder said this:
In order to avoid overwriting your customizations in _settings.scss when updating Zurb Foundation, subthemes default to placing the standard Foundation settings in [subtheme-name]/scss/_variables.scss.
If you prefer to do it the standard Foundation way (at your own risk), you can rename _variables.scss to _settings.scss in your subtheme and then load "settings" instead of "variables" in [subtheme-name]/scss/base/_init.scss.
I could not find the _variables.scss file and thought maybe there was a relation between this file no longer existing and the 'vendor' folder also missing? According to this (https://www.drupal.org/node/2415119), Gruntfile.js was changed in rc2.
Has rc2 been refactored to no longer need the 'vendor' folder? And also, why is there no 'variables.scss' file in the sub-theme?
Reason Why (from Comment #13)
ie.scss and pie.scss are not included because the newest version of compass no longer uses pie and foundation 5 dropped support for ie <= version 8 (see http://foundation.zurb.com/docs/compatibility.html ). The theme is now using grunt instead of compass as well, but pie wouldn't have a place either way since it's no longer in compass.
The vendor folder is is the parent theme so that it can updated, if it's included in the sub theme then updating the parent theme will not update the subthemes files, preventing it from using the updates.
The variables.scss is located in the parent theme, and can now be overridden in the subtheme by adding the variables that you need to scss/base/_init.scss, this allows the updates to the parent theme to be pulled into the subtheme. Previously it was all copied into the subtheme, so updating the parent theme had no effect on the subtheme's css.
Remaining tasks
The documentation needs to be updated to reflect these changes, the reasoning and updates should be included.
Comments
Comment #1
trevorkjorlien commentedComment #2
kevinquillen commentedYou would be correct. I don't see them either.
It happened in this commit:
http://cgit.drupalcode.org/zurb-foundation/commit/?id=a95fb48c935fd73a66...
Either the READMEs need to be updated as to what and why, or this should be reversed.
Comment #3
kevinquillen commentedI can see why this is a problem now. None of the mixins will map right because the import lines are broken paths. To fix this, change your includes to:
@import "../../zurb_foundation/scss/foundation/components/grid";This will reference the parent theme SCSS - since you should not be editing vendor level SCSS anyway. As for the other file, I am not sure what happened to that. This should be corrected ASAP.
Comment #4
kevinquillen commentedComment #5
jasonglisson commentedI can confirm that #3 works. Changing all paths in to "../../zurb_foundation/scss/foundation/components/" in your STARTER.scss file will fix the issue.
Comment #6
kevinquillen commentedI've updated the STARTER.scss file to have correct pathing and updated the README.txt.
Comment #7
kevinquillen commentedComment #8
Bcwald commentedI see the updated STARTER.scss but when you build a subtheme using drush FST, the MYTHEME.scss file it creates does not give the correct path still. The subtheme should relate back to the base theme zurb_foundation folder correct?
Comment #9
kevinquillen commentedYes, if it copies over STARTER.scss it should reference like:
"../../zurb_foundation/scss/foundation/components"
What is the path to your theme?
Comment #10
kevinquillen commentedI just tried this. When you drush fst, the STARTER theme should be copied and written into sites/*/themes, with the SCSS paths resolving correctly. How is your sites directory setup?
Comment #11
Bcwald commentedMy setup is a bit different because its a profile build.
/profile/df/theme/contriband the sub theme should be:
/profile/df/themes/cusotmI tried it as a standard method and it works ok. I know I need to change some paths to make it work (../../contrib/) but I think I must be missing some. I changed all the scss paths from THEME.scss and in the grunt file the base theme location. am I missing any? js path set somewhere?
Comment #12
Bcwald commentedOk I found the issue, by default when you create a FST it makes the
var base_theme_path = '../zurb-foundation';in the Gruntfile.js.But when I pull down the code the directory is zurb_foundation. This project has very confusing conventions for - and _.
Changing it to
var base_theme_path = '../zurb_foundation';fixed my issue when the grunt task pulling in the proper css/jsComment #13
kevinquillen commentedYeah. This is what I figured may happen. The - and _ issue is rooted in the original project name and as such, the git object in the repo being zurb-foundation.git. Not something I have the power to change, it is relayed to the d.o admins.
Secondly, this is why I had Bower copying in the vendor assets to STARTER or subtheme via Gruntfile.js - because we can't guarantee the path of the parent theme or sub theme. They could be anywhere.
Perhaps the best course of action is updating the drush command to overwrite these paths in these files to the best of its ability, and correct the zurb-foundation if it exists in the Gruntfile.
Comment #14
kevinquillen commentedComment #15
kevinquillen commentedComment #16
Bcwald commentedYeah I was able to normalize this in my make script by adding:
Comment #17
kevinquillen commentedComment #18
kevinquillen commentedJust committed this to dev:
I tested this by changing STARTER back to zurb-foundation and generating themes with FST. In my themes, the base_theme_name was set correctly to zurb_foundation.
It may be best to note this in the README for specialized instances like being part of a profile.
Comment #19
kevinquillen commentedComment #20
Bcwald commentedThis method worked for my set up.
Comment #21
kevinquillen commentedComment #22
istryker commentedNo this is not fixed. Had RC5, downloaded RC6 (with the suppose fix). Ran 'drush fst custom_zurb' and there is not vendor folder.
Comment #23
istryker commentedTODO:
HELPFUL TIPS:
Comment #24
FiLeVeR10 commented@iStryker
ie.scss and pie.scss are not included because the newest version of compass no longer uses pie and foundation 5 dropped support for ie <= version 8 (see http://foundation.zurb.com/docs/compatibility.html ). The theme is now using grunt instead of compass as well, but pie wouldn't have a place either way since it's no longer in compass.
The vendor folder is is the parent theme so that it can updated, if it's included in the sub theme then updating the parent theme will not update the subthemes files, preventing it from using the updates.
The variables.scss is located in the parent theme, and can now be overridden in the subtheme by adding the variables that you need to scss/base/_init.scss, this allows the updates to the parent theme to be pulled into the subtheme. Previously it was all copied into the subtheme, so updating the parent theme had no effect on the subtheme's css.
The documentation needs to be updated to reflect these changes, the reasoning and updates should be included.
Comment #25
jweedman commented@FiLeVeR10 comment #24:
Thanks for a great explanation. Completely makes sense that updating the vendor folder requires it to be in the parent theme. I was running into trouble by trying to override variables in my own custom scss component file. Tested it and it seems that putting those variables in the base/_init.scss file compiles it correctly. Also, great information about ie, pie, grunt & compass.
Comment #26
istryker commentedYes #13 Explainion is great. I think we can close this issue once we update the documentation. Updated Issue Summary.
Comment #27
lebernd commentedIt works great and thank you for the explanation.
I would suggest to put comments on that in the _init.scss file. I began searching a _settings.scss file as from the framework-git and ended up here an hour or two later... Or even in the documentation?
(by the way, it's my first comment - I hope that I more or less matched the topic).
oh, I just have read the last post - So I just vote for a place in the docs...
Comment #28
NiklasBr commentedJust like @lebernd it took me quite a while to understand this and why it was like this. A comment about this in STARTER.scss or _init.scss would be great!