Add author to blog-page

Add default_mode to choose light mode or dark mode
This commit is contained in:
HeilAsuka 2023-09-29 11:22:02 +08:00
parent 923614812e
commit be92775fce
No known key found for this signature in database
GPG key ID: 4B494214FF7AC06F
2 changed files with 51 additions and 23 deletions

View file

@ -3,42 +3,43 @@
{% block content %} {% block content %}
<div><a href="..">..</a>/<span class="metaData">{{ page.slug }}</span></div> <div><a href="..">..</a>/<span class="metaData">{{ page.slug }}</span></div>
<time datetime="{{ page.date }}">Published on: <span class="metaData">{{ page.date }}</span></time> <time datetime="{{ page.date }}">Published on: <span class="metaData">{{ page.date }}</span></time>
<address rel="author">By <span class="metaData">{{config.extra.author}}</span></address>
<h1>{{ page.title }}</h1> <h1>{{ page.title }}</h1>
{% if page.toc and page.extra.toc %} {% if page.toc and page.extra.toc %}
<h2>Table of contents</h2> <h2>Table of contents</h2>
<ul> <ul>
{% for h1 in page.toc %} {% for h1 in page.toc %}
<li> <li>
<a href="{{ h1.permalink | safe }}">{{ h1.title }}</a> <a href="{{ h1.permalink | safe }}">{{ h1.title }}</a>
{% if h1.children %} {% if h1.children %}
<ul> <ul>
{% for h2 in h1.children %} {% for h2 in h1.children %}
<li> <li>
<a href="{{ h2.permalink | safe }}">{{ h2.title }}</a> <a href="{{ h2.permalink | safe }}">{{ h2.title }}</a>
<ul> <ul>
{% for h3 in h2.children %} {% for h3 in h2.children %}
<li> <li>
<a href="{{ h3.permalink | safe }}">{{ h3.title }}</a> <a href="{{ h3.permalink | safe }}">{{ h3.title }}</a>
</li> </li>
{% endfor %} {% endfor %}
</ul> </ul>
</li> </li>
{% endfor %} {% endfor %}
</ul> </ul>
{% endif %} {% endif %}
</li> </li>
{% endfor %} {% endfor %}
</ul> </ul>
{% endif %} {% endif %}
{{ page.content | safe }} {{ page.content | safe }}
<p class="tagsData"> <p class="tagsData">
{% if page.taxonomies.tags %} {% if page.taxonomies.tags %}
{% for tag in page.taxonomies.tags %} {% for tag in page.taxonomies.tags %}
<a href="/tags/{{ tag | slugify }}">&#47;{{ tag }}&#47;</a> <a href="/tags/{{ tag | slugify }}">&#47;{{ tag }}&#47;</a>
{% endfor %} {% endfor %}
{% endif %} {% endif %}
</p> </p>
{% endblock content %} {% endblock content %}

View file

@ -3,23 +3,50 @@
{% for nav_item in config.extra.header_nav %} {% for nav_item in config.extra.header_nav %}
{% set current_nav_item = nav_item[lang] %} {% set current_nav_item = nav_item[lang] %}
{% if current_nav_item and current_nav_item.name %} {% if current_nav_item and current_nav_item.name %}
<a href="{{ get_url(path=current_nav_item.url) }}" {% if current_nav_item.new_tab %}target="_blank" rel="noreferrer noopener"{% endif %}>{{ current_nav_item.name }}</a> <a href="{{ get_url(path=current_nav_item.url) }}" {% if current_nav_item.new_tab %}target="_blank"
rel="noreferrer noopener" {% endif %}>{{ current_nav_item.name }}</a>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
<div class="themeSwitch"> <div class="themeSwitch">
<button class="themeButton light" onclick="setTheme('light')" title="Light mode"><svg class="icons icons__background"><use href="{{ get_url(path='icons.svg#lightMode', trailing_slash=false) | safe }}"></use></svg></button> {% if not config.extra.default_mode %}
<button class="themeButton dark" onclick="setTheme('dark')" title="Dark mode"><svg class="icons icons__background"><use href="{{ get_url(path='icons.svg#darkMode', trailing_slash=false) | safe }}"></use></svg></button> <button class="themeButton light" onclick="setTheme('light')" title="Light mode"><svg
class="icons icons__background">
<use href="{{ get_url(path='icons.svg#lightMode', trailing_slash=false) | safe }}"></use>
</svg></button>
<button class="themeButton dark" onclick="setTheme('dark')" title="Dark mode"><svg class="icons icons__background">
<use href="{{ get_url(path='icons.svg#darkMode', trailing_slash=false) | safe }}"></use>
</svg></button>
{% elif config.extra.default_mode and config.extra.default_mode == "light" %}
<button class="themeButton light" onclick="setTheme('light')" title="Light mode"><svg
class="icons icons__background">
<use href="{{ get_url(path='icons.svg#lightMode', trailing_slash=false) | safe }}"></use>
</svg></button>
<button class="themeButton dark" onclick="setTheme('dark')" title="Dark mode"><svg class="icons icons__background">
<use href="{{ get_url(path='icons.svg#darkMode', trailing_slash=false) | safe }}"></use>
</svg></button>
{% elif config.extra.default_mode and config.extra.default_mode == "dark" %}
<button class="themeButton dark" onclick="setTheme('dark')" title="Dark mode"><svg class="icons icons__background">
<use href="{{ get_url(path='icons.svg#darkMode', trailing_slash=false) | safe }}"></use>
</svg></button>
<button class="themeButton light" onclick="setTheme('light')" title="Light mode"><svg
class="icons icons__background">
<use href="{{ get_url(path='icons.svg#lightMode', trailing_slash=false) | safe }}"></use>
</svg></button>
{% endif %}
</div> </div>
</nav> </nav>
{% endif %} {% endif %}
<script> <script>
const setTheme = (theme) => { const setTheme = (theme) => {
document.documentElement.className = theme; document.documentElement.className = theme;
localStorage.setItem('theme', theme); localStorage.setItem('theme', theme);
} }
const getTheme = () => { const getTheme = () => {
const theme = localStorage.getItem('theme'); const theme = localStorage.getItem('theme');
theme && setTheme(theme); theme && setTheme(theme);
} }
getTheme() getTheme()
{% if config.extra.default_mode %}
setTheme("{{ config.extra.default_mode }}")
{% endif %}
</script> </script>