Hands on 2

[mjuniper]

Make some CSS/SASS changes

1. If the app is not already running, run gulp serve.
2. Create a local "feature branch": git checkout -b sass-edits
3. Edit /app/styles/_variables.scss. For instance, you could change the $body-bg variable to another color.
4. Note that the SASS was compiled to CSS and reloaded in the browser.
5. In the running app, navigate to the search results page by doing a search for "water".
6. Add new page-specific nested rules in the /app/styles/results.scss file. For instance, you might add a rule to change the color of the h2. Note that the rule for the h2 is nested inside #page-results.
7. Note that the SASS was compiled to CSS and reloaded in the browser.
8. Add and commit your changes to your branch: git add . && git commit -m "sass changes"
9. Switch to the master branch: git checkout master
10. Note that you no longer see your changes in the app - your changes are in your feature branch, not master.
11. Merge your branch into master: git merge sass-edits
12. Note that your changes are now in the master branch - you see them in the app.