From 07834a7c661d05ab5c707e1c428421c87af565bf Mon Sep 17 00:00:00 2001 From: Anika Henke Date: Tue, 25 Sep 2012 19:47:10 +0100 Subject: de-couple mobile JS from widths to actual media query equivalent (fixes FS#2623) --- lib/tpl/dokuwiki/css/mobile.css | 14 ++++++++++++++ 1 file changed, 14 insertions(+) (limited to 'lib/tpl/dokuwiki/css') diff --git a/lib/tpl/dokuwiki/css/mobile.css b/lib/tpl/dokuwiki/css/mobile.css index 6e07f23ec..cc61ab06c 100644 --- a/lib/tpl/dokuwiki/css/mobile.css +++ b/lib/tpl/dokuwiki/css/mobile.css @@ -5,10 +5,20 @@ * @author Anika Henke */ +/* for detecting media queries in JavaScript (see script.js): */ +#screen__mode { + position: relative; + z-index: 0; +} + /* up to 979px screen widths ********************************************************************/ @media only screen and (max-width: 979px) { +#screen__mode { + z-index: 1; /* for detecting media queries in JavaScript (see script.js) */ +} + /* structure */ #dokuwiki__aside { width: 100%; @@ -107,6 +117,10 @@ ********************************************************************/ @media only screen and (max-width: 480px) { +#screen__mode { + z-index: 2; /* for detecting media queries in JavaScript (see script.js) */ +} + body { font-size: 100%; } -- cgit v1.2.3 From 20391a36885910a616110df30f3ce30f8d23639d Mon Sep 17 00:00:00 2001 From: Anika Henke Date: Tue, 25 Sep 2012 20:25:54 +0100 Subject: removed html dependency from media query detection JS in new template --- lib/tpl/dokuwiki/css/mobile.css | 15 +++++---------- 1 file changed, 5 insertions(+), 10 deletions(-) (limited to 'lib/tpl/dokuwiki/css') diff --git a/lib/tpl/dokuwiki/css/mobile.css b/lib/tpl/dokuwiki/css/mobile.css index cc61ab06c..ea32fb11d 100644 --- a/lib/tpl/dokuwiki/css/mobile.css +++ b/lib/tpl/dokuwiki/css/mobile.css @@ -5,18 +5,16 @@ * @author Anika Henke */ -/* for detecting media queries in JavaScript (see script.js): */ -#screen__mode { - position: relative; - z-index: 0; +body { + min-height: 0; /* for detecting media queries in JavaScript (see script.js): */ } /* up to 979px screen widths ********************************************************************/ @media only screen and (max-width: 979px) { -#screen__mode { - z-index: 1; /* for detecting media queries in JavaScript (see script.js) */ +body { + min-height: 1px; /* for detecting media queries in JavaScript (see script.js) */ } /* structure */ @@ -117,12 +115,9 @@ ********************************************************************/ @media only screen and (max-width: 480px) { -#screen__mode { - z-index: 2; /* for detecting media queries in JavaScript (see script.js) */ -} - body { font-size: 100%; + min-height: 2px; /* for detecting media queries in JavaScript (see script.js) */ } /*____________ structure ____________*/ -- cgit v1.2.3 From 86ca15261461b6c74f66407e7ac6992baa097d0d Mon Sep 17 00:00:00 2001 From: Anika Henke Date: Wed, 26 Sep 2012 09:22:02 +0100 Subject: Revert "removed html dependency from media query detection JS in new template" ... because it made the solution less transparent, more error prone and even more like a hack than it already was This reverts commit 20391a36885910a616110df30f3ce30f8d23639d. --- lib/tpl/dokuwiki/css/mobile.css | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) (limited to 'lib/tpl/dokuwiki/css') diff --git a/lib/tpl/dokuwiki/css/mobile.css b/lib/tpl/dokuwiki/css/mobile.css index ea32fb11d..cc61ab06c 100644 --- a/lib/tpl/dokuwiki/css/mobile.css +++ b/lib/tpl/dokuwiki/css/mobile.css @@ -5,16 +5,18 @@ * @author Anika Henke */ -body { - min-height: 0; /* for detecting media queries in JavaScript (see script.js): */ +/* for detecting media queries in JavaScript (see script.js): */ +#screen__mode { + position: relative; + z-index: 0; } /* up to 979px screen widths ********************************************************************/ @media only screen and (max-width: 979px) { -body { - min-height: 1px; /* for detecting media queries in JavaScript (see script.js) */ +#screen__mode { + z-index: 1; /* for detecting media queries in JavaScript (see script.js) */ } /* structure */ @@ -115,9 +117,12 @@ body { ********************************************************************/ @media only screen and (max-width: 480px) { +#screen__mode { + z-index: 2; /* for detecting media queries in JavaScript (see script.js) */ +} + body { font-size: 100%; - min-height: 2px; /* for detecting media queries in JavaScript (see script.js) */ } /*____________ structure ____________*/ -- cgit v1.2.3