Support tablets and make display look better on iPhones.

1 files changed, 19 insertions, 3 deletions

diff --git a/app/assets/stylesheets/media-queries.css.scss b/app/assets/stylesheets/media-queries.css.scss
index bea6408..14b913a 100644
--- a/app/assets/stylesheets/media-queries.css.scss
+++ b/app/assets/stylesheets/media-queries.css.scss
@@ -3,18 +3,23 @@
   .container { min-height: 600px; }
 }
 
-/* Portrait tablet to landscape and desktop */
-@media (min-width: 768px) and (max-width: 979px) {
+@media (min-width: 979px) and (orientation: landscape) {
+  h1#logo { float: none; }
   #new_sign_up{
     .field{
       input[type="email"]{
-        width: 240px;
+        width: 540px;
       }
       margin-right: 20px;
     }
   }
 }
 
+/* Portrait tablet to landscape and desktop */
+@media (min-width: 768px) and (max-width: 979px) {
+  h1#logo { float: none; }
+}
+
 /* Landscape phone to portrait tablet */
 @media (max-width: 767px) {
   body { padding: 0; }
@@ -45,3 +50,14 @@
     }
   }
 }
+
+@media (max-width: 480px) and (orientation: landscape){
+  #new_sign_up{
+    .field{
+      input[type="email"]{
+        width: 400px;
+      }
+      margin-right: 20px;
+    }
+  }
+}