added styles for screen resolutions between 480 and 768px (#26)

1 files changed, 62 insertions, 34 deletions

diff --git a/css/mobile.css b/css/mobile.css
index cbadc70fd..38242f5be 100644
--- a/css/mobile.css
+++ b/css/mobile.css
@@ -1,30 +1,21 @@
 /**
  * This file provides styles for mobile devices
- * and smaller screens (up to 480px width).
+ * and smaller screens (up to 480px and 768px width).
  *
  * @author Anika Henke <anika@selfthinker.org>
  */
 
-@media only screen and (max-width: 480px), only screen and (max-device-width: 960px) {
-
-/*____________ structure ____________*/
-
-#dokuwiki__site {
-    max-width: 100%;
-}
-#dokuwiki__site .site {
-    padding: 0 .5em;
-}
-#dokuwiki__header {
-    padding: .5em 0;
-}
+/* up to 768px screen widths
+********************************************************************/
+@media only screen and (max-width: 768px), only screen and (max-device-width: 960px) {
 
+/* structure */
 #dokuwiki__aside {
     width: 100%;
     float: none;
 }
 #dokuwiki__aside .pad {
-    margin: 0;
+    margin: 0 0 .5em;
 }
 
 .hasSidebar #dokuwiki__content {
@@ -36,6 +27,62 @@
     margin-left: 0;
 }
 
+/* toc */
+.dokuwiki div.toc {
+    float: none;
+    margin: 0 0 1em 0;
+    width: auto;
+    border-left-width: 0;
+    border-bottom: 1px solid __border__;
+}
+.dokuwiki div.tocheader {
+    padding: 0 0 .5em;
+}
+.dokuwiki #toc__inside {
+    padding: .2em 0 .5em;
+}
+
+/* page */
+.dokuwiki div.page {
+    padding: 1em;
+}
+.dokuwiki .pageId span {
+    border-width: 0;
+    background-color: __background_site__;
+    color: __text_alt__;
+    box-shadow: 0 0 0;
+}
+
+/* _edit */
+.dokuwiki div.section_highlight {
+    margin: -3em -1em -.01em -1em;
+    padding: 3em .5em .01em .5em;
+    border-width: 0 .5em;
+}
+.dokuwiki div.preview {
+    margin: 0 -1em;
+    padding: 1em;
+}
+
+
+} /* /@media */
+
+
+/* up to 480px screen widths
+********************************************************************/
+@media only screen and (max-width: 480px), only screen and (max-device-width: 960px) {
+
+/*____________ structure ____________*/
+
+#dokuwiki__site {
+    max-width: 100%;
+}
+#dokuwiki__site .site {
+    padding: 0 .5em;
+}
+#dokuwiki__header {
+    padding: .5em 0;
+}
 
 /*____________ header ____________*/
 
@@ -107,25 +154,6 @@
     padding: .5em;
 }
 
-h1 {
-    margin-top: 0;
-}
-
-/* toc */
-.dokuwiki div.toc {
-    float: none;
-    margin: 0 0 1em 0;
-    width: auto;
-    border-left-width: 0;
-    border-bottom: 1px solid __border__;
-}
-.dokuwiki div.tocheader {
-    padding: 0 0 .5em;
-}
-.dokuwiki #toc__inside {
-    padding: .2em 0 .5em;
-}
-
 /* form elements */
 #config__manager fieldset td.value,
 #config__manager td .input,