Fix: Horizontal clubs, mobile menu, and translator

Author: lovable-dev[bot]

src/components/Header/DesktopNav.tsx

@@ -36,11 +36,11 @@ const DesktopNav = () => {
 
   const handleLanguageSelect = (lang: string) => {
     const url = window.location.href;
-    // Try Google Translate first, fallback to DeepL
+    // Try Google Translate (website translate), fallback to DeepL Website Translator
     try {
-      window.open(`https://translate.google.com/translate?sl=auto&tl=${lang}&u=${encodeURIComponent(url)}`, '_blank');
+      window.open(`https://translate.google.com/translate?sl=auto&tl=${lang}&u=${encodeURIComponent(url)}`, '_blank', 'noopener,noreferrer');
     } catch (error) {
-      window.open(`https://www.deepl.com/translator#auto/${lang}/${encodeURIComponent(url)}`, '_blank');
+      window.open(`https://www.deepl.com/translate?url=${encodeURIComponent(url)}&tl=${lang}&op=translate`, '_blank', 'noopener,noreferrer');
     }
   };
 

src/components/Header/MobileNav.tsx

@@ -43,12 +43,11 @@ const MobileNav = ({ isMenuOpen, setIsMenuOpen }: MobileNavProps) => {
   const translatePage = (langCode: string) => {
     const currentUrl = window.location.href;
     const googleTranslateUrl = `https://translate.google.com/translate?sl=auto&tl=${langCode}&u=${encodeURIComponent(currentUrl)}`;
-    
     try {
-      window.open(googleTranslateUrl, '_blank');
+      window.open(googleTranslateUrl, '_blank', 'noopener,noreferrer');
     } catch (error) {
-      const deeplUrl = `https://www.deepl.com/translator#en/${langCode}/${encodeURIComponent(currentUrl)}`;
-      window.open(deeplUrl, '_blank');
+      const deeplUrl = `https://www.deepl.com/translate?url=${encodeURIComponent(currentUrl)}&tl=${langCode}&op=translate`;
+      window.open(deeplUrl, '_blank', 'noopener,noreferrer');
     }
   };
 
@@ -189,7 +188,11 @@ const MobileNav = ({ isMenuOpen, setIsMenuOpen }: MobileNavProps) => {
             transition={{ delay: 0.6 }}
             className="pt-2"
           >
-            <Button className="w-full bg-alien-green hover:bg-alien-green-light text-alien-space-dark rounded-lg py-2 flex items-center justify-center gap-2 font-nasalization transition-all duration-300 hover:scale-105">
+            <Button 
+              className="w-full bg-alien-green hover:bg-alien-green-light text-alien-space-dark rounded-lg py-2 flex items-center justify-center gap-2 font-nasalization transition-all duration-300 hover:scale-105"
+              onClick={() => window.open('https://aliendex.vercel.app', '_blank', 'noopener,noreferrer')}
+              aria-label="Open AlienDex Portal"
+            >
               <img 
                 src="/lovable-uploads/AW.png" 
                 alt="Wallet" 

src/pages/Clubs.tsx

@@ -402,10 +402,14 @@ const Clubs: React.FC = () => {
             <h2 className="text-3xl font-bold text-alien-gold mb-8 font-nasalization text-center text-glow">
               Featured Clubs
             </h2>
-            <div className="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 gap-8">
-              {featuredClubs.map((club, index) => (
-                <FeaturedClubCard key={index} club={club} />
-              ))}
+            <div className="overflow-x-auto pb-2" aria-label="Featured clubs horizontal list">
+              <div className="flex gap-6 snap-x snap-mandatory">
+                {[...featuredClubs].sort((a, b) => a.name.localeCompare(b.name)).map((club, index) => (
+                  <div key={index} className="min-w-[320px] md:min-w-[520px] xl:min-w-[560px] snap-start">
+                    <FeaturedClubCard club={club} />
+                  </div>
+                ))}
+              </div>
             </div>
           </div>