Dynamic dropdown menu placement based on the toggle location

Author: minimaluminium

assets/built/screen.css

@@ -717,9 +717,9 @@ Search                         LOGO                    Login Subscribe
     transform: translate3d(0, 6px, 0);
 }
 
-.is-middle-logo .gh-dropdown {
+.gh-dropdown.is-left {
     right: auto;
-    left: -24px;
+    left: -16px;
 }
 
 .is-dropdown-mega .gh-dropdown {

assets/built/screen.css.map

@@ -56,6 +56,13 @@ function dropdown() {
         toggle.appendChild(wrapper);
         nav.appendChild(toggle);
 
+        const toggleRect = toggle.getBoundingClientRect();
+        const documentCenter = window.innerWidth / 2;
+
+        if (toggleRect.left < documentCenter) {
+            wrapper.classList.add('is-left');
+        }
+
         head.classList.add('is-dropdown-loaded');
 
         window.addEventListener('click', function (e) {