From 66750df87f8360e5398fed8fb41f3c2970dfe43e Mon Sep 17 00:00:00 2001
From: Fortunato Maldonado <fortunato.maldonado@liferay.com>
Date: Fri, 18 May 2018 12:36:17 -0700
Subject: [PATCH] LPS-81221 Portlet border displays when hovering over dropdown

---
 .../META-INF/resources/liferay/menu.js        | 20 ++++++++---------
 .../_styled/css/portlet/_topper.scss          | 22 ++++++++++++++-----
 2 files changed, 26 insertions(+), 16 deletions(-)

diff --git a/modules/apps/frontend-js/frontend-js-aui-web/src/main/resources/META-INF/resources/liferay/menu.js b/modules/apps/frontend-js/frontend-js-aui-web/src/main/resources/META-INF/resources/liferay/menu.js
index 92922fc7bee844..4b90cfd9ec990c 100644
--- a/modules/apps/frontend-js/frontend-js-aui-web/src/main/resources/META-INF/resources/liferay/menu.js
+++ b/modules/apps/frontend-js/frontend-js-aui-web/src/main/resources/META-INF/resources/liferay/menu.js
@@ -15,7 +15,7 @@ AUI.add(
 
 		var CSS_OPEN = 'open';
 
-		var CSS_PORTLET_TOPPER = '.portlet-topper';
+		var CSS_PORTLET = '.portlet';
 
 		var DEFAULT_ALIGN_POINTS = ['tl', 'bl'];
 
@@ -115,10 +115,10 @@ AUI.add(
 					else {
 						trigger.get(PARENT_NODE).removeClass(CSS_OPEN);
 
-						var portletTopper = trigger.ancestor(CSS_PORTLET_TOPPER);
+						var portlet = trigger.ancestor(CSS_PORTLET);
 
-						if (portletTopper) {
-							portletTopper.removeClass(CSS_OPEN);
+						if (portlet) {
+							portlet.removeClass(CSS_OPEN);
 						}
 					}
 				}
@@ -380,10 +380,10 @@ AUI.add(
 					else {
 						trigger.get(PARENT_NODE).addClass(CSS_OPEN);
 
-						var portletTopper = trigger.ancestor(CSS_PORTLET_TOPPER);
+						var portlet = trigger.ancestor(CSS_PORTLET);
 
-						if (portletTopper) {
-							portletTopper.addClass(CSS_OPEN);
+						if (portlet) {
+							portlet.addClass(CSS_OPEN);
 						}
 					}
 				}
@@ -598,10 +598,10 @@ AUI.add(
 
 						activeTrigger.get(PARENT_NODE).removeClass(CSS_OPEN);
 
-						var portletTopper = activeTrigger.ancestor(CSS_PORTLET_TOPPER);
+						var portlet = activeTrigger.ancestor(CSS_PORTLET);
 
-						if (portletTopper) {
-							portletTopper.removeClass(CSS_OPEN);
+						if (portlet) {
+							portlet.removeClass(CSS_OPEN);
 						}
 					}
 					else {
diff --git a/modules/apps/frontend-theme/frontend-theme-styled/src/main/resources/META-INF/resources/_styled/css/portlet/_topper.scss b/modules/apps/frontend-theme/frontend-theme-styled/src/main/resources/META-INF/resources/_styled/css/portlet/_topper.scss
index aad92bae2ad3ea..e150efccb1e1a0 100644
--- a/modules/apps/frontend-theme/frontend-theme-styled/src/main/resources/META-INF/resources/_styled/css/portlet/_topper.scss
+++ b/modules/apps/frontend-theme/frontend-theme-styled/src/main/resources/META-INF/resources/_styled/css/portlet/_topper.scss
@@ -6,6 +6,14 @@
 	}
 }
 
+%display-portlet-content-editable {
+	@include media-query(sm) {
+		border-color: $portlet-topper-border;
+		border-top-left-radius: 0;
+		border-top-right-radius: 0;
+	}
+}
+
 .portlet {
 	margin-bottom: 10px;
 	position: relative;
@@ -29,8 +37,14 @@
 
 			top: 0;
 		}
+	}
 
-		&.open {
+	&.open {
+		> .portlet-content-editable {
+			@extend %display-portlet-content-editable;
+		}
+
+		> .portlet-topper {
 			@extend %display-portlet-topper;
 		}
 	}
@@ -39,11 +53,7 @@
 .portlet {
 	&:hover, &.focus {
 		> .portlet-content-editable {
-			@include media-query(sm) {
-				border-color: $portlet-topper-border;
-				border-top-left-radius: 0;
-				border-top-right-radius: 0;
-			}
+			@extend %display-portlet-content-editable;
 		}
 
 		> .portlet-topper {