change sizes for smaller screen

updated the media query to take 640px changed some margins and font sizes for smaller screen to make them even smaller:
hdra · Apr 21, 2013 · 2cafeef · 2cafeef
1 parent 84d52d4
commit 2cafeef
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 7 deletions.
diff --git a/static/css/blog.css b/static/css/blog.css
@@ -158,6 +158,16 @@ body {
 
   .post-entry {
     padding: 0 12px; } }
-@media only screen and (max-width: 480px) {
-  #nav-links li {
-    display: block; } }
+@media only screen and (max-width: 640px) {
+  #nav-links {
+    font-size: 1.1em; }
+
+  #site-desc {
+    font-size: 1em; }
+
+  #site-title h1 {
+    font-size: 1.3em;
+    margin: 0.1em 0px; }
+
+  #site-info {
+    font-size: 0.6em; } }
diff --git a/static/css/sass/blog.scss b/static/css/sass/blog.scss
@@ -199,10 +199,18 @@ body{
     }
 }
 
-@media only screen and (max-width: 480px) {
+@media only screen and (max-width: 640px) {
     #nav-links{
-        li{
-            display: block;
-        }
+        font-size: 1.1em;
+    }
+    #site-desc{
+        font-size: 1em;
+    }
+    #site-title h1{
+        font-size: 1.3em;
+        margin: 0.1em 0px;
+    }
+    #site-info{
+        font-size: 0.6em;
     }
 }