A few infrastructure fixes

- Added some missing styling on the landing page.

- Fixed extra margin values in the dropdown menu.

- Improved popover positioning on small screens.

src/js/overlays.js

@@ -30,26 +30,29 @@ function closeActiveOverlay() {
     }
 }
 
-function attachPopper(anchor, element) {
-    if (popper !== null) {
-        popper.destroy();
+document.addEventListener("DOMContentLoaded", () => {
+    // Attach a popper to the given anchor
+    function attachPopper(anchor, element) {
+        if (popper !== null) {
+            popper.destroy();
+        }
+
+        popper = new Popper(anchor, element, {
+            placement: 'auto-start',
+            modifiers: {
+                preventOverflow: {
+                    enabled: true,
+                },
+                shift: {
+                    enabled: true,
+                },
+                flip: {
+                    enabled: true,
+                }
+            },
+        });
     }
 
-    popper = new Popper(anchor, element, {
-        placement: 'auto-start',
-        modifiers: {
-            preventOverflow: {
-                enabled: true,
-            },
-            flip: {
-                enabled: true,
-                behavior: ['left', 'right', 'top', 'bottom']
-            },
-        },
-    });
-}
-
-document.addEventListener("DOMContentLoaded", () => {
     // Expand spans that define terms into appropriate popup markup
     document.querySelectorAll('.term').forEach(term => {
         const i = document.createElement('i');
@@ -93,3 +96,4 @@ document.addEventListener("DOMContentLoaded", () => {
 });
 
 window.addEventListener("click", closeActiveOverlay);
+window.addEventListener("resize", closeActiveOverlay);

src/sass/misc/_landing.scss

@@ -75,10 +75,11 @@
             opacity: 0.1;
             transition: opacity .25s linear;
             background-color: $landingPanelBackgroundColor;
-            border-color: $landingPanelBorderColor;
             width: 18rem;
             box-shadow: 3px 3px 8px $landingPanelShadowColor;
             padding: 1rem;
+            border: 1px solid $landingPanelBorderColor;
+            border-radius: 4px;
 
             a {
                 text-decoration: none;

src/sass/misc/_menu.scss

@@ -20,6 +20,7 @@
             font-weight: $linkWeight;
             color: $textColor;
             padding: .25rem 1.5rem;
+            margin: 0;
 
             &:hover {
                 color: $textBrandColor;