_wrapper.html.erb

<%
  if respond_to?(:current_component) && current_component && can_be_managed?(current_component)
    edit_link(
        manage_component_path(current_component),
        :read,
        :component,
        component: current_component,
        current_participatory_space: current_participatory_space
    )
  end
%>

<div class="off-canvas-wrapper">
  <div class="off-canvas-wrapper-inner" data-off-canvas-wrapper>
    <div class="off-canvas position-right hide-for-large" data-position="right"
         id="offCanvas" data-off-canvas>
      <!-- Close button -->
      <button class="close-button"
              aria-label="<%= t("layouts.decidim.header.close_menu") %>" type="button"
              data-close>
        <span aria-hidden="true">&times;</span>
      </button>
      <!-- Menu -->
      <div class="hide-for-medium" data-set="nav-holder"></div>
      <div class="hide-for-medium usermenu-off-canvas-holder"
           data-set="nav-login-holder"></div>
      <div class="hide-for-medium mt-s ml-s mr-s search-off-canvas-holder"
           data-set="nav-search-holder"></div>
    </div>
    <div class="off-canvas-content" data-off-canvas-content>
      <div class="footer-separator">
        <!--separates the footer from the rest of the page,
             creates a sticky footer-->
        <!-- Topbar -->
        <%# START Modifications for decidim Zürich %>
        <div class="title-bar">
          <div id="header" class="mod_header mod_header--bar is_sticky_topbar" data-init="header" style="">
            <div id="logobar" class="mod_header__logobar" data-header="logobar">
              <div class="mod_header__logobar-inner">
                <div class="mod_header__logobar-logo">
                  <%= render partial: "layouts/decidim/logo", locals: { organization: current_organization } %>
                </div>
              </div>
            </div>
            <div id="topbar" class="mod_header__topbar" data-header="topbar" style="transform: none;">
              <div class="mod_header__topbar-inner">
                <div class="top_actions" data-header="topactions">
                  <%= render partial: "layouts/decidim/topbar_search" %>
                  <%= render partial: "layouts/decidim/language_chooser" %>
                  <div class="hide-for-medium topbar__menu">
                    <button type="button" data-toggle="offCanvas" aria-label="<%= t("layouts.decidim.header.navigation") %>">
                      <%= icon "menu", aria_label: t("layouts.decidim.header.navigation"), role: "img" %>
                    </button>
                  </div>
                  <div class="show-for-medium">
                    <%= render partial: "layouts/decidim/admin_links" %>
                  </div>
                  <% if current_user %>
                    <nav class="topbar__dropmenu topbar__user__logged">
                      <%= link_to decidim.notifications_path, class: "topbar__notifications #{current_user.notifications.any? ? "is-active" : ""}" do %>
                        <%= icon "bell", role: "img", aria_label: t("layouts.decidim.user_menu.notifications") %>
                      <% end %>
                      <%= link_to decidim.conversations_path, class: "topbar__conversations #{current_user.unread_conversations.any? ? "is-active" : ""}" do %>
                        <%= icon "envelope-closed", role: "img", aria_label: t("layouts.decidim.user_menu.conversations") %>
                      <% end %>
                      <ul class="dropdown menu" data-dropdown-menu
                          data-autoclose="false"
                          data-disable-hover="true"
                          data-click-open="true"
                          data-close-on-click="true">
                        <li class="is-dropdown-submenu-parent show-for-medium" tabindex="-1">
                          <%= link_to current_user.name, decidim.account_path, id: "user-menu-control", "aria-controls": "user-menu", "aria-haspopup": "true", "aria-label": t("layouts.decidim.user_menu.account", name: current_user.name) %>
                          <ul class="menu is-dropdown-submenu" id="user-menu" role="menu" aria-labelledby="user-menu-control" tabindex="-1">
                            <%= render partial: "layouts/decidim/user_menu" %>
                          </ul>
                          <div data-set="nav-login-holder" class="show-for-medium">
                            <!-- Repeated due to dropdown limitations -->
                            <ul class="menu is-dropdown-submenu js-append usermenu-off-canvas">
                              <%= render partial: "layouts/decidim/user_menu" %>
                            </ul>
                          </div>
                        </li>
                      </ul>
                    </nav>
                  <% else %>
                    <div class="topbar__user show-for-medium" data-set="nav-login-holder">
                      <div class="topbar__user__login js-append">
                        <% if current_organization.sign_up_enabled? %>
                          <%= link_to t("layouts.decidim.header.sign_up"), decidim.new_user_registration_path, class: "sign-up-link" %>
                        <% end %>
                        <%= link_to t("layouts.decidim.header.sign_in"), decidim.new_user_session_path, class: "sign-in-link" %>
                      </div>
                    </div>
                  <% end %>
                </div>
              </div>
            </div>
          </div>
        </div>
        <%# END Modifications for decidim Zürich %>
        <div class="show-for-medium" data-set="nav-holder">
          <div class="navbar js-append">
            <div class="row column">
              <%= main_menu.render %>
            </div>
          </div>
        </div>

        <main id="content">
          <%= display_flash_messages %>
          <%= yield %>
        </main>
      </div>
      <%= render partial: "layouts/decidim/main_footer" %>
      <%= render partial: "layouts/decidim/mini_footer" %>
    </div>
  </div>
</div>