From: Alexander Ebert <ebert@woltlab.com>
Date: Fri, 21 Feb 2020 12:51:58 +0000 (+0100)
Subject: Apply the mobile reaction UI for touch devices on large screens (iPad Pro)
X-Git-Tag: 5.2.3~13
X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=5552cb5d895a5428b08e7ef5ffd8d1f07a74def8;p=GitHub%2FWoltLab%2FWCF.git

Apply the mobile reaction UI for touch devices on large screens (iPad Pro)
---

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Environment.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Environment.js
index ed0cda55fd..0768db8fd1 100644
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Environment.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Environment.js
@@ -68,6 +68,12 @@ define([], function() {
 			
 			_editor = 'redactor';
 			_touch = (!!('ontouchstart' in window) || (!!('msMaxTouchPoints' in window.navigator) && window.navigator.msMaxTouchPoints > 0) || window.DocumentTouch && document instanceof DocumentTouch);
+			
+			// The iPad Pro 12.9" masquerades as a desktop browser.
+			if (window.navigator.platform === 'macIntel' && window.navigator.maxTouchPoints > 1) {
+				_browser = 'safari';
+				_platform = 'ios';
+			}
 		},
 		
 		/**
diff --git a/wcfsetup/install/files/style/ui/reactions.scss b/wcfsetup/install/files/style/ui/reactions.scss
index 40f8cd4217..b22db4f6ef 100644
--- a/wcfsetup/install/files/style/ui/reactions.scss
+++ b/wcfsetup/install/files/style/ui/reactions.scss
@@ -140,6 +140,18 @@
 	}
 }
 
+@include screen-lg {
+	html.touch .reactionPopoverContent .reactionTypeButton {
+		display: block;
+		margin-left: 0;
+		
+		> .reactionTypeButtonTitle {
+			display: inline;
+			margin-left: 10px;
+		}
+	}
+}
+
 @include screen-sm-down {
 	.reactionStatusContainer {
 		display: none;