From f033fa3ffe1d71ff2932bfbba5c4f4fa594a3bc6 Mon Sep 17 00:00:00 2001 From: Alexander Ebert Date: Fri, 22 Apr 2016 14:21:09 +0200 Subject: [PATCH] Added `screen-sm-md` to target tablet only --- wcfsetup/install/files/js/WoltLab/WCF/Ui/Screen.js | 3 ++- .../install/files/style/bootstrap/mixin/mediaQuery.scss | 9 ++++++++- 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/wcfsetup/install/files/js/WoltLab/WCF/Ui/Screen.js b/wcfsetup/install/files/js/WoltLab/WCF/Ui/Screen.js index 369fd78f17..21a26facd9 100644 --- a/wcfsetup/install/files/js/WoltLab/WCF/Ui/Screen.js +++ b/wcfsetup/install/files/js/WoltLab/WCF/Ui/Screen.js @@ -16,7 +16,8 @@ define(['Core', 'Dictionary'], function(Core, Dictionary) { 'screen-xs': '(max-width: 544px)', /* smartphone */ 'screen-sm': '(min-width: 545px) and (max-width: 768px)', /* tablet (portrait) */ 'screen-sm-down': '(max-width: 768px)', /* smartphone + tablet (portrait) */ - 'screen-sm-up': '(min-width: 545px)', /* tablet(portrait) + tablet (landscape) + desktop */ + 'screen-sm-up': '(min-width: 545px)', /* tablet (portrait) + tablet (landscape) + desktop */ + 'screen-sm-md': '(min-width: 545px) and (max-width: 1024px)', /* tablet (portrait) + tablet (landscape) */ 'screen-md': '(min-width: 769px) and (max-width: 1024px)', /* tablet (landscape) */ 'screen-md-down': '(max-width: 1024px)', /* smartphone + tablet (portrait) + tablet (landscape) */ 'screen-md-up': '(min-width: 1024px)', /* tablet (landscape) + desktop */ diff --git a/wcfsetup/install/files/style/bootstrap/mixin/mediaQuery.scss b/wcfsetup/install/files/style/bootstrap/mixin/mediaQuery.scss index 8587cf9415..81fe3444a7 100644 --- a/wcfsetup/install/files/style/bootstrap/mixin/mediaQuery.scss +++ b/wcfsetup/install/files/style/bootstrap/mixin/mediaQuery.scss @@ -19,13 +19,20 @@ } } -/* tablet(portrait) + tablet (landscape) + desktop */ +/* tablet (portrait) + tablet (landscape) + desktop */ @mixin screen-sm-up() { @media (min-width: 545px) { @content; } } +/* tablet (portrait) + tablet (landscape) */ +@mixin screen-sm-md() { + @media (min-width: 545px) and (max-width: 1024px) { + @content; + } +} + /* tablet (landscape) */ @mixin screen-md() { @media (min-width: 769px) and (max-width: 1024px) { -- 2.20.1