From f7ee905181f55602ba5f2f6fb69fad65b4f6d587 Mon Sep 17 00:00:00 2001
From: Sami Samhuri <sami.samhuri@gmail.com>
Date: Fri, 26 Nov 2010 23:21:41 -0800
Subject: [PATCH] tweak css for iPhone

---
 proj/proj.css |  4 ++--
 style.css     | 61 ++++++++++++++++++++++++++++++---------------------
 2 files changed, 38 insertions(+), 27 deletions(-)

diff --git a/proj/proj.css b/proj/proj.css
index 036eff4..ecf6102 100644
--- a/proj/proj.css
+++ b/proj/proj.css
@@ -37,8 +37,7 @@ h4 { margin: 0.5em 0 0.7em }
                      }
 
 @media only screen and (max-device-width:480px) {
-  #info { width: 80%
-        ; max-width: 400px
+  #info { width: 70%
         ; padding: 0 1em
         }
 
@@ -47,5 +46,6 @@ h4 { margin: 0.5em 0 0.7em }
               ; max-width: 100%
               ; padding: 0.5em 0.2em 1em
               ; border-left: none
+              ; font-size: 1em
               }
 }
diff --git a/style.css b/style.css
index 0d466ee..6591782 100644
--- a/style.css
+++ b/style.css
@@ -19,18 +19,6 @@ h2 { text-align: center
    ; padding: 0
    }
 
-ul { text-align: center
-   ; margin: 0 auto
-   ; padding: 1em
-   ; border: solid 1px #ccc
-   ; width: 90%
-   ; max-width: 950px
-   ; background-color: #fff
-   ; border-radius: 20px
-   ; -webkit-border-radius: 20px
-   ; -moz-border-radius: 20px
-   }
-
 a { color: #22a
   ; text-decoration: none
   ; border-bottom: dashed 1px #22a
@@ -45,6 +33,18 @@ a.up { font-size: 1.5em
      ; text-decoration: underline
      }
 
+ul { text-align: center
+   ; margin: 0 auto
+   ; padding: 1em
+   ; border: solid 1px #ccc
+   ; width: 90%
+   ; max-width: 950px
+   ; background-color: #fff
+   ; border-radius: 20px
+   ; -webkit-border-radius: 20px
+   ; -moz-border-radius: 20px
+   }
+
 li { display: inline
    ; font-size: 2em
    ; margin: 0
@@ -92,31 +92,42 @@ td:nth-child(2) { padding: 0 10px }
            }
 
 
-/* iPad (landscape) */
-
-@media only screen and (orientation:landscape) and (device-height:1024px) {
-  h1 { font-size: 2em }
-  li { font-size: 1.5em }
-  a.up { font-size: 1.2em }
-}
-
 /* iPhone and iPad */
 
 @media only screen and (orientation:portrait) and (device-height:1024px),
        only screen and (max-device-width:480px)
 {
   h1 { font-size: 2em }
-  
-  a.up { font-size: 1.2em }
-  
+
   ul { padding: 0.5em
      ; width: 70%
-     ; max-width: 900px
+     ; max-width: 400px
      }
   
   li { display: block
-     ; margin: 0.7em
+     ; margin: 0.7em 0.7em 1em
      ; font-size: 1.5em
      }
   li:after { content: '' }
 }
+
+/* iPhone */
+
+@media only screen and (max-device-width:480px) {
+  h1 { font-size: 2em
+     ; margin-top: 1em
+     }
+  h2 { font-size: 1em }
+
+  a.up { font-size: 0.8em }
+
+  li { font-size: 1.2em }
+
+  td { font-size: 1em
+     ; line-height: 1.1em
+     }
+
+  #sjs { font-size: 1em }
+
+  #forkme { display: none }  
+}