Skip to content

Commit

Permalink
Move NavigationHelper
Browse files Browse the repository at this point in the history
  • Loading branch information
Kirill Kaiumov authored and damianlegawiec committed Nov 20, 2019
1 parent d412be2 commit 9238b6a
Show file tree
Hide file tree
Showing 4 changed files with 165 additions and 15 deletions.
39 changes: 39 additions & 0 deletions frontend/app/helpers/spree/navigation_helper.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
module Spree
module NavigationHelper
def categories_data
[
{
name: :women,
url: nested_taxons_path('women'),
subcategories: [
{ dresses: nested_taxons_path('women/dresses') },
{ shirts_and_blouses: nested_taxons_path('women/shirts-and-blouses') },
{ t_shirts_and_tops: nested_taxons_path('women/tops-and-t-shirts') },
{ sweaters: nested_taxons_path('women/sweaters') },
{ skirts: nested_taxons_path('women/skirts') },
{ jackets_and_coats: nested_taxons_path('women/jackets-and-coats') }
]
},
{
name: :men,
url: nested_taxons_path('men'),
subcategories: [
{ shirts: nested_taxons_path('men/shirts') },
{ t_shirts: nested_taxons_path('men/t-shirts') },
{ sweaters: nested_taxons_path('men/sweaters') },
{ jackets_and_coats: nested_taxons_path('men/jackets-and-coats') }
]
},
{
name: :sportswear,
url: nested_taxons_path('sportswear'),
subcategories: [
{ tops: nested_taxons_path('sportswear/tops') },
{ pants: nested_taxons_path('sportswear/pants') },
{ sweatshirts: nested_taxons_path('sportswear/sweatshirts') }
]
}
]
end
end
end
41 changes: 41 additions & 0 deletions frontend/app/views/spree/shared/_category_nav_bar.html.erb
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
<div class="container p-0 d-flex justify-content-xl-around mx-auto">
<div class="row">
<div class="category-links">
<div class="category-links-header text-uppercase">
<%= Spree.t('category_nav_bar.categories')%>
</div>

<ul class="pl-0">
<% link_categories.each do |link_category| %>
<li>
<a href="<%= link_category.values.first %>" class="text-uppercase" >
<%= I18n.t("navigation.subcategories.#{link_category.keys.first}") %>
</a>
</li>
<% end %>
</ul>
</div>

<%= link_to nested_taxons_path('streetstyle') do %>
<div class="category-image category-image text-center mx-3">
<%= main_nav_image(category, "summer_collection") %>

<div class="category-box">
<div class="category-box-small-text"><%= Spree.t('category_nav_bar.new_collection') %></div>
<div class="category-box-big-text"><%= Spree.t('category_nav_bar.summer_2019') %></div>
</div>
</div>
<% end %>

<%= link_to nested_taxons_path('summer-sale') do %>
<div class="category-image category-image text-center mx-3">
<%= main_nav_image(category, "special_offers") %>

<div class="category-box">
<div class="category-box-small-text"><%= Spree.t('category_nav_bar.special_offers') %></div>
<div class="category-box-big-text"><%= Spree.t('category_nav_bar.get_up_to_30_percent_off') %></div>
</div>
</div>
<% end %>
</div>
</div>
30 changes: 15 additions & 15 deletions frontend/app/views/spree/shared/_main_nav_bar.html.erb
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
<nav id="main-nav-bar" class="navbar">
<ul class="nav" data-hook>
<li id="home-link" class="nav-item" data-hook>
<%= link_to Spree.t(:home), spree.root_path, class: 'nav-link' %>
<ul class="nav h-100 main-nav-bar" data-hook>
<% categories_data.each do |category| %>
<li class="navbar main-nav-bar-dropdown main-nav-bar-category" data-hook>
<a href="<%= category[:url] %>" class="p-2 main-nav-bar-item main-nav-bar-category-button">
<%= category[:name] %>
</a>

<div class="w-100 shadow main-nav-bar-category-dropdown">
<%= render partial: 'spree/shared/category_nav_bar', locals: {
link_categories: category[:subcategories],
category: category[:name]
} %>
</div>
</li>
</ul>
<ul class="nav navbar-right" data-hook>
<li id="link-to-cart" class="nav-item" data-hook>
<noscript>
<%= link_to_cart %>
</noscript>
&nbsp;
</li>
<script>Spree.fetch_cart()</script>
</ul>
</nav>
<% end %>
</ul>
70 changes: 70 additions & 0 deletions frontend/app/views/spree/shared/_mobile_navigation.html.erb
Original file line number Diff line number Diff line change
@@ -0,0 +1,70 @@
<div class="position-fixed text-uppercase d-xl-none mobile-navigation">
<div class="d-flex align-items-center bg-white header-spree" data-hook>
<div class="container-fluid header-spree-fluid">
<div class="d-flex flex-nowrap align-items-center">
<div class="d-xl-none flex-grow-1">
<button id="mobile-navigation-back-button" aria-label="<%= Spree.t('nav_bar.go_to_previous_menu') %>">
<%= icon(name: 'arrow-right',
classes: 'd-sm-none spree-icon-arrow spree-icon-arrow-left',
width: 18,
height: 18) %>
<%= icon(name: 'arrow-right',
classes: 'd-none d-sm-inline spree-icon-arrow spree-icon-arrow-left',
width: 17,
height: 28) %>
</button>
</div>
<figure class="logo flex-grow-0 flex-xl-grow-1 order-xl-0 header-spree-fluid-logo" data-hook>
<%= logo %>
</figure>
<div id="top-nav-bar-mobile" class="text-right flex-grow-1 header-spree-fluid-secondary-navigation" data-hook>
<button id="mobile-navigation-close-button" aria-label="<%= Spree.t('nav_bar.close_menu') %>">
<%= icon(name: 'close',
classes: 'd-sm-none',
width: 17,
height: 17) %>
<%= icon(name: 'close',
classes: 'd-none d-sm-inline',
width: 26,
height: 26) %>
</button>
</div>
</div>
</div>
</div>

<ul class="list-unstyled position-relative h-100 mobile-navigation-list">
<% categories_data.each do |category| %>
<li class="d-flex justify-content-between align-items-center mobile-navigation-list-item">
<a class="w-75" href="<%= category[:url] %>">
<%= I18n.t("navigation.categories.#{category[:name]}") %>
</a>

<a class="w-25 text-right mobile-navigation-category-link" data-category="<%= category[:name].to_s %>" href="#" aria-label="<%= Spree.t('go_to_category')%>">
<%= icon(name: 'arrow-right',
classes: 'd-sm-none spree-icon-arrow spree-icon-arrow-right',
width: 16,
height: 16) %>
<%= icon(name: 'arrow-right',
classes: 'd-none d-sm-inline spree-icon-arrow spree-icon-arrow-right',
width: 14,
height: 27) %>
</a>

<ul class="list-unstyled position-absolute mobile-navigation-sublist" data-category="<%= category[:name].to_s %>">
<li class="text-center font-weight-bold mobile-navigation-sublist-header">
<%= I18n.t("navigation.categories.#{category[:name]}") %>
</li>

<% category[:subcategories].each do |subcategory| %>
<li class="d-flex justify-content-between align-items-center mobile-navigation-list-item">
<a class="w-75" href="<%= subcategory.values.first %>">
<%= I18n.t("navigation.subcategories.#{subcategory.keys.first}") %>
</a>
</li>
<% end %>
</ul>
</li>
<% end %>
</ul>
</div>

0 comments on commit 9238b6a

Please sign in to comment.