├── .gitignore ├── LICENSE.md ├── README.md └── sass.sh /.gitignore: -------------------------------------------------------------------------------- 1 | ### OSX ### 2 | .DS_Store 3 | .AppleDouble 4 | .LSOverride 5 | 6 | # Icon must end with two \r 7 | Icon 8 | 9 | 10 | # Thumbnails 11 | ._* 12 | 13 | # Files that might appear in the root of a volume 14 | .DocumentRevisions-V100 15 | .fseventsd 16 | .Spotlight-V100 17 | .TemporaryItems 18 | .Trashes 19 | .VolumeIcon.icns 20 | 21 | # Directories potentially created on remote AFP share 22 | .AppleDB 23 | .AppleDesktop 24 | Network Trash Folder 25 | Temporary Items 26 | .apdisk 27 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 Ratik Sharma 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Sass-Struct 2 | ----------- 3 | 4 | ## Why? 5 | 6 | While searching the web for best-practices regarding Sass project structures, I stumbled upon one which I really liked. Now, none of us want to sit and create the same file structure again and again everytime we pick up a new front-end project, right? Automation to the rescue! This is why I wrote this script. 7 | 8 | You can read more about the Sass folder structure I refer to here: http://www.sitepoint.com/architecture-sass-project/ 9 | 10 | ## Bonus 11 | The script also asks the users if they want to install **Bourbon**[1] and **Neat**[2] along with the whole structure generation. This will obviously only work if you have the respective gems installed. 12 | 13 | [1] https://github.com/thoughtbot/bourbon 14 |
15 | [2] https://github.com/thoughtbot/neat 16 | 17 | ## Usage 18 | 19 | + Clone the repo onto your computer. 20 | + Copy the 'sass.sh' file to a location where you you want to the sass structure generated (for instance, the assets folder) 21 | + **cd** into the location where you placed the script and run: 22 | 23 | ```Bash 24 | 25 | ./sass.sh 26 | 27 | ``` 28 | + A 'sass' directory will be created for you with the folder structure and imports. Sass-away! 29 | 30 | -------------------------------------------------------------------------------- /sass.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | mkdir sass 3 | cd sass 4 | touch main.scss 5 | mkdir base components helpers layout pages vendors 6 | cd base 7 | touch _normalize.scss _typography.scss _all.scss 8 | echo -e "@import 'normalize';\n@import 'typography';" > _all.scss 9 | cd ../components 10 | touch _buttons.scss _navigation.scss _all.scss 11 | echo -e "@import 'buttons';\n@import 'navigation';" > _all.scss 12 | cd ../helpers 13 | touch _vars.scss _mixins.scss _functions.scss _helpers.scss _all.scss 14 | echo -e "@import 'vars';\n@import 'mixins';\n@import 'functions';\n@import 'helpers';" > _all.scss 15 | cd ../layout 16 | touch _header.scss _footer.scss _forms.scss _grid.scss _all.scss 17 | echo -e "@import 'grid';\n@import 'header';\n@import 'footer';\n@import 'forms';\n" > _all.scss 18 | cd ../pages 19 | touch _home.scss _contact.scss _about.scss _all.scss 20 | echo -e "@import 'home';\n@import 'contact';\n@import 'about';" > _all.scss 21 | cd ../vendors 22 | touch _all.scss 23 | read -p "Do you want to install bourbon? (y/n): " bourbon 24 | if [ $bourbon = "y" ] 25 | then 26 | bourbon install 27 | echo -e "@import 'bourbon/bourbon';\n" > _all.scss 28 | fi 29 | read -p "Do you want to install neat? (y/n): " neat 30 | if [ $neat = "y" ] 31 | then 32 | neat install 33 | echo -e "@import 'neat/neat';\n" >> _all.scss 34 | fi 35 | cd .. 36 | echo -e "@import 'vendors/all';\n@import 'components/all';\n@import 'helpers/all';\n@import 'base/all';\n@import 'layout/all';\n@import 'pages/all';\n" > main.scss 37 | echo "All done! Sass-away!" 38 | exit 39 | --------------------------------------------------------------------------------