#mobile-menu.absolute.top-0.left-0.w-full.hidden .p-5.bg-white.border.rounded.shadow-sm .flex.items-center.justify-between.mb-4 %div %a.inline-flex.items-center{"aria-label" => "Hub Feenix", :href => "/", :title => "Hub Feenix"} = image_tag("feenix_lintu.webp" , class: "h-20") %span.ml-2.text-xl.font-bold.tracking-wide.text-gray-800.uppercase Hub Feenix %div %button.p-2.-mt-2.-mr-2.transition.duration-200.rounded.hover:bg-gray-200.focus:bg-gray-200.focus:outline-none.focus:shadow-outline{"aria-label" => "Close Menu", :title => "Close Menu" , onclick: "menu_off();"} %svg.w-5.text-gray-600{:viewbox => "0 0 24 24"} %path{:d => "M19.7,4.3c-0.4-0.4-1-0.4-1.4,0L12,10.6L5.7,4.3c-0.4-0.4-1-0.4-1.4,0s-0.4,1,0,1.4l6.3,6.3l-6.3,6.3 c-0.4,0.4-0.4,1,0,1.4C4.5,19.9,4.7,20,5,20s0.5-0.1,0.7-0.3l6.3-6.3l6.3,6.3c0.2,0.2,0.5,0.3,0.7,0.3s0.5-0.1,0.7-0.3 c0.4-0.4,0.4-1,0-1.4L13.4,12l6.3-6.3C20.1,5.3,20.1,4.7,19.7,4.3z", :fill => "currentColor"} %nav %ul.space-y-6.px-20 - main_menu.each do |link , text| %li %a.w-full.h-full.block.tracking-wide.text-xl.p-2.rounded-lg.hover:bg-cyan-200{ :href => link , :title => text} = text %li %hr - mobile_menu.each do |link , text| %li %a.w-full.h-full.block.tracking-wide.text-xl.p-2.rounded-lg.hover:bg-cyan-200{ :href => link , :title => text} = text :javascript var drop_hidden = true; function menu_on() { var x = document.getElementById("mobile-menu"); x.style.display = "block"; } function menu_off() { var x = document.getElementById("mobile-menu"); x.style.display = "none"; }