ux: toggle blog list and fix lang selector

index.html

@@ -39,6 +39,14 @@
   </script>
   <style>
     body { font-family: 'Inter', 'Segoe UI', system-ui, sans-serif; }
+    #lang-selector {
+      color: #ffffff;
+    }
+    #lang-selector:focus,
+    #lang-selector:focus-visible {
+      color: #201824;
+      background-color: #ffffff;
+    }
   </style>
   <script type="application/ld+json">
   {
@@ -246,7 +254,7 @@
         'blog-title': 'Blog & resource hub',
         'blog-subtitle': 'Stay ahead with tutorials, case studies, and playbooks for NGO ERP rollouts.',
         'blog-link': 'Browse all articles →',
-        'blog-all-open': 'Showing all articles',
+        'blog-all-open': 'Show fewer articles',
         'blog-read-more': 'Read more',
         'blog-show-less': 'Show less',
         'blog-error': 'Unable to load articles right now.',
@@ -306,7 +314,7 @@
         'blog-title': 'Blog y centro de recursos',
         'blog-subtitle': 'Aprende con tutoriales, casos prácticos y playbooks para implementar un ERP en tu ONG.',
         'blog-link': 'Ver todos los artículos →',
-        'blog-all-open': 'Mostrando todos los artículos',
+        'blog-all-open': 'Mostrar menos artículos',
         'blog-read-more': 'Leer más',
         'blog-show-less': 'Mostrar menos',
         'blog-error': 'No pudimos cargar los artículos en este momento.',
@@ -366,7 +374,7 @@
         'blog-title': 'Blog & Wissenshub',
         'blog-subtitle': 'Tutorials, Fallstudien und Playbooks für erfolgreiche NGO-ERP-Rollouts.',
         'blog-link': 'Alle Artikel ansehen →',
-        'blog-all-open': 'Alle Artikel werden angezeigt',
+        'blog-all-open': 'Weniger Artikel anzeigen',
         'blog-read-more': 'Mehr lesen',
         'blog-show-less': 'Weniger anzeigen',
         'blog-error': 'Artikel konnten gerade nicht geladen werden.',
@@ -429,8 +437,8 @@
 
     if (blogToggle) {
       blogToggle.addEventListener('click', () => {
-        if (blogExpanded || blogPosts.length <= BLOG_LIMIT) return;
-        blogExpanded = true;
+        if (blogPosts.length <= BLOG_LIMIT) return;
+        blogExpanded = !blogExpanded;
         renderBlogCards();
       });
     }
@@ -528,13 +536,14 @@
       if (!blogToggle) return;
       if (blogPosts.length <= BLOG_LIMIT) {
         blogToggle.classList.add('hidden');
+        blogExpanded = false;
         return;
       }
       blogToggle.classList.remove('hidden');
-      blogToggle.disabled = blogExpanded;
+      blogToggle.disabled = false;
       const locale = document.documentElement.lang || 'en';
       blogToggle.textContent = blogExpanded
-        ? getTranslation(locale, 'blog-all-open', 'Showing all articles')
+        ? getTranslation(locale, 'blog-all-open', 'Show fewer articles')
         : getTranslation(locale, 'blog-link', 'Browse all articles →');
     }