web/_includes/topbar.html
2021-07-21 23:50:16 +08:00

75 lines
2.4 KiB
HTML

<!--
The Top Bar
-->
<div id="topbar-wrapper" class="row justify-content-center topbar-down">
<div id="topbar" class="col-11 d-flex h-100 align-items-center justify-content-between">
<span id="breadcrumb">
{% assign paths = page.url | split: '/' %}
{% if paths.size == 0 or page.layout == 'home' %}
<!-- index page -->
<span>{{ site.data.locales[site.lang].tabs.home | default: 'home' | capitalize }}</span>
{% else %}
{% for item in paths %}
{% if forloop.first %}
<span>
<a href="{{ '/' | relative_url }}">
{{ site.data.locales[site.lang].tabs.home | default: 'home' | capitalize }}
</a>
</span>
{% elsif forloop.last %}
{% if page.collection == 'tabs' %}
<span>{{ site.data.locales[site.lang].tabs[item] | default: page.title }}</span>
{% else %}
<span>{{ page.title }}</span>
{% endif %}
{% else %}
{% unless page.layout == 'post' %}
<span>
<a href="{{ item | relative_url }}">
{{ site.data.locales[site.lang].tabs[item] | default: page.title }}
</a>
</span>
{% endunless %}
{% endif %}
{% endfor %}
{% endif %}
</span><!-- endof #breadcrumb -->
<i id="sidebar-trigger" class="fas fa-bars fa-fw"></i>
<div id="topbar-title">
{% if page.layout == 'home' %}
{{- site.data.locales[site.lang].title | default: site.title -}}
{% elsif page.collection == 'tabs' %}
{%- capture tab_key -%}{{ page.url | split: '/' }}{%- endcapture -%}
{{- site.data.locales[site.lang].tabs[tab_key] | default: page.title -}}
{% else %}
{{- site.data.locales[site.lang].layout[page.layout] | default: page.layout | capitalize -}}
{% endif %}
</div>
<i id="search-trigger" class="fas fa-search fa-fw"></i>
<span id="search-wrapper" class="align-items-center">
<i class="fas fa-search fa-fw"></i>
<input class="form-control" id="search-input" type="search"
aria-label="search" autocomplete="off" placeholder="{{ site.data.locales[site.lang].search.hint | default: 'Search' | capitalize }}...">
<i class="fa fa-times-circle fa-fw" id="search-cleaner"></i>
</span>
<span id="search-cancel" >{{ site.data.locales[site.lang].search.cancel | default: 'Cancel' }}</span>
</div>
</div>