Fix language select (#71)

* Fix language select

* Set overscroll-behavior

Author: lujjjh

components/language-select/index.tsx

@@ -75,11 +75,14 @@ const Wrapper = styled.button`
     border-radius: var(--border-radius-md);
     transition: opacity 0.15s ease;
     box-shadow: var(--shadow-md);
-    column-count: 2;
-
-    /* Add scrollable behavior */
-    max-height: 500px;
+    
+    max-height: min(600px, 100vh - 150px);
     overflow-y: auto;
+    overscroll-behavior: contain;
+    
+    & > div {
+      column-count: 2;
+    }
 
     a {
       display: block;
@@ -114,14 +117,16 @@ const LanguageSelect = () => {
     <Wrapper type="button">
       <span>{t('navigation.language')}</span>
       <menu>
-        {Object.entries(localesToShow).map(([locale, language]) => (
-          <Link key={locale} lang={locale} href="" locale={locale} onClick={() => persistLocale(locale)}>
-            {language}
-          </Link>
-        ))}
+        <div>
+          {Object.entries(localesToShow).map(([locale, language]) => (
+            <Link key={locale} lang={locale} href="" locale={locale} onClick={() => persistLocale(locale)}>
+              {language}
+            </Link>
+          ))}
+        </div>
       </menu>
     </Wrapper>
   )
 }
 
-export default LanguageSelect
+export default LanguageSelect