pkp/pkp-lib#836 Prevent dropdown menus from opening off-screen

plugins/themes/default/styles/helpers.less

@@ -55,7 +55,7 @@
 		left: -9999px;
 		z-index: 1000;
 		width: 15em;
-    margin: 0;
+		margin: 0;
 		padding: 0;
 		background: @primary-lift;
 
@@ -87,6 +87,26 @@
 		left: 0;
 	}
 
+	// Ensure a dropdown doesn't open beyond the edge of the screen by aligning
+	// such dropdowns to the right rather than the left.
+	li.align_right:hover > ul,
+	li.align_right:focus > ul,
+	li.align_right.in_focus > ul {
+		left: auto;
+		// Position in center on very small screens to prevent if from flying
+		// off to the left. Not a perfect solution, but should suffice for the
+		// overwhelming majority of cases
+		width: 10em;
+		right: 50%;
+		.transform(translateX(50%));
+
+		@media(min-width: @screen-phone) {
+			right: 0;
+			.transform(none);
+			width: 15em;
+		}
+	}
+
 	// Dropdown caret indicating submenus
 	// @todo these can probably abstracted into reusable components
 	.has-submenu > a:after {