Use `collections` to improve the tabs
This commit is contained in:
Cotes Chung
parent
1f2ed3db60
commit
270d3ba499
22
_config.yml
22
_config.yml
|
|
@ -17,8 +17,8 @@ description: >- # used by seo meta and the atom feed
|
|||
bootstrap Jekyll theme with responsive web design
|
||||
and focuses on text presentation.
|
||||
|
||||
# Replace with the website url, e.g. 'https://username.github.io'
|
||||
url: 'protocol://domain'
|
||||
# fill in the base hostname & protocol for your site, e.g., 'https://username.github.io'
|
||||
url: ''
|
||||
|
||||
author: your_full_name # change to your full name
|
||||
|
||||
|
|
@ -80,7 +80,7 @@ disqus:
|
|||
#
|
||||
theme_mode: dual
|
||||
|
||||
# boolean type, global switch for ToC in posts.
|
||||
# boolean type, the global switch for ToC in posts.
|
||||
toc: true
|
||||
|
||||
paginate: 10
|
||||
|
|
@ -105,16 +105,21 @@ kramdown:
|
|||
# or you think you're smart enough to change other relevant URLs within this template.
|
||||
permalink: /posts/:title/
|
||||
|
||||
collections:
|
||||
tabs:
|
||||
output: true
|
||||
sort_by: order
|
||||
|
||||
|
||||
defaults:
|
||||
-
|
||||
scope:
|
||||
path: "" # An empty string here means all files in the project
|
||||
path: '' # An empty string here means all files in the project
|
||||
type: posts
|
||||
values:
|
||||
layout: post
|
||||
comments: true # Enable comments in posts.
|
||||
toc: true # Display TOC column in posts.
|
||||
location: Post
|
||||
breadcrumb:
|
||||
-
|
||||
label: Posts
|
||||
|
|
@ -128,8 +133,6 @@ defaults:
|
|||
scope:
|
||||
path: tags
|
||||
values:
|
||||
tab_active: Tags
|
||||
location: Tag
|
||||
breadcrumb:
|
||||
-
|
||||
label: Home
|
||||
|
|
@ -141,8 +144,6 @@ defaults:
|
|||
scope:
|
||||
path: categories
|
||||
values:
|
||||
tab_active: Categories
|
||||
location: Category
|
||||
breadcrumb:
|
||||
-
|
||||
label: Home
|
||||
|
|
@ -152,7 +153,8 @@ defaults:
|
|||
url: /tabs/categories/
|
||||
-
|
||||
scope:
|
||||
path: tabs
|
||||
path: ''
|
||||
type: tabs # see `site.collections`
|
||||
values:
|
||||
layout: page
|
||||
dynamic_title: true # Hide title in mobile screens.
|
||||
|
|
|
|||
|
|
@ -1,30 +0,0 @@
|
|||
# The tab data.
|
||||
# v2.1
|
||||
# https://github.com/cotes2020/jekyll-theme-chirpy
|
||||
# © 2020 Cotes Chung
|
||||
# MIT Licensed
|
||||
|
||||
|
||||
-
|
||||
name: Home
|
||||
icon: "fas fa-home"
|
||||
-
|
||||
name: Categories
|
||||
icon: "fas fa-stream"
|
||||
path: tabs
|
||||
url: categories
|
||||
-
|
||||
name: "Tags"
|
||||
icon: "fas fa-tags"
|
||||
path: tabs
|
||||
url: tags
|
||||
-
|
||||
name: "Archives"
|
||||
path: tabs
|
||||
url: archives
|
||||
icon: "fas fa-archive"
|
||||
-
|
||||
name: "About"
|
||||
icon: "fas fa-info"
|
||||
path: tabs
|
||||
url: about
|
||||
|
|
@ -12,21 +12,22 @@
|
|||
|
||||
{% elsif page.layout == 'page' %}
|
||||
|
||||
{% if page.type == 'categories' %}
|
||||
{% if page.collection == 'tabs' and page.title != 'About' %}
|
||||
|
||||
{% if page.title == 'Categories' %}
|
||||
<link rel="preload" href="{{ '/assets/css/categories.css' | relative_url }}" as="style">
|
||||
<link rel="stylesheet" href="{{ '/assets/css/categories.css' | relative_url }}">
|
||||
|
||||
{% elsif page.type == 'tags' %}
|
||||
|
||||
{% elsif page.title == 'Tags' %}
|
||||
<link rel="preload" href="{{ '/assets/css/tags.css' | relative_url }}" as="style">
|
||||
<link rel="stylesheet" href="{{ '/assets/css/tags.css' | relative_url }}">
|
||||
|
||||
{% elsif page.type == 'archives' %}
|
||||
|
||||
{% elsif page.title == 'Archives'%}
|
||||
<link rel="preload" href="{{ '/assets/css/archives.css' | relative_url }}" as="style">
|
||||
<link rel="stylesheet" href="{{ '/assets/css/archives.css' | relative_url }}">
|
||||
|
||||
{% endif %}
|
||||
|
||||
{% else %}
|
||||
|
||||
<link rel="preload" href="{{ '/assets/css/page.css' | relative_url }}" as="style">
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@
|
|||
|
||||
{% elsif page.layout == 'page' %}
|
||||
|
||||
{% if page.type == 'categories' %}
|
||||
{% if page.title == 'Categories' and page.collection == 'tabs' %}
|
||||
<script async src="{{ '/assets/js/categories.min.js' | relative_url }}"></script>
|
||||
{% else %}
|
||||
<script async src="{{ '/assets/js/page.min.js' | relative_url }}"></script>
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@
|
|||
-->
|
||||
|
||||
<div id="nav-wrapper">
|
||||
|
||||
<div id="profile-wrapper" class="d-flex flex-column">
|
||||
<div id="avatar" class="d-flex justify-content-center">
|
||||
<a href="{{ site.baseurl }}/" alt="avatar">
|
||||
|
|
@ -25,28 +26,22 @@
|
|||
</div>
|
||||
<div class="site-subtitle font-italic">{{- site.tagline -}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- #profile-wrapper -->
|
||||
|
||||
<ul class="nav flex-column">
|
||||
{% assign page_urls = page.url | split: "/" %}
|
||||
|
||||
{% for item in site.data.tabs %}
|
||||
{% assign ref = site.baseurl | append: "/" %}
|
||||
|
||||
{% if item.path %}
|
||||
{% assign ref = ref | append: item.path | append: "/" %}
|
||||
{% if item.url %}
|
||||
{% assign ref = ref | append: item.url | append: "/" %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
<li class="nav-item d-flex justify-content-center
|
||||
{% if item.url == page_urls.last
|
||||
or item.name == page.tab_active
|
||||
or item.name == "Home" and page.layout == "home" %}active{% endif %}">
|
||||
<a href="{{ ref }}" class="nav-link d-flex justify-content-center align-items-center w-100">
|
||||
<i class="fa-fw {{ item.icon }} ml-xl-3 mr-xl-3 unloaded"></i>
|
||||
<span>{{ item.name | upcase }}</span>
|
||||
<!-- home -->
|
||||
<li class="nav-item d-flex justify-content-center {% if page.layout == 'home' %}active{% endif %}">
|
||||
<a href="/" class="nav-link d-flex justify-content-center align-items-center w-100">
|
||||
<i class="fa-fw fas fa-home ml-xl-3 mr-xl-3 unloaded"></i>
|
||||
<span>{{ "HOME" }}</span>
|
||||
</a>
|
||||
</li>
|
||||
<!-- the real tabs -->
|
||||
{% for tab in site.tabs %}
|
||||
<li class="nav-item d-flex justify-content-center {% if tab.url == page.url %}active{% endif %}">
|
||||
<a href="{{ tab.url }}" class="nav-link d-flex justify-content-center align-items-center w-100">
|
||||
<i class="fa-fw {{ tab.icon }} ml-xl-3 mr-xl-3 unloaded"></i>
|
||||
<span>{{ tab.title | upcase }}</span>
|
||||
</a>
|
||||
</li> <!-- .nav-item -->
|
||||
{% endfor %}
|
||||
|
|
|
|||
|
|
@ -29,12 +29,12 @@
|
|||
<i id="sidebar-trigger" class="fas fa-bars fa-fw"></i>
|
||||
|
||||
<div id="topbar-title">
|
||||
{% if page.location %}
|
||||
{{- page.location -}}
|
||||
{% elsif page.layout == "home" %}
|
||||
{% if page.layout == 'home' %}
|
||||
{{- site.title -}}
|
||||
{% else %}
|
||||
{% elsif page.collection == 'tabs' %}
|
||||
{{- page.title -}}
|
||||
{% else %}
|
||||
{{- page.layout | capitalize -}}
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,7 @@
|
|||
---
|
||||
title: About
|
||||
icon: fas fa-info
|
||||
order: 4
|
||||
|
||||
# The About page
|
||||
# v2.0
|
||||
|
|
@ -8,4 +10,5 @@ title: About
|
|||
# MIT License
|
||||
---
|
||||
|
||||
> **Note**: Add Markdown syntax content to file `tabs/about.md` and it will show up on this page.
|
||||
|
||||
> **Note**: Add Markdown syntax content to file `_tabs/about.md` and it will show up on this page.
|
||||
|
|
@ -1,6 +1,8 @@
|
|||
---
|
||||
title: Archives
|
||||
type: archives
|
||||
icon: fas fa-archive
|
||||
order: 3
|
||||
|
||||
# The Archives of posts.
|
||||
# v2.0
|
||||
# https://github.com/cotes2020/jekyll-theme-chirpy
|
||||
|
|
@ -1,6 +1,8 @@
|
|||
---
|
||||
title: Categories
|
||||
type: categories
|
||||
icon: fas fa-stream
|
||||
order: 1
|
||||
|
||||
# All the Categories of posts
|
||||
# v2.0
|
||||
# https://github.com/cotes2020/jekyll-theme-chirpy
|
||||
|
|
@ -1,6 +1,8 @@
|
|||
---
|
||||
title: Tags
|
||||
type: tags
|
||||
icon: fas fa-tags
|
||||
order: 2
|
||||
|
||||
# All the Tags of posts.
|
||||
# v2.0
|
||||
# https://github.com/cotes2020/jekyll-theme-chirpy
|
||||
|
|
@ -64,7 +64,7 @@ body {
|
|||
|
||||
/*--- sidebar layout ---*/
|
||||
|
||||
$tab-count: {{ site.data.tabs | size }};
|
||||
$tab-count: {{ site.tabs | size | plus: 1 }}; // plus 1 for home tab
|
||||
|
||||
$sidebar-display: "sidebar-display";
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue