From 3f62e09d51985bb9af2b435c8b2431d1d8fec813 Mon Sep 17 00:00:00 2001
From: Cory LaViska <cory@abeautifulsite.net>
Date: Mon, 2 Jun 2025 14:13:43 -0400
Subject: [PATCH] rotate arrow based on placement so borders show correctly
 when applied

---
 packages/webawesome/src/components/popup/popup.css | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/packages/webawesome/src/components/popup/popup.css b/packages/webawesome/src/components/popup/popup.css
index cdb08e228..716d95a38 100644
--- a/packages/webawesome/src/components/popup/popup.css
+++ b/packages/webawesome/src/components/popup/popup.css
@@ -48,7 +48,19 @@
   height: calc(var(--arrow-size-diagonal) * 2);
   rotate: 45deg;
   background: var(--arrow-color);
-  z-index: -1;
+  z-index: 3;
+}
+
+:host([placement~='left']) .arrow {
+  rotate: -45deg;
+}
+
+:host([placement~='right']) .arrow {
+  rotate: 135deg;
+}
+
+:host([placement~='bottom']) .arrow {
+  rotate: 225deg;
 }
 
 /* Hover bridge */