Improved layout for mobile devices

* navigation now aligns itself properly on smaller screens
* increased line height for both the article teasers and commit message list items

1 files changed, 12 insertions, 11 deletions

diff --git a/source/99_result/main.css b/source/99_result/main.css
index 00db10f..942ee53 100644
--- a/source/99_result/main.css
+++ b/source/99_result/main.css
@@ -1,5 +1,4 @@
 body{font:1em Droid Sans,Verdana,Arial,sans-serif,FreeSans;color:#272828}
-#content{max-width:45em;margin:auto}
 a{text-decoration:underline;color:#272828}
 a:hover{color:black}
 h1, h2{margin:0;color:#272828;font-weight:bold}
@@ -7,19 +6,21 @@ h1 a, h2 a{text-decoration:none}
 h3{font-size:1.2em;color:#F80;font-weight:bold;margin-bottom:.2em;border-bottom:.1em solid #e3e8e8}
 h3 span{font-size:0.9em;color:#272828;font-weight:normal}
 h3 a{text-decoration:none}
-p{margin:0 0 .5em 0;text-align:justify;line-height:1.5em}
-ul{margin:0}
-ul li{list-style-type:circle;padding:.1em 0 .1em 0}
+p{margin:0 0 .5em 0;text-align:justify;line-height:1.75em}
+ul{margin:0;overflow:hidden}
+ul li{list-style-type:circle;line-height:1.5em}
 code{margin:0 .1em;padding:0 .5em;border:.1em solid #e3e8e8;background-color:#f8f8f8;border-radius:.3em}
+#content{max-width:45em;margin:auto}
 .info{font-size:.8em;margin-bottom:.5em;display:block}
 .info a{margin:0 .1em 0 .1em}
 .large{font-size:1.8em}
 .normal{font-size:1.2em}
-.menuhead{border-bottom:0.2em solid #e3e8e8;overflow:hidden;padding:1.5em 0 .2em}
-.menuhead h1{float:left;font-size:1em}
-.menuhead h2{float:left;font-size:1em}
-.menuhead ul {float:right;padding:0}
-.menuhead ul li{font-size:.9em;float:left;list-style-type:none;padding:0 0 0 .2em}
-.menuhead ul li a{text-decoration:none;color:#272828;background:#e3e8e8;border-radius:.3em;padding:.2em}
+.menuhead{border-bottom:0.2em solid #e3e8e8;overflow:hidden;padding:0;margin-top:1.5em}
+.menuhead h1, .menuhead h2{float:left;font-size:1em;line-height:1.5em}
+.menuhead ul {float:right;padding:0 0 .1em 0}
+.menuhead ul li{font-size:.9em;float:left;list-style-type:none;padding:.2em .1em;margin:.1em;background:#e3e8e8;border-radius:.3em;line-height:1.2em}
+.menuhead ul li:first-child{margin-left:0}
+.menuhead ul li:last-child{margin-right:0}
+.menuhead ul li a{text-decoration:none;color:#272828;padding:.2em}
 .menuhead ul li a:hover{text-decoration:underline}
-@media screen and (max-width:45.5em){.menuhead:nth-of-type(1){padding:.2em 0 .2em}}
+@media screen and (max-width:32em){.menuhead:first-child{margin-top:0}.menuhead ul {float:none;clear:both;padding:.1em 0 .2em 0}}