From 03ce923e47b526e4b803e6be6435f981a15a4c2f Mon Sep 17 00:00:00 2001
From: Alexander Ebert <ebert@woltlab.com>
Date: Sun, 5 Jun 2016 11:53:20 +0200
Subject: [PATCH] Proper datetime support / updated style

---
 .../files/js/WoltLab/WCF/Date/Picker.js       | 12 ++---
 .../install/files/style/ui/datePicker.scss    | 44 +++----------------
 2 files changed, 11 insertions(+), 45 deletions(-)

diff --git a/wcfsetup/install/files/js/WoltLab/WCF/Date/Picker.js b/wcfsetup/install/files/js/WoltLab/WCF/Date/Picker.js
index 87836c9e5e..721a49d9d4 100644
--- a/wcfsetup/install/files/js/WoltLab/WCF/Date/Picker.js
+++ b/wcfsetup/install/files/js/WoltLab/WCF/Date/Picker.js
@@ -232,11 +232,16 @@ define(['DateUtil', 'Language', 'ObjectMap', 'Dom/ChangeListener', 'Ui/Alignment
 			if (data.isDateTime) {
 				_dateHour.value = date.getHours();
 				_dateMinute.value = date.getMinutes();
+				
+				_datePicker.classList.add('datePickerTime');
+			}
+			else {
+				_datePicker.classList.remove('datePickerTime');
 			}
 			
 			this._renderPicker(date.getDate(), date.getMonth(), date.getFullYear());
 			
-			UiAlignment.set(_datePicker, _input, { pointer: true });
+			UiAlignment.set(_datePicker, _input);
 		},
 		
 		/**
@@ -450,11 +455,6 @@ define(['DateUtil', 'Language', 'ObjectMap', 'Dom/ChangeListener', 'Ui/Alignment
 			_datePicker.className = 'datePicker';
 			_datePicker.addEventListener(WCF_CLICK_EVENT, function(event) { event.stopPropagation(); });
 			
-			var pointer = elCreate('span');
-			pointer.className = 'elementPointer';
-			pointer.innerHTML = '<span></span>';
-			_datePicker.appendChild(pointer);
-			
 			var header = elCreate('header');
 			_datePicker.appendChild(header);
 			
diff --git a/wcfsetup/install/files/style/ui/datePicker.scss b/wcfsetup/install/files/style/ui/datePicker.scss
index b6ab4af3a0..e66e593c90 100644
--- a/wcfsetup/install/files/style/ui/datePicker.scss
+++ b/wcfsetup/install/files/style/ui/datePicker.scss
@@ -6,57 +6,22 @@
 
 .datePicker {
 	background-color: $wcfDropdownBackground;
-	border: 1px solid $wcfDropdownBorder;
-	box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, .2);
+	border-radius: 2px;
+	box-shadow: 0 2px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
 	color: $wcfDropdownText;
-	opacity: 0;
+	display: none;
 	position: absolute;
-	transition: visibility .3s linear .3s, opacity .3s linear;
-	visibility: hidden;
 	width: 240px;
 	z-index: 450;
 	
 	&.active {
-		opacity: 1;
-		transition-delay: 0s;
-		visibility: visible;
+		display: block;
 	}
 	
 	&.datePickerTime > footer {
 		display: block;
 	}
 	
-	> .elementPointer {
-		border: 10px solid transparent;
-		border-bottom-color: $wcfDropdownBorder;
-		border-top-width: 0;
-		
-		> span {
-			border: 9px solid transparent;
-			border-bottom-color: $wcfDropdownBackground;
-			border-top-width: 0;
-			left: -9px;
-			position: absolute;
-			top: 1px;
-		}
-		
-		&.flipVertical {
-			border: 10px transparent solid;
-			border-top-color: $wcfDropdownBorder;
-			border-bottom-width: 0;
-			bottom: 0;
-			top: auto;
-			
-			> span {
-				border: 9px transparent solid;
-				border-top-color: $wcfDropdownBackground;
-				border-bottom-width: 0;
-				bottom: 1px;
-				top: auto;
-			}
-		}
-	}
-	
 	> header,
 	> footer {
 		padding: 10px;
@@ -136,6 +101,7 @@
 	}
 	
 	> footer {
+		border-top: 1px solid $wcfDropdownBorder;
 		display: none;
 	}
 }
-- 
2.20.1