Merge pull request #6310 from Raawen-dev/fix-popup-6221-only

Fix list actions popup overflow (Issue #6221)

client/components/main/popup.css

@@ -767,3 +767,124 @@ body.mobile-mode .pop-over .content-wrapper {
   overflow-y: auto !important;
   overflow-x: hidden !important;
 }
+
+/* ============================================
+   FIX: List actions popup overflow (Issue #6221)
+   Prevents menu from overflowing outside viewport
+   ============================================ */
+
+/* General fix for all popups with many items */
+.pop-over .pop-over-list {
+  max-height: 60vh;
+  overflow-y: auto;
+  overflow-x: hidden;
+}
+
+/* Specific fix for list actions menu */
+.pop-over[data-popup="listActionsPopup"] {
+  max-height: 85vh !important;
+  overflow-y: auto !important;
+}
+
+.pop-over[data-popup="listActionsPopup"] .content-wrapper {
+  max-height: calc(85vh - 50px) !important;
+  overflow-y: auto !important;
+}
+
+/* Prevent any popup from overflowing viewport */
+.pop-over {
+  max-height: 90vh !important;
+  display: flex !important;
+  flex-direction: column !important;
+}
+
+.pop-over .content-wrapper {
+  flex: 1 1 auto !important;
+  overflow-y: auto !important;
+  min-height: 0 !important;
+}
+
+.pop-over .content-container {
+  flex: 1 1 auto !important;
+  display: flex !important;
+  flex-direction: column !important;
+  min-height: 0 !important;
+}
+
+.pop-over .content {
+  flex: 1 1 auto !important;
+  overflow-y: auto !important;
+  min-height: 0 !important;
+}
+
+/* Keep header fixed while content scrolls */
+.pop-over .header {
+  flex-shrink: 0 !important;
+}
+
+/* Mobile-specific adjustments */
+@media screen and (max-width: 800px) {
+  .pop-over[data-popup="listActionsPopup"] {
+    max-height: 100vh !important;
+  }
+  
+  .pop-over[data-popup="listActionsPopup"] .content-wrapper {
+    max-height: calc(100vh - 48px) !important;
+  }
+}
+/* STRONGER FIX - Override inline styles */
+.pop-over[style*="height"],
+.pop-over[style*="max-height"] {
+  max-height: 80vh !important;
+  height: auto !important;
+  overflow-y: auto !important;
+}
+
+.pop-over[style*="height"] .content-wrapper,
+.pop-over[style*="max-height"] .content-wrapper {
+  max-height: calc(80vh - 60px) !important;
+  height: auto !important;
+  overflow-y: auto !important;
+}
+
+/* Force list popups to have a max height and scroll */
+.pop-over .pop-over-list {
+  max-height: 300px !important;
+  overflow-y: auto !important;
+}
+
+/* Make sure the popup doesn't grow too tall */
+.pop-over:has(.pop-over-list) {
+  max-height: 400px !important;
+  height: auto !important;
+}
+
+/* For the list actions menu specifically */
+[data-popup="listActionsPopup"] .pop-over-list,
+.js-open-list-menu + .pop-over .pop-over-list {
+  max-height: 350px !important;
+  overflow-y: auto !important;
+}
+
+/* ============================================
+   FIX: List actions popup overflow (Issue #6221)
+   ============================================ */
+
+/* Force list popups to have a max height and scroll */
+.pop-over .pop-over-list {
+  max-height: 300px !important;
+  overflow-y: auto !important;
+}
+
+/* Make sure the popup doesn't grow too tall */
+.pop-over:has(.pop-over-list) {
+  max-height: 400px !important;
+  height: auto !important;
+}
+
+/* For the list actions menu specifically */
+[data-popup="listActionsPopup"] .pop-over-list,
+.js-open-list-menu + .pop-over .pop-over-list {
+  max-height: 350px !important;
+  overflow-y: auto !important;
+}