jackfranklin/javascriptplayground.com — pull request #9 by jadbirch (2013-07-11 14:59:39+00:00)
Title: Responsiveness modifications

Support for responsiveness for iPads, smaller tablets and iPhones. I will add a fallback query so a collapsed version is available for screens narrower than 320px if you let me know this is already along the right lines. I am sure I have missed some areas, especially on devices I haven't been able to physically test on but the basis for a more responsive site is there.

**iPhone 4S (test on my own phone):**

*Home screen*

![img_0262](https://f.cloud.github.com/assets/3235274/782237/a9542842-ea37-11e2-818e-73cf748716ae.PNG)

*Second section collapses underneath the latest posts*

![img_0264](https://f.cloud.github.com/assets/3235274/782275/721f01a2-ea38-11e2-8972-aa8899686034.PNG)

*Post screen*

![img_0263](https://f.cloud.github.com/assets/3235274/782266/56a54530-ea38-11e2-90af-9df9dcb2fb49.PNG)

*Images in post scale down nicely*

![images in posts](http://i.imgur.com/uY7hxTp.png)

**iPad 2 (my own):**

*Home screen portrait*

![img_0172](https://f.cloud.github.com/assets/3235274/782289/c0a3ec34-ea38-11e2-8870-b87a19882520.PNG)

*Home screen landscape*

![img_0173](https://f.cloud.github.com/assets/3235274/782293/d03630c6-ea38-11e2-808f-2f2c1fb69d6b.PNG)

*Post screen portrait*

![img_0175](https://f.cloud.github.com/assets/3235274/782307/0aa31846-ea39-11e2-9001-6b1c7e255d70.PNG)

*Post screen landscape*

![img_0174](https://f.cloud.github.com/assets/3235274/782308/109d67e2-ea39-11e2-8cb7-b8d30365a908.PNG)

**Small tablet (800 x 600) (not my devices - using [http://lab.maltewassermann.com/viewport-resizer/](http://lab.maltewassermann.com/viewport-resizer/):**

*Home screen portrait*

![smalltablet](http://i.imgur.com/mSn3Bxv.png)

*Home screen landscape*

![smalltabletlandscape](http://i.imgur.com/ZZdtyep.png)

*Post screen portrait*

![smalltabletpost](http://i.imgur.com/0nhWkH0.png)

*Post screen landscape*

![smalltabletpostl](http://i.imgur.com/OafL1uA.png)