erikawithak / fewd31-assignment7

FEWD 31 DC: Homework #7

#FEWD Week #7: Responsive Design

---

###Description

Relaxr's user count has grown, and the number of users accessing the site from a mobile device has surprised everyone, even by today's standards. The product managers at Relaxr have asked you to return to the project and make their site responsive so it renders nicely on mobile devices. They had one of their internal developers make a few tweaks to your source code, and they have given you the new HTML / CSS files to work from. Using these starter files, build out the mobile layouts for the landing page and blog.

---

###Real-World Applications

• Use media queries to render different CSS files according to screen size
• Revisit applications and projects to iterate on and improve code you've written

---

###Technical Requirements

• Use media queries at a 768px breakpoint

• As a user changes the size of a browser window:

  • Content remains in appropriate divs
  • Content remains visible to the user
  • Fonts change size appropriately
  • Margins and padding change size appropriately
  • Content does not overlap
  • In the blog section, the two-column layout changes to a single-column layout when appropriate

Bonus

• Add different media queries for a 1000px breakpoint and a 480px breakpoint

---

###Resources

• Fastcodesign.com: Responsive Design
• More Responsive Reading

---

###Evaluation / Submission

Students should start by using the starter code and adding the proper CSS media queries and CSS to update the site to look good on mobile devices. Students will create a new repository on GitHub called "homework-responsive" and push their code to it when they are ready to submit. Students should also notify the instructional team via Slack or email once this is done. Instructional team should evaluate against the solution code and the student's use of technical elements. You will provide a numeric grade on a scale: does not meet expectations (0); meets expectations (1); exceeds expectations (2). Note: If bullet points have child bullets, grade the child bullets and not the parent bullet belonging to the child. The maximum possible score on this assignment is 28/28. Bonus materials are completely optional.

###Final Project Milestone 2

By week 7, you should have created a final project repository on GitHub and pushed psuedo code and a draft of the HTML/CSS for your application to that repo. This week, focus on drafting the JavaScript and jQuery you'll need for your application. Over the next few weeks, you'll be pushing updates to this same repo until your final project is complete.