It's time to put your new knowledge to work! In this assignment we'll take a previous project that you've completed and you'll refactor your CSS to use SASS.
- Choose a project that you've completed previously in this course
- Make sure it is a project that has enough CSS to give you a challenge to refactor it to use SASS
- Create a new folder in the project to contain your SASS style sheets
- Designate a completely new destination folder in which your SASS will be compiled to CSS
- This will allow you to keep your previous styles in the same project so you can properly migrate them to SASS
- Change the
link tags in your HTML files to target the location of the compiled CSS instead of the original CSS files
- Get refactoring!
Tips and Guidance
- Review your CSS styles before you start, have a plan of attack and pin point any styles than can be made reusable with mixins or extending.
- Find all the colors in your CSS and create a
_colors.scss file in which you set those colors to variables. Now include that file before all others via
@import and change those hard coded colors to your new SASS variables!
- Take advantage of SASS features and operations where ever you can! Remember, it is there to make your life easier!
- When you're finished with all tasks, push your changes up to your fork (aka
$ git push origin master).
- Your assignment will already by submitted since you made a pull request before.