Refactoring the default layout and adding highlight of the parent category of posts/categories in desktop.
This commit is contained in:
parent
3b12bdc0e5
commit
3dbb7dea44
|
@ -1,6 +1,6 @@
|
|||
% use Mojo::Util;
|
||||
% use BurguillosInfo::Categories;
|
||||
% layout 'default', current_slug => undef, categories => BurguillosInfo::Categories->new->Retrieve;
|
||||
% layout 'default', current_category_slug => undef, categories => BurguillosInfo::Categories->new->Retrieve;
|
||||
<div class="description">
|
||||
<h2>Esta página no existe.</h2>
|
||||
<p>Si un enlace te ha llevado aquí, reporta el error a <a href="mailto:contact@owlcode.tech">los administradores</a>.</p>
|
||||
|
|
|
@ -1,4 +1,6 @@
|
|||
<!DOCTYPE html>
|
||||
% my $categories = stash 'categories';
|
||||
% my $current_category_slug = stash 'current_category_slug';
|
||||
<html lang="es">
|
||||
<head>
|
||||
<script src="/js/index.js"></script>
|
||||
|
@ -21,41 +23,8 @@
|
|||
<div class="site-wrapper">
|
||||
</div>
|
||||
<div class="page-contents">
|
||||
<nav class="desktop"><% for my $category_key (sort {
|
||||
$categories->{$a}{priority} <=> $categories->{$b}{priority}
|
||||
} keys %$categories) {
|
||||
my $category = $categories->{$category_key};
|
||||
if (defined $category->{parent}) {
|
||||
next;
|
||||
}
|
||||
my $selected = defined($current_slug) && $category->{slug} eq $current_slug;
|
||||
%><a class="<%=$selected && "selected" %>" href="<%= '/'.$category->{slug} %>"><%==$category->{menu_text}%></a><%
|
||||
}
|
||||
%></nav>
|
||||
<nav class="mobile-shortcuts">
|
||||
<a class="go-to-index" href="<%='/'.$categories->{index}{slug}%>"><%== $categories->{index}{menu_text} %></a>
|
||||
<div></div>
|
||||
<a href="#mobile-foldable" class="menu-expand">
|
||||
<img class="open-menu-icon" src="/img/hamburger-menu-yellow.png" alt="Expandir el menú."/>
|
||||
<img class="open-menu-icon-hover" src="/img/hamburger-menu-purple.png" alt="Expandir el menú."/>
|
||||
</a>
|
||||
</nav>
|
||||
<nav class="mobile-foldable" id="mobile-foldable"><%
|
||||
my $first = 1;
|
||||
for my $category_key (sort {
|
||||
$categories->{$a}{priority} <=> $categories->{$b}{priority}
|
||||
} keys %$categories) {
|
||||
my $category = $categories->{$category_key};
|
||||
if (defined $category->{parent}) {
|
||||
next;
|
||||
}
|
||||
%><a href="<%= '/'.$category->{slug} %>"><%==$category->{menu_text}%></a><div class="child-categories-mobile"><%
|
||||
for my $child_category ($category->{children}->@*) {
|
||||
%><a href="<%="/$child_category->{slug}"%>">* <%==$child_category->{menu_text}%></a><%
|
||||
}%></div><%
|
||||
}
|
||||
%></nav>
|
||||
|
||||
%= include 'page/_desktop_menu', categories => $categories, current_category_slug => $current_category_slug
|
||||
%= include 'page/_mobile_menu', categories => $categories
|
||||
<%= content %></body>
|
||||
<hr/>
|
||||
<div class="footer description">
|
||||
|
|
|
@ -0,0 +1,24 @@
|
|||
% my $categories = stash 'categories';
|
||||
% my $current_category_slug = stash 'current_category_slug';
|
||||
<nav class="desktop"><%
|
||||
my @sorted_categories = sort {
|
||||
$categories->{$a}{priority} <=> $categories->{$b}{priority}
|
||||
} keys %$categories;
|
||||
my $target_category_slug = $current_category_slug;
|
||||
my $current_category = $categories->{$current_category_slug};
|
||||
if (defined $current_category) {
|
||||
my $possible_parent = $current_category->{parent};
|
||||
if (defined $possible_parent && defined $categories->{$possible_parent}) {
|
||||
$target_category_slug = $categories->{$possible_parent}{slug};
|
||||
}
|
||||
}
|
||||
for my $category_key (@sorted_categories) {
|
||||
my $category = $categories->{$category_key};
|
||||
if (defined $category->{parent}) {
|
||||
next;
|
||||
}
|
||||
my $selected = defined($target_category_slug) && $category->{slug} eq $target_category_slug;
|
||||
%><a class="<%=$selected && "selected" %>" href="<%= '/'.$category->{slug} %>"><%==$category->{menu_text}%></a><%
|
||||
}
|
||||
%></nav>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
% my $categories = stash 'categories';
|
||||
<nav class="mobile-shortcuts">
|
||||
<a class="go-to-index" href="<%='/'.$categories->{index}{slug}%>"><%== $categories->{index}{menu_text} %></a>
|
||||
<div></div>
|
||||
<a href="#mobile-foldable" class="menu-expand">
|
||||
<img class="open-menu-icon" src="/img/hamburger-menu-yellow.png" alt="Expandir el menú."/>
|
||||
<img class="open-menu-icon-hover" src="/img/hamburger-menu-purple.png" alt="Expandir el menú."/>
|
||||
</a>
|
||||
</nav>
|
||||
<nav class="mobile-foldable" id="mobile-foldable"><%
|
||||
my $first = 1;
|
||||
for my $category_key (sort {
|
||||
$categories->{$a}{priority} <=> $categories->{$b}{priority}
|
||||
} keys %$categories) {
|
||||
my $category = $categories->{$category_key};
|
||||
if (defined $category->{parent}) {
|
||||
next;
|
||||
}
|
||||
%><a href="<%= '/'.$category->{slug} %>"><%==$category->{menu_text}%></a><div class="child-categories-mobile"><%
|
||||
for my $child_category ($category->{children}->@*) {
|
||||
%><a href="<%="/$child_category->{slug}"%>">* <%==$child_category->{menu_text}%></a><%
|
||||
}%></div><%
|
||||
}
|
||||
%></nav>
|
|
@ -6,7 +6,7 @@
|
|||
%
|
||||
% use BurguillosInfo::Posts;
|
||||
%
|
||||
% layout 'default', current_slug => $current_category->{slug};
|
||||
% layout 'default', current_category_slug => $current_category->{slug};
|
||||
% title $current_category->{title};
|
||||
<div class="description">
|
||||
<h1><%= $current_category->{title} %></h1>
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
% use BurguillosInfo::Posts;
|
||||
% use BurguillosInfo::Categories;
|
||||
% my $categories = BurguillosInfo::Categories->new->Retrieve;
|
||||
% layout 'default', current_slug => $current_category->{slug}, categories => $categories;
|
||||
% layout 'default', current_category_slug => $current_category->{slug}, categories => $categories;
|
||||
% title $post->{title};
|
||||
<div class="description">
|
||||
<h2><%= $post->{title} %></h2>
|
||||
|
|
Loading…
Reference in New Issue