hide last svg when dropdown is close

openpoke · May 28, 2024 · e46fd38 · e46fd38
1 parent 1ec12b6
commit e46fd38
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 6 deletions.
diff --git a/decidim-core/app/packs/stylesheets/decidim/_header.scss b/decidim-core/app/packs/stylesheets/decidim/_header.scss
@@ -214,14 +214,10 @@ header {
         @apply md:hidden;
       }
     }
-
-    [data-target*="dropdown"] {
-      @apply last-of-type:[&>svg]:block;
-    }
   }
 
   .menu-bar {
-    @apply container h-full flex justify-between items-center lg:relative;
+    @apply container h-full flex justify-between items-center lg:relative last-of-type:[&>svg]:hidden; 
 
     &__container {
       @apply bg-primary relative h-14;
@@ -341,7 +337,7 @@ header {
         @apply md:block lg:hidden w-auto last-of-type:[&>svg]:block ml-auto;
 
         > svg {
-          @apply text-white;
+          @apply text-gray;
         }
       }
     }

diff --git a/decidim-core/app/views/layouts/decidim/header/_main.html.erb b/decidim-core/app/views/layouts/decidim/header/_main.html.erb
@@ -17,6 +17,7 @@
           data-component="dropdown"
           data-target="dropdown-menu-main-mobile">
           <%= icon "menu-line" %><span class="sr-only"><%= t("main_menu", scope: "layouts.decidim.header") %></span>
+          <%= icon "close-line" %><span class="sr-only"><%= t("main_menu", scope: "layouts.decidim.header") %></span>
         </button>
 
         <div id="dropdown-menu-main-mobile" class="main-bar__links-mobile__dropdown" aria-hidden="true">

diff --git a/decidim-core/app/views/layouts/decidim/header/_menu_breadcrumb_main_dropdown.html.erb b/decidim-core/app/views/layouts/decidim/header/_menu_breadcrumb_main_dropdown.html.erb
@@ -19,6 +19,32 @@
       <% end %>
     </div>
     <%= breadcrumb_root_menu.render %>
+          <% if available_locales.length > 1 %>
+        <div class="main-footer__language-container">
+          <button id="trigger-dropdown-language-chooser" data-component="dropdown" data-target="dropdown-menu-language-chooser" class="main-footer__language-trigger">
+            <%= icon "global-line" %>
+            <span><%= t("name", scope: "locale" ) %></span>
+            <%= icon "arrow-down-s-line" %>
+            <span class="sr-only">
+              <% available_locales.each do |locale| %>
+                <span lang="<%= locale %>">
+                  <%= I18n.with_locale(locale) { t("layouts.decidim.language_chooser.choose_language") } %>
+                </span>
+              <% end %>
+            </span>
+          </button>
+
+          <div id="dropdown-menu-language-chooser" aria-hidden="true">
+            <ul class="main-footer__language" role="menu">
+              <% (available_locales - [I18n.locale.to_s]).each do |locale| %>
+                <li class="text-black text-md hover:bg-secondary hover:text-white transition" role="presentation">
+                  <%= link_to locale_name(locale), decidim.locale_path(locale:), method: :post, role: "menuitem", lang: locale, class: "p-2 w-full block" %>
+                </li>
+              <% end %>
+            </ul>
+          </div>
+        </div>
+      <% end %>
   </div>
   <div class="menu-bar__main-dropdown__bottom">
     <div class="menu-bar__main-dropdown__bottom-left">