blog/themes/fluid/layout/_partials/header/navigation.ejs
2024-11-16 11:34:10 +08:00

71 lines
3.2 KiB
Plaintext

<nav id="navbar" class="navbar fixed-top navbar-expand-lg navbar-dark scrolling-navbar">
<div class="container">
<a class="navbar-brand" href="<%= url_for() %>">
<strong><%= theme.navbar.blog_title || config.title %></strong>
</a>
<button id="navbar-toggler-btn" class="navbar-toggler" type="button" data-toggle="collapse"
data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<div class="animated-icon"><span></span><span></span><span></span></div>
</button>
<!-- Collapsible content -->
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto text-center">
<% for(const each of theme.navbar.menu || []) { %>
<% if (!each.submenu && !each.link) continue %>
<% var text = each.name || __(each.key + '.menu') || __(each.key + '.title') %>
<% if (text.indexOf('.menu') !== -1 || text.indexOf('.title') !== -1) {
text = each.key
} %>
<% if (each.submenu) { %>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" target="_self" href="javascript:;" role="button"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<%- each.icon ? '<i class="' + each.icon + '"></i>' : '' %>
<span><%- text %></span>
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<% for(const subEach of each.submenu || []) { %>
<% if (!subEach.link) continue %>
<% var subText = subEach.name || __(subEach.key + '.title') %>
<% if (subText.indexOf('.title') !== -1) {
subText = subEach.key
} %>
<a class="dropdown-item" href="<%= url_for(subEach.link) %>">
<%- subEach.icon ? '<i class="' + subEach.icon + '"></i>' : '' %>
<span><%- subText %></span>
</a>
<% } %>
</div>
</li>
<% } else { %>
<li class="nav-item">
<a class="nav-link" href="<%= url_for(each.link) %>">
<%- each.icon ? '<i class="' + each.icon + '"></i>' : '' %>
<span><%- text %></span>
</a>
</li>
<% } %>
<% } %>
<% if(theme.search.enable) { %>
<li class="nav-item" id="search-btn">
<a class="nav-link" target="_self" href="javascript:;" data-toggle="modal" data-target="#modalSearch" aria-label="Search">
<i class="iconfont icon-search"></i>
</a>
</li>
<% import_js(theme.static_prefix.internal_js, 'local-search.js') %>
<% } %>
<% if(theme.dark_mode && theme.dark_mode.enable) { %>
<li class="nav-item" id="color-toggle-btn">
<a class="nav-link" target="_self" href="javascript:;" aria-label="Color Toggle">
<i class="iconfont icon-dark" id="color-toggle-icon"></i>
</a>
</li>
<% } %>
</ul>
</div>
</div>
</nav>