Disabled shadow divs. Instead use css box-shadow (#13885)

Change-Id: Ibf8888de795b08aed0446607165d7318f94ee6f4

3 files changed, 26 insertions, 0 deletions

diff --git a/WebContent/VAADIN/themes/base/common/common.scss b/WebContent/VAADIN/themes/base/common/common.scss
index 6ec85e3c6d..0a493e0356 100644
--- a/WebContent/VAADIN/themes/base/common/common.scss
+++ b/WebContent/VAADIN/themes/base/common/common.scss
@@ -11,6 +11,19 @@
 .v-caption {
 	cursor: default;
 }
+/* add box-shadows to overlay elements */
+.v-window {
+  box-shadow: 0 5px 18px 0 rgba(0, 0, 0, .5);
+}
+.v-datefield-popup,
+.v-filterselect-suggestpopup,
+.v-menubar-popup,
+.v-slider-feedback,
+.v-popupview-popup,
+.v-contextmenu  {
+	 box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .5);
+}
+
 body &.v-app .v-app-loading {
 	/* You can use this to provide indication for the user that the application is loading. */
 	/* It is applied to the same element as .v-app */
@@ -115,6 +128,7 @@ body &.v-app .v-app-loading {
 .v-tooltip {
 	cursor: default;
 	background: #fff;
+	box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .5);
 }
 .v-tooltip-text {
 	overflow: auto;
diff --git a/WebContent/VAADIN/themes/base/shadow/shadow.scss b/WebContent/VAADIN/themes/base/shadow/shadow.scss
index 47bf4acfde..3c369d3fef 100644
--- a/WebContent/VAADIN/themes/base/shadow/shadow.scss
+++ b/WebContent/VAADIN/themes/base/shadow/shadow.scss
@@ -2,6 +2,12 @@
 
 .#{$primaryStyleName} {
 	position: absolute;
+	display: none;
+	pointer-events: none;
+	
+	.v-ie8 & {
+	  display: block;
+	}
 }
 
 .#{$primaryStyleName} .top-left {
diff --git a/WebContent/VAADIN/themes/base/window/window.scss b/WebContent/VAADIN/themes/base/window/window.scss
index 05f3b115ad..4e414379cf 100644
--- a/WebContent/VAADIN/themes/base/window/window.scss
+++ b/WebContent/VAADIN/themes/base/window/window.scss
@@ -125,6 +125,12 @@ div.#{$primaryStyleName}-header {
 /* Shadow for window */
 .v-shadow-window {
 	position: absolute;
+	display: none;
+	pointer-events: none;
+	
+	.v-ie8 & {
+	  display: block;
+	}
 }
 .v-shadow-window .top-left {
     position: absolute; overflow: hidden;