From 9899046c54d1b763ea3ac19cb9be4932104dfb88 Mon Sep 17 00:00:00 2001 From: Alexander Ebert Date: Sat, 2 Nov 2013 16:20:09 +0100 Subject: [PATCH] Added basic detection for smartphones --- wcfsetup/install/files/js/WCF.js | 3 +++ wcfsetup/install/files/style/global.less | 11 +++++++++++ 2 files changed, 14 insertions(+) diff --git a/wcfsetup/install/files/js/WCF.js b/wcfsetup/install/files/js/WCF.js index c9c415a286..70594cc065 100755 --- a/wcfsetup/install/files/js/WCF.js +++ b/wcfsetup/install/files/js/WCF.js @@ -134,6 +134,9 @@ String.prototype.hashCode = function() { jQuery.browser = browser; jQuery.browser.touch = (!!('ontouchstart' in window) || !!('msmaxtouchpoints' in window.navigator)); + + // detect smartphones + jQuery.browser.smartphone = ($(html).css('caption-side') == 'bottom'); })(); /** diff --git a/wcfsetup/install/files/style/global.less b/wcfsetup/install/files/style/global.less index 4045a8ab51..75ffe2a303 100644 --- a/wcfsetup/install/files/style/global.less +++ b/wcfsetup/install/files/style/global.less @@ -400,6 +400,17 @@ a.badge:hover { } } +/* the CSS below can be detected through JavaScript and works better than matchMedia-API (not supported by IE9) */ +@media only screen and (max-width: 800px) { + html { + caption-side: bottom; + } + + body { + caption-side: top; + } +} + @media only screen and (max-width: 800px) and (-webkit-min-device-pixel-ratio: 2) { // Preserve HTML font-size when iPhone orientation changes from portrait to landscape html { -- 2.20.1