fix media queries for iPhone

TechAtNYU · Apr 26, 2014 · f807bdd · f807bdd
1 parent 6b93c37
commit f807bdd
Show file tree

Hide file tree

Showing 3 changed files with 52 additions and 3 deletions.
diff --git a/_site/lib/css/styles.css b/_site/lib/css/styles.css
@@ -740,7 +740,8 @@ li[class^='past']:hover div:last-child {
 }
 @media only screen and (max-width: 30em) {
   .grid li,
-  .grid.sponsors li {
+  .grid.sponsors li,
+  .grid li.half {
     width: 100%;
     padding: 1em;
     margin-bottom: 5%;
@@ -753,6 +754,22 @@ li[class^='past']:hover div:last-child {
   }
 }
 @media only screen and (max-width: 40em) {
+  header {
+    margin-top: 2.75rem;
+  }
+  .back-to-future {
+    position: fixed;
+    z-index: 999;
+    width: 100%;
+  }
+  .back-to-future small,
+  .back-to-future h5 {
+    display: inline;
+    font-size: 1.5rem;
+  }
+  .back-to-future h5:before {
+    content: "• ";
+  }
   header.main {
     background-position: center bottom;
     min-height: 30em;

diff --git a/lib/css/_less/media-queries.less b/lib/css/_less/media-queries.less
@@ -109,7 +109,7 @@
 
 } 
 @media only screen and (max-width: 30em) {
-    .grid li, .grid.sponsors li {
+    .grid li, .grid.sponsors li, .grid li.half {
 	  width: 100%;
 	  padding: 1em;
 	  margin-bottom: 5%;
@@ -122,6 +122,21 @@
 	}
 }
 @media only screen and (max-width: 40em) {
+	header {
+		margin-top: 2.75rem;
+	}
+	.back-to-future {
+		position: fixed;
+		z-index: 999;
+		width: 100%;
+		small, h5 {
+			display: inline;
+			font-size: 1.5rem;
+		}
+		h5:before {
+			content: "• ";
+		}
+	}
 	header.main {
 		background-position: center bottom;
 		min-height: 30em;

diff --git a/lib/css/styles.css b/lib/css/styles.css
@@ -740,7 +740,8 @@ li[class^='past']:hover div:last-child {
 }
 @media only screen and (max-width: 30em) {
   .grid li,
-  .grid.sponsors li {
+  .grid.sponsors li,
+  .grid li.half {
     width: 100%;
     padding: 1em;
     margin-bottom: 5%;
@@ -753,6 +754,22 @@ li[class^='past']:hover div:last-child {
   }
 }
 @media only screen and (max-width: 40em) {
+  header {
+    margin-top: 2.75rem;
+  }
+  .back-to-future {
+    position: fixed;
+    z-index: 999;
+    width: 100%;
+  }
+  .back-to-future small,
+  .back-to-future h5 {
+    display: inline;
+    font-size: 1.5rem;
+  }
+  .back-to-future h5:before {
+    content: "• ";
+  }
   header.main {
     background-position: center bottom;
     min-height: 30em;