A design focused front-end web development template using SASS and Jekyll.
Full site here
Good for single page websites.
- Twitter Botstrap
- Font Awesome
- Color Me SASS
Simple Jekyll setup for multipage site.
- Everything in Apple
- Jekyll file layout
For the developer interested in a fast multipage site.
- Everything in Blueberry
- .htaccess file for caching and gzipping
- SVG plugin for Jekyll
- SVGeezy.js for svg fallback
If you're a designer who avoids the terminal/command line at all costs and has no interest in opening it up, then this isn't really for you. Joke. Don't worry it's like two commands, you'll be fine.
Install Ruby on Rails. If you're on mac or windows just download RailsInstaller. That does all the hard work.
If you're using Apple do step 4, if not, then jump straight to step 5.
cd to your directory.
Install the SASS gem.
Annnnnnd, you're done. Dont forget to watch your SASS if you want to make changes.
Run 'bundle' and hit Enter.
Run 'jekyll serve --watch' or 'jekyll serve -w' to make changes to the html.
And I think that's it. Enjoy.
To watch your sass just run
$ sh watch.sh
If you files are in a different directory you'll have to edit watch.sh accordingly.
sass --watch [where your scss file is].scss:[where you want your css to go].css --style compressed
Using Chocolate Chip
Download & Install node.js. It's as simple as running an executable on Windows and Mac.
npm install -g gulp
cd into your directory and install all the dependencies
Unfortunately you'll need two terminal/command line windows or tabs to get this going from here on
In one of the windows (to watch Jekyll) run
jekyll serve --watch
In the second one (to watch for CSS and JS changes) run
And that should be it. Let me know if you run into any issues
Muffin is licensed under the ☺ license.
You, the licensee, are hereby granted free usage in both personal and commerical environments, without any obligation of attribution or payment (monetary or otherwise). The licensee is free to use, copy, modify, publish, distribute, sublicence, and/or merchandise the work, subject to the licensee inflecting a positive message unto someone. This includes (but is not limited to): smiling, being nice, saying “thank you”, assisting other persons, or any similar actions percolating the given concept.
The above copyright notice serves as a permissions notice also, and may optionally be included in copies or portions of the work.
The work is provided “as is”, without warranty or support, express or implied. The author(s) are not liable for any damages, misuse, or other claim, whether from or as a consequence of usage of the given work.
- Get gulp livereload to work in chocolate chip