What You'll Be Creating During this tutorial we will be building the fantastic Timeline Portfolio as seen in an earlier tutorial by Tomas Laurinavicius. We will be using some responsive techniques as well as CSS3 animations, Sass and a little bit of jQuery. File and Directory Structure OK, the first step is to create the files and folders we need. The image below shows our root structure. As you can see, we have a very simple set up here. Inside the "css" directory go ahead and create a styles.scss file and also grab a copy of normalize.css . In order to use Sass in this project you will either need Sass installed on your machine or you will need an app to do the watching and compiling for you. I am currently using CodeKit for Mac, but there are plenty of alternatives such as Prepos , Scout , and Koala to name a few. They aren't all free, but whichever one you choose will save you a lot of time! Inside the "js" folder create a file called app.js and download a copy of modernizr.js to place here as well.
↧