Merge pull request #1446 from hypothesis/fix-sass-3-4

Fix responsive styles when running Sass >= 3.4.

h/static/styles/responsive.scss

@@ -3,31 +3,31 @@ $break-medium: 768px !default;
 $break-large: 1024px !default;
 
 @mixin respond-to($media) {
-  @if type-of($media) == string {
-    @if $media == handhelds {
+  @if type-of($media) == 'string' {
+    @if $media == 'handhelds' {
       @media only screen and (max-width: $break-small) { @content; }
     }
-    @else if $media == wide-handhelds {
+    @else if $media == 'wide-handhelds' {
       @media only screen and (min-width: $break-small + 1) and (max-width: $break-medium) { @content; }
     }
-    @else if $media == tablets {
+    @else if $media == 'tablets' {
       @media only screen and (min-width: $break-medium + 1) and (max-width: $break-large) { @content; }
     }
-    @else if $media == desktops {
+    @else if $media == 'desktops' {
       @media only screen and (min-width: $break-large + 1) { @content; }
     }
   }
-  @else if type-of($media) == list {
-    @if index($media, handhelds) != false {
+  @else if type-of($media) == 'list' {
+    @if index($media, 'handhelds') {
       @media only screen and (max-width: $break-small) { @content; }
     }
-    @if index($media, wide-handhelds) != false {
+    @if index($media, 'wide-handhelds') {
       @media only screen and (min-width: $break-small + 1) and (max-width: $break-medium) { @content; }
     }
-    @if index($media, tablets) != false {
+    @if index($media, 'tablets') {
       @media only screen and (min-width: $break-medium + -1) and (max-width: $break-large){ @content; }
     }
-    @if index($media, desktops) != false {
+    @if index($media, 'desktops') {
       @media only screen and (min-width: $break-large + 1) { @content; }
     }
   }