fix: update navbar and hero to redesigned version after merge

- Fix navbar: remove merge artifacts, add proper nav structure, theme toggle on desktop
- Fix footer: add missing ul wrapper, fix Connect section HTML structure
- Fix intro: correct closing divs, restore hero layout
- Add socials helper to ApplicationHelper for layout footer

Made-with: Cursor

Author: Annastacia-dev

app/helpers/application_helper.rb

@@ -2,4 +2,24 @@
 
 module ApplicationHelper
   include Pagy::Frontend
+
+  SOCIALS = [
+    { alt_key: 'social_media.twitter', link: 'https://twitter.com/ruby_african', image: 'brands_twitter.png',
+      show: true },
+    { alt_key: 'social_media.telegram', link: '#', image: 'brands_telegram.png',
+      show: FeatureFlag.find_by(name: 'telegram')&.enabled },
+    { alt_key: 'social_media.facebook', link: 'https://www.facebook.com/rubycommunity.africa',
+      image: 'brands_facebook.png',
+      show: true },
+    { alt_key: 'social_media.instagram', link: 'https://www.instagram.com/africanruby_community/', image: 'brands_instagram.png', show: true },
+    { alt_key: 'social_media.linkedin', link: 'https://www.linkedin.com/company/african-ruby-community/',
+      image: 'brands_linkedin.png', show: true },
+    { alt_key: 'social_media.github', link: 'https://github.com/nairuby', image: 'brands_github.png', show: true }
+  ].freeze
+
+  def socials
+    SOCIALS.map do |social|
+      social.merge(alt: I18n.t(social[:alt_key]))
+    end
+  end
 end

app/views/landing/home/_intro.html.erb

@@ -13,8 +13,9 @@
     <% end %>
     </div>
   </div>
+</div>
 
-  <div class="relative z-10 mx-auto w-full max-w-7xl px-6 py-24 md:py-32">
+<div class="relative z-10 mx-auto w-full max-w-7xl px-6 py-24 md:py-32 -mt-32">
     <div class="max-w-3xl">
 
       <%= link_to "https://rubyconf.africa/", target: "_blank",
@@ -76,4 +77,3 @@
     </div>
   </div>
 </div>
-</div>

app/views/layouts/_footer.html.erb

@@ -3,18 +3,17 @@
 
     <div class="grid gap-12 md:grid-cols-4">
 
-      <li class="hover:text-red-600 hover:underline"><%= link_to t('footer.chapters'), chapters_path %></li>
-      
-      <% if FeatureFlag.find_by(name: 'projects')&.enabled %>
-        <li class="hover:text-red-600 hover:underline"><%= link_to t('footer.projects'), projects_path %></li>
-      <% end %>
-      
-      <% if FeatureFlag.find_by(name: 'learning_materials')&.enabled %>
-        <li class="hover:text-red-600 hover:underline"><%= link_to t('footer.learning_materials'), learning_materials_path %></li>
-      <% end %>
-    </ul>
+      <ul class="flex flex-col gap-3">
+        <li class="hover:text-red-600 hover:underline"><%= link_to t('footer.chapters'), chapters_path %></li>
+        <% if FeatureFlag.find_by(name: 'projects')&.enabled %>
+          <li class="hover:text-red-600 hover:underline"><%= link_to t('footer.projects'), projects_path %></li>
+        <% end %>
+        <% if FeatureFlag.find_by(name: 'learning_materials')&.enabled %>
+          <li class="hover:text-red-600 hover:underline"><%= link_to t('footer.learning_materials'), learning_materials_path %></li>
+        <% end %>
+      </ul>
 
-    <ul class="flex flex-col gap-3">
+      <ul class="flex flex-col gap-3">
       <li class="hover:text-red-600 hover:underline"><%= link_to t('footer.sponsor'), 'mailto:organisers@rubycommunity.africa' %></li>
 
       <% if FeatureFlag.find_by(name: 'members').try(:enabled) %>
@@ -39,19 +38,20 @@
       </h1>
       <ul class="flex md:flex-row flex-col md:mt-4 md:gap-10 gap-5">
         <% socials.each do |social| %>
-          <% if social[:show] === true %>
+          <% if social[:show] %>
             <li class='md:border-2 border-red-600 p-5 rounded-full'>
               <%= link_to social[:link] do %>
                 <%= image_tag social[:image], alt: social[:alt], class: "md:w-5 w-8 hover:scale-105" %>
               <% end %>
             </li>
           <% end %>
         <% end %>
-        <p class="mt-4 text-sm leading-relaxed text-zinc-500 dark:text-zinc-400">
-          African Ruby Community. Promoting computer software programming
-          skills with the Ruby programming language across Africa since 2010.
-        </p>
-      </div>
+      </ul>
+      <p class="mt-4 text-sm leading-relaxed text-zinc-500 dark:text-zinc-400">
+        African Ruby Community. Promoting computer software programming
+        skills with the Ruby programming language across Africa since 2010.
+      </p>
+    </div>
 
       <%# Community links %>
       <div>

app/views/layouts/_navbar.html.erb

@@ -3,33 +3,9 @@
              dark:border-zinc-800/50 dark:bg-black/80
              backdrop-blur-xl transition-colors duration-300"
         id="main-navbar"
-        data-turbo-permanent
         data-controller="navbar">
-
-          <% if FeatureFlag.find_by(name: 'events').try(:enabled) %>
-            <li><%= link_to t('navigation.events'), events_path %></li>
-          <% end %>
-
-          <%# Conferences removed from project %>
-
-          <li><%= link_to t('navigation.chapters'), chapters_path %></li>
-
-          <% if FeatureFlag.find_by(name: 'projects')&.enabled %>
-            <li><%= link_to t('navigation.projects'), projects_path %></li>
-          <% end %>
-
-          <% if FeatureFlag.find_by(name: 'learning_materials')&.enabled %>
-            <li><%= link_to t('navigation.learning_materials'), learning_materials_path %></li>
-          <% end %>
-
-          <% if user_signed_in? %>
-            <li><%= button_to t('navigation.sign_out'), destroy_user_session_path, method: :delete %></li>
-          <% else %>
-            <li><%= link_to t('navigation.sign_up'), new_user_registration_path %></li>
-            <li><%= link_to t('navigation.sign_in'), new_user_session_path %></li>
-          <% end %>
-        </ul>
-      </div>
+  <nav class="mx-auto flex max-w-7xl items-center justify-between px-4 sm:px-6 lg:px-8">
+    <div class="flex flex-1 items-center gap-4">
       <div class="flex justify-start lg:w-0 lg:flex-1">
         <%= link_to root_path do %>
           <span class="sr-only"><%= t('navigation.community_name') %></span>
@@ -91,9 +67,9 @@
       <% end %>
     </div>
 
-    <%# Mobile right side: theme toggle + hamburger %>
-    <div class="flex items-center gap-1 md:hidden">
-      <%# Theme toggle (mobile) %>
+    <%# Theme toggle + hamburger (mobile) %>
+    <div class="flex items-center gap-1">
+      <%# Theme toggle - visible on all screen sizes (sun/moon icon) %>
       <button data-action="click->theme#toggle"
               class="rounded-md p-2 text-zinc-500 transition-colors hover:bg-zinc-100 dark:text-zinc-400 dark:hover:bg-zinc-800"
               aria-label="Toggle theme">
@@ -108,8 +84,8 @@
         </svg>
       </button>
 
-      <%# Hamburger %>
-      <button class="rounded-md p-2 text-zinc-500 transition-colors hover:bg-zinc-100 dark:text-zinc-400 dark:hover:bg-zinc-800"
+      <%# Hamburger (mobile only) %>
+      <button class="rounded-md p-2 text-zinc-500 transition-colors hover:bg-zinc-100 dark:text-zinc-400 dark:hover:bg-zinc-800 md:hidden"
               data-action="click->navbar#toggle"
               aria-label="Toggle menu">
         <svg data-navbar-target="openIcon" xmlns="http://www.w3.org/2000/svg" width="22" height="22"