add rss support
This commit is contained in:
parent
1473588028
commit
93ff947e23
13 changed files with 711 additions and 36 deletions
|
|
@ -18,6 +18,7 @@ taxonomies = [
|
|||
]
|
||||
|
||||
generate_feed = true
|
||||
feed_filename = "rss.xml"
|
||||
|
||||
[markdown]
|
||||
# Whether to do syntax highlighting
|
||||
|
|
|
|||
|
|
@ -21,20 +21,20 @@ around the unixy msys environment, the latter it is.
|
|||
|
||||
Installing gtk3 is easy as it can be installed with *pacman*
|
||||
|
||||
``` example
|
||||
``` sh
|
||||
$ pacman -S mingw64/mingw-w64-x86_64-gtk3
|
||||
```
|
||||
|
||||
Add some support for integrating with c libraries and linking, etc...
|
||||
|
||||
``` example
|
||||
``` sh
|
||||
$ pacman -S mingw-w64-x86_64-toolchain base-devel
|
||||
```
|
||||
|
||||
Being optimistic I installed glade. Probably wont need it today but it
|
||||
is a good test to see if Gtk apps at least start.
|
||||
|
||||
``` example
|
||||
``` sh
|
||||
$ pacman -S mingw-w64-x86_64-glade
|
||||
```
|
||||
|
||||
|
|
@ -44,20 +44,20 @@ Glade starts and shows the GUI so the first milestone was reached.
|
|||
|
||||
First install the cross compilation target
|
||||
|
||||
``` example
|
||||
``` sh
|
||||
$ rustup target add x86_64-pc-windows-gnu
|
||||
```
|
||||
|
||||
I can now compile with
|
||||
|
||||
``` example
|
||||
``` sh
|
||||
$ PKG_CONFIG_ALLOW_CROSS=1 cargo build --target=x86_64-pc-windows-gnu
|
||||
```
|
||||
|
||||
To always enably this environment variable in the project folder I added
|
||||
a *.env* file with
|
||||
|
||||
``` example
|
||||
``` sh
|
||||
PKG_CONFIG_ALLOW_CROSS=1
|
||||
```
|
||||
|
||||
|
|
@ -65,7 +65,7 @@ which is picked up by the zsh dotenv plugin when I enter the folder.
|
|||
|
||||
Similarly we can change the default target for cargo with adding
|
||||
|
||||
``` example
|
||||
``` sh
|
||||
build]
|
||||
target = "x86_64-pc-windows-gnu"
|
||||
```
|
||||
|
|
@ -74,13 +74,13 @@ to \*.cargo/config.toml
|
|||
|
||||
We can now simply do
|
||||
|
||||
``` example
|
||||
``` sh
|
||||
$ rust build
|
||||
```
|
||||
|
||||
or
|
||||
|
||||
``` example
|
||||
``` sh
|
||||
$ rust run
|
||||
```
|
||||
|
||||
|
|
@ -96,7 +96,7 @@ for the language server to pick it up.
|
|||
The solution I settled on was to launch *vscode* from the command line
|
||||
in the project folder:
|
||||
|
||||
``` example
|
||||
``` sh
|
||||
$ code .
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ folder, etc...
|
|||
The method we really are interested in is
|
||||
[var](https://doc.rust-lang.org/std/env/fn.var.html).
|
||||
|
||||
``` example
|
||||
``` sh
|
||||
match env::var("MQTT_BROKER") {
|
||||
Ok(mqtt_broker) => mqtt_init(&mqtt_broker).await,
|
||||
Err(e) => error!("No broker specified in MQTT_BROKER environment variable.({})", e)
|
||||
|
|
@ -57,7 +57,7 @@ fit all my requirements, so that\'s fine.
|
|||
All we need to do is initialize it after reading the environment
|
||||
variables from the *.env* file :
|
||||
|
||||
``` example
|
||||
``` sh
|
||||
async fn main() {
|
||||
dotenv::dotenv().ok();
|
||||
env_logger::init();
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@ Waited a few days to confirm, and wrote it down before I forget.
|
|||
|
||||
Here is the relevant part:
|
||||
|
||||
``` example
|
||||
``` sh
|
||||
Control::Send {esc}
|
||||
Control & a::Send ^a
|
||||
Control & b::Send ^b
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ before.
|
|||
|
||||
That is easy, in an admin shell run :
|
||||
|
||||
``` example
|
||||
``` sh
|
||||
> choco install miktex
|
||||
```
|
||||
|
||||
|
|
@ -33,7 +33,7 @@ place for these
|
|||
|
||||
In the msys terminal :
|
||||
|
||||
``` example
|
||||
``` sh
|
||||
$ cd
|
||||
$ mkdir -p .local/texmf/tex/latex
|
||||
```
|
||||
|
|
@ -47,7 +47,7 @@ missing. Also this is consistent with the Mac and Linux versions.
|
|||
Just add the repos for the *.sty* and *.cls* files to the folder we just
|
||||
made:
|
||||
|
||||
``` example
|
||||
``` sh
|
||||
$ cd ~/.local/texmf/tex/latex
|
||||
$ git clone git@gitlab.xomeplace.com:latex/xomeplace-latex.git
|
||||
$ ... repeat for other templates ...
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@ the repos the name was a quick choice.
|
|||
|
||||
The structure is as follows:
|
||||
|
||||
``` text
|
||||
```
|
||||
<root> -+- blog -+- posts -+- <blog posts>
|
||||
| +- org-template -+- <templates>
|
||||
| +- css -+- <css files>
|
||||
|
|
@ -38,14 +38,14 @@ Prepare some snippets for the HTML pages
|
|||
|
||||
First off, a link to the CSS:
|
||||
|
||||
``` elisp
|
||||
``` lisp
|
||||
(setq website-html-head "<link rel=\"stylesheet\" href=\"css/site.css\"
|
||||
type=\"text/css\"/>")
|
||||
```
|
||||
|
||||
Let\'s also add a navigation menu at the top of each page:
|
||||
|
||||
``` elisp
|
||||
``` lisp
|
||||
(setq website-html-preamble
|
||||
"<div class=\"nav\">
|
||||
<ul>
|
||||
|
|
@ -57,7 +57,7 @@ Let\'s also add a navigation menu at the top of each page:
|
|||
|
||||
And a footer :
|
||||
|
||||
``` elisp
|
||||
``` lisp
|
||||
(setq website-html-postamble "<div class=\"footer\"> Copyright 2020 %a (%v
|
||||
HTML).<br> Last updated %C.<br> Built with %c. </div>")
|
||||
```
|
||||
|
|
@ -65,7 +65,7 @@ And a footer :
|
|||
And now we can all tie it together by creating the
|
||||
**org-publish-project-alist**:
|
||||
|
||||
``` elisp
|
||||
``` lisp
|
||||
(setq org-publish-project-alist
|
||||
`(("posts"
|
||||
|
||||
|
|
@ -145,7 +145,7 @@ serve: publish
|
|||
|
||||
For local testing just do:
|
||||
|
||||
``` shell
|
||||
``` sh
|
||||
$ make clean serve
|
||||
```
|
||||
|
||||
|
|
@ -218,7 +218,7 @@ The challenge was that the title is needed to create the slug for the
|
|||
filename and then again as title for the post. So my ugly solution is to
|
||||
stuff it in a variable and get the variable back in the template.
|
||||
|
||||
``` elisp
|
||||
``` lisp
|
||||
(with-eval-after-load 'org-capture
|
||||
(defvar snamellit/blog-title "test-title")
|
||||
|
||||
|
|
@ -246,7 +246,7 @@ stuff it in a variable and get the variable back in the template.
|
|||
|
||||
The **tpl-blog-post.org** template file :
|
||||
|
||||
``` org
|
||||
```
|
||||
#+title: %(progn snamellit/blog-title)
|
||||
#+date: %<%Y-%m-%d>
|
||||
|
||||
|
|
|
|||
|
|
@ -51,14 +51,14 @@ It uses 2 scripts:
|
|||
|
||||
A startup scrip to kickoff remapping after login
|
||||
|
||||
``` shell
|
||||
``` sh
|
||||
PowerShell -Command "Set-ExecutionPolicy -Scope CurrentUser Unrestricted" >> "%TEMP%\StartupLog.txt" 2>&1
|
||||
PowerShell -File "%SystemDrive%\Scripts\MapDrives.ps1" >> "%TEMP%\StartupLog.txt" 2>&1
|
||||
```
|
||||
|
||||
## %SystemDrive%`\Scripts`{=latex}`\MapDrives`{=latex}.ps1
|
||||
|
||||
``` shell
|
||||
``` sh
|
||||
$i=3
|
||||
while($True){
|
||||
$error.clear()
|
||||
|
|
|
|||
|
|
@ -29,14 +29,14 @@ when I not use it because Global Warming.
|
|||
|
||||
[Arch wiki page for xrdp](https://wiki.archlinux.org/index.php/xrdp)
|
||||
|
||||
``` shell
|
||||
``` sh
|
||||
$ yay -S xrdp xorgxrdp-git
|
||||
```
|
||||
|
||||
We do not have systemd in WSL2 so I started the daemons manually with a
|
||||
small script \*/usr/local/bin/start-xrdp:
|
||||
|
||||
``` shell
|
||||
``` sh
|
||||
#!/bin/bash
|
||||
sudo /usr/sbin/xrdp
|
||||
sudo /usr/sbin/xrdp-sesman
|
||||
|
|
@ -62,7 +62,7 @@ Note: Each time WSL2 restarts it gets a random ip address. So I created
|
|||
a small script to dig out the actual ip address out of the output of
|
||||
**ip address** :
|
||||
|
||||
``` shell
|
||||
``` sh
|
||||
#!/bin/bash
|
||||
ip address show dev eth0 | grep "inet " | sed -e 's/.*inet \([^/]*\).*/\1/'
|
||||
```
|
||||
|
|
@ -78,7 +78,7 @@ kind of GUI apps together. I do not know if it is directly used by Emacs
|
|||
or any of the extensions I use, however it reduces the amount of errors
|
||||
and warnings.
|
||||
|
||||
``` shell
|
||||
``` sh
|
||||
$ yay -S dbus-x11
|
||||
```
|
||||
|
||||
|
|
@ -93,7 +93,7 @@ we only need to start it as the only program in the XSession. This of
|
|||
course also means there is no chrome on the X-Window or the ability to
|
||||
lauch other programs outside of Emacs. This is exactly how I like it.
|
||||
|
||||
``` shell
|
||||
``` sh
|
||||
#file:~/.xinitrc
|
||||
emacs -mm
|
||||
```
|
||||
|
|
@ -110,13 +110,13 @@ I only intend to run emacs in the window however having something a bit
|
|||
more capable which works can help me debug the environment. (I have some
|
||||
font things to sort out too...)
|
||||
|
||||
``` shell
|
||||
``` sh
|
||||
$ sudo pacman -S xfce4
|
||||
```
|
||||
|
||||
and then start it form **\~/.xinitrc**
|
||||
|
||||
``` shell
|
||||
``` sh
|
||||
emacs &
|
||||
startxfce4
|
||||
```
|
||||
|
|
|
|||
|
|
@ -1,4 +1,9 @@
|
|||
---
|
||||
title: "Snamellit"
|
||||
---
|
||||
+++
|
||||
title = "Snamellit"
|
||||
description = "Blog Posts and other stuff I'll forget"
|
||||
sort_by = "date"
|
||||
paginate_by = 5
|
||||
paginate_reversed = false
|
||||
generate_feed = true
|
||||
+++
|
||||
# Welcome to Snamellit
|
||||
|
|
|
|||
172
templates/categories/single.html
Normal file
172
templates/categories/single.html
Normal file
|
|
@ -0,0 +1,172 @@
|
|||
{% extends "layout.html" %}
|
||||
|
||||
{% block rss %}
|
||||
{% set rss_path = "categories/" ~ term.name ~ "/rss.xml" %}
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="{{get_url(path=rss_path, trailing_slash=false)}}">
|
||||
{% endblock rss %}
|
||||
|
||||
{% block content %}
|
||||
<div class="flex items-center flex-col mt-10">
|
||||
<h1 class="text-2xl text-bold mb-6">
|
||||
Category : {{ term.name }}
|
||||
</h1>
|
||||
<div class="flex flex-col gap-y-6 w-full px-4 sm:w-2/3">
|
||||
{% if paginator %}
|
||||
{% set pages = paginator.pages %}
|
||||
{% else %}
|
||||
{% set pages = term.pages %}
|
||||
{% endif %}
|
||||
|
||||
{% for page in pages %}
|
||||
<div class="border border-2 border-gray-200 dark:border-black rounded-xl p-5 shadow-2xl transform transition duration-500 hover:scale-105 bg-gray-200 dark:bg-gray-800">
|
||||
<div class="flex flex-col py-2 justify-center">
|
||||
<h2 class="text-2xl text-bold"><a href='{{ page.permalink }}'>{{ page.title }}</a></h2>
|
||||
<p class="text-bold">{{ page.description }}</p>
|
||||
</div>
|
||||
|
||||
<!-- Read time and word count -->
|
||||
<div class="flex flex-wrap py-2">
|
||||
<div class="flex items-center w-1/3">
|
||||
<div class="flex space-x-3 text-gray-900 dark:text-gray-400">
|
||||
<span class="flex">
|
||||
<!-- Icon clock -->
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
|
||||
</svg>
|
||||
<span class="ml-1">{{ page.reading_time }} min</span>
|
||||
</span>
|
||||
<span class="flex">
|
||||
<!-- Icon pencil -->
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"></path>
|
||||
</svg>
|
||||
<span class="ml-1">{{ page.word_count }} words</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Author and publish date -->
|
||||
<div class="flex w-2/3 space-x-3 text-gray-900 dark:text-gray-400 justify-end">
|
||||
<span class="flex items-center">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"></path>
|
||||
</svg>
|
||||
<span class="ml-1"><time datetime="{{ page.date }}">Published on {{ page.date | date(format='%B %d, %Y') }}</time></span>
|
||||
</span>
|
||||
<span class="flex items-center">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"></path>
|
||||
</svg>
|
||||
{% if page.extra.author.name %}
|
||||
<span class="ml-1">{{ page.extra.author.name }}</span>
|
||||
{% if page.extra.author.avatar %}
|
||||
<img class="rounded-full h-9 w-9 ml-1" src="{{ page.extra.author.avatar }}"{% if page.extra.author.avatar_alt %} alt="{{ page.extra.author.avatar_alt }}"{% endif %}>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<span class="ml-1">{{ config.extra.default_author.name }}</span>
|
||||
<img class="rounded-full h-9 w-9 ml-1" src="{{ config.extra.default_author.avatar }}" alt="{{ config.extra.default_author.avatar_alt }}">
|
||||
{% endif %}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Summary -->
|
||||
<div class="text-bold mt-2">
|
||||
{{ page.summary | safe }}
|
||||
<a class="flex py-2" href='{{ page.permalink }}'>
|
||||
Read More
|
||||
<svg class="w-6 h-6 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14 5l7 7m0 0l-7 7m7-7H3"></path>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Categories and Tags -->
|
||||
<div class="flex flex-wrap py-2">
|
||||
<div class="w-2/3">
|
||||
{% if page.taxonomies.categories %}
|
||||
<p>
|
||||
Categories:
|
||||
{% for category in page.taxonomies.categories %}
|
||||
<a class="text-gray-900 dark:text-gray-400 flex py-1 items-center" href="{{ get_taxonomy_url(kind='categories', name=category) }}">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"></path>
|
||||
</svg>
|
||||
<span class="pl-1">{{category}}</span>
|
||||
</a>
|
||||
{% endfor %}
|
||||
</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="w-1/3">
|
||||
{% if page.taxonomies.tags %}
|
||||
<p>
|
||||
Tags:
|
||||
{% for tag in page.taxonomies.tags %}
|
||||
<a class="text-gray-900 dark:text-gray-400 flex py-1 items-center" href="{{ get_taxonomy_url(kind='tags', name=tag) }}">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 7h.01M7 3h5c.512 0 1.024.195 1.414.586l7 7a2 2 0 010 2.828l-7 7a2 2 0 01-2.828 0l-7-7A1.994 1.994 0 013 12V7a4 4 0 014-4z"></path>
|
||||
</svg>
|
||||
<span class="pl-1">{{tag}}</span>
|
||||
</a>
|
||||
{% endfor %}
|
||||
</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endblock content %}
|
||||
|
||||
{% block pagination %}
|
||||
{% if paginator.previous or paginator.next %}
|
||||
<div class="max-w-7xl px-2 sm:px-6 lg:px-8 mx-auto w-full">
|
||||
<div class="flex items-center justify-between">
|
||||
{% if not paginator.previous %}
|
||||
<!-- Disabled -->
|
||||
<span class="flex items-center border border-gray-400 dark:border-black rounded-lg px-3 py-4 bg-gray-400 text-gray-200">
|
||||
<svg class="w-7 h-7 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16l-4-4m0 0l4-4m-4 4h18"></path>
|
||||
</svg>
|
||||
Previous
|
||||
</span>
|
||||
{% else %}
|
||||
<!-- Active -->
|
||||
<a class="flex items-center border border-gray-400 dark:border-black rounded-lg text-gray-800 dark:text-gray-300 dark:bg-gray-800 hover:bg-gray-300 dark:hover:bg-gray-600 dark:hover:text-white px-3 py-4 rounded-md text-sm font-medium transform transition duration-500 hover:scale-105 bg-gray-200 dark:bg-gray-800" href="{{ paginator.previous }}" {% if not paginator.previous %}disabled{% endif %}>
|
||||
<svg class="w-7 h-7 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16l-4-4m0 0l4-4m-4 4h18"></path>
|
||||
</svg>
|
||||
Previous
|
||||
</a>
|
||||
{% endif %}
|
||||
<ul class="flex gap-x-2">
|
||||
{% for pager in range(start=1, end=paginator.number_pagers+1) %}
|
||||
<li class="">
|
||||
<a class="p-4 border border-gray-400 dark:border-black rounded-lg text-gray-800 dark:text-gray-300 hover:bg-gray-300 dark:hover:bg-gray-600 hover:text-white rounded-md text-sm font-medium transform transition duration-500 hover:scale-105 {% if paginator.current_index == pager %}bg-blue-500{% else %}bg-gray-200 dark:bg-gray-800{% endif %}" href="{{ paginator.base_url }}{{pager}}" aria-label="Page {{pager}}">
|
||||
{{pager}}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% if not paginator.next %}
|
||||
<!-- Disabled -->
|
||||
<span class="flex items-center border border-gray-400 dark:border-black rounded-lg px-3 py-4 bg-gray-400 text-gray-200">
|
||||
Next Page
|
||||
<svg class="w-7 h-7 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"></path>
|
||||
</svg>
|
||||
</span>
|
||||
{% else %}
|
||||
<!-- Active -->
|
||||
<a class="flex items-center border border-gray-400 dark:border-black rounded-lg text-gray-800 dark:text-gray-300 dark:bg-gray-800 hover:bg-gray-300 dark:hover:bg-gray-600 hover:text-white px-3 py-4 rounded-md text-sm font-medium transform transition duration-500 hover:scale-105 bg-gray-200 dark:bg-gray-800" href="{{ paginator.next }}">
|
||||
Next page
|
||||
<svg class="w-7 h-7 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"></path>
|
||||
</svg>
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
325
templates/layout.html
Normal file
325
templates/layout.html
Normal file
|
|
@ -0,0 +1,325 @@
|
|||
<!doctype html>
|
||||
<html lang="{{lang}}">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
|
||||
<!-- FAVICON -->
|
||||
{% if config.extra.favicon.webmanifest %}
|
||||
<link href="{{ config.extra.favicon.manifest }}"" rel="manifest" />
|
||||
{% endif %}
|
||||
{% if config.extra.favicon.favicon_16x16 %}
|
||||
<link href='{{ config.extra.favicon.favicon_16x16 }}' rel="icon" sizes="16x16" type="image/png" />
|
||||
{% endif %}
|
||||
{% if config.extra.favicon.favicon_32x32 %}
|
||||
<link href='{{ config.extra.favicon.favicon_32x32 }}' rel="icon" sizes="32x32" type="image/png" />
|
||||
{% endif %}
|
||||
{% if config.extra.favicon.android_chrome_512 %}
|
||||
<link href='{{ config.extra.favicon.android_chrome_512 }}' rel="android-chrome" sizes="512x512" />
|
||||
{% endif %}
|
||||
{% if config.extra.favicon.android_chrome_192 %}
|
||||
<link href='{{ config.extra.favicon.android_chrome_192 }}' rel="android-chrome" sizes="192x192" />
|
||||
{% endif %}
|
||||
{% if config.extra.favicon.apple_touch_icon %}
|
||||
<link href='{{ config.extra.favicon.apple_touch_icon }}' rel="apple-touch-icon" sizes="180x180" />
|
||||
{% endif %}
|
||||
{% if config.extra.favicon.apple_touch_icon %}
|
||||
<link href='{{ config.extra.favicon.apple_touch_icon }}' rel="apple-touch-icon" sizes="180x180" />
|
||||
{% endif %}
|
||||
|
||||
<link href="/css/main.css" rel="stylesheet">
|
||||
<link id="syntax_highlight" href="#" rel="stylesheet">
|
||||
{% block rss %}
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="{{ get_url(path="blog/rss.xml", trailing_slash=false) }}">
|
||||
{% endblock %}
|
||||
<title>
|
||||
{% block title %}
|
||||
{{ config.title }}
|
||||
{% endblock title %}
|
||||
</title>
|
||||
</head>
|
||||
<body class="dark:bg-gray-700 flex flex-col h-screen justify-between">
|
||||
<!---------------------------------------------------------->
|
||||
<!------------------------- NAVBAR ------------------------->
|
||||
<!---------------------------------------------------------->
|
||||
<nav id="navbar" class="bg-gray-200 dark:bg-gray-800">
|
||||
<div class="max-w-7xl mx-auto px-2 sm:px-6 lg:px-8">
|
||||
<div class="relative flex items-center justify-between h-16">
|
||||
<div class="flex items-center sm:hidden">
|
||||
<!-- Mobile menu button-->
|
||||
<button id="toggle-mobile-menu" type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white" aria-controls="mobile-menu" aria-expanded="false">
|
||||
<span class="sr-only">Open main menu</span>
|
||||
<!--
|
||||
Icon when menu is closed.
|
||||
Heroicon name: outline/menu
|
||||
Menu open: "hidden", Menu closed: "block"
|
||||
-->
|
||||
<svg class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
|
||||
</svg>
|
||||
<!--
|
||||
Icon when menu is open.
|
||||
Heroicon name: outline/x
|
||||
Menu open: "block", Menu closed: "hidden"
|
||||
-->
|
||||
<svg class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<div class="flex-1 flex items-center">
|
||||
<div class="flex-shrink-0 flex items-center ml-2">
|
||||
<a href="/" class="text-xl text-gray-800 dark:text-white">{{config.extra.navbar.title}}</a>
|
||||
<!-- <img class="block lg:hidden h-8 w-auto" src="https://tailwindui.com/img/logos/workflow-mark-indigo-500.svg" alt="Workflow">
|
||||
<img class="hidden lg:block h-8 w-auto" src="https://tailwindui.com/img/logos/workflow-logo-indigo-500-mark-white-text.svg" alt="Workflow"> -->
|
||||
</div>
|
||||
<div class="hidden sm:block sm:ml-6">
|
||||
<div class="nav-links flex space-x-4">
|
||||
<!-- Current: "bg-gray-900 text-white", Default: "text-gray-300 hover:bg-gray-700 hover:text-white" -->
|
||||
{% for item in config.extra.navbar.items %}
|
||||
{% if lang == item.lang %}
|
||||
{% for link in item.links %}
|
||||
<a href="{{ link.url }}" class="text-gray-800 dark:text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">{{ link.name }}</a>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% if config.extra.enable_sidebar %}
|
||||
<!-- More ... Button (sidebar) -->
|
||||
<button id="toggle-sidebar">
|
||||
<svg class="w-7 h-7 text-gray-800 dark:text-gray-300" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 12h.01M12 12h.01M19 12h.01M6 12a1 1 0 11-2 0 1 1 0 012 0zm7 0a1 1 0 11-2 0 1 1 0 012 0zm7 0a1 1 0 11-2 0 1 1 0 012 0z"></path>
|
||||
</svg>
|
||||
</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% if config.extra.enable_search %}
|
||||
<!-- Search input in navbar -->
|
||||
<div class="flex ml-auto relative items-center sm:mr-4">
|
||||
<input id="search" class="rounded-xl border border-black dark:border-gray-200 h-9 text-black dark:text-gray-200 dark:bg-gray-700 w-24 sm:w-full" type="text">
|
||||
<svg class="w-6 h-6 absolute left-2 text-black dark:text-gray-200" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path>
|
||||
</svg>
|
||||
<span class="absolute right-2 hidden sm:block text-gray-400 text-sm leading-5 py-0.5 px-1.5 border border-gray-300 rounded-md">
|
||||
<kbd class="font-sans">
|
||||
<abbr title="Command" class="no-underline">⌘</abbr>
|
||||
</kbd>
|
||||
<kbd class="font-sans">K</kbd>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!---------------------------- Search box modal ---------------------------->
|
||||
<!-- inspired by https://www.tailwindtoolbox.com/components/modal -->
|
||||
<div id="search-modal" class="modal opacity-0 pointer-events-none fixed w-full h-full top-0 left-0 flex z-10">
|
||||
<div class="modal-overlay absolute w-full h-full bg-gray-900 opacity-50"></div>
|
||||
|
||||
<div class="modal-container text-gray-800 bg-gray-200 dark:bg-gray-800 dark:text-gray-400 w-11/12 md:max-w-md mx-auto rounded-lg shadow-lg z-50 mt-40 sm:mt-32 h-36 border border-2 border-gray-800 dark:border-gray-400">
|
||||
|
||||
<div class="modal-close absolute top-0 right-0 cursor-pointer flex flex-col items-center mt-4 mr-4 text-white text-sm z-50">
|
||||
<svg class="fill-current text-white" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
|
||||
<path d="M14.53 4.53l-1.06-1.06L9 7.94 4.53 3.47 3.47 4.53 7.94 9l-4.47 4.47 1.06 1.06L9 10.06l4.47 4.47 1.06-1.06L10.06 9z"></path>
|
||||
</svg>
|
||||
<span class="text-sm">(Esc)</span>
|
||||
</div>
|
||||
|
||||
<!-- Modal Content-->
|
||||
<div class="py-4 text-left px-6 flex flex-col">
|
||||
<!-- Modal Title -->
|
||||
<div class="flex justify-between items-center pb-3">
|
||||
<p class="text-2xl font-bold">Search</p>
|
||||
<div class="modal-close cursor-pointer z-50">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal Body -->
|
||||
<input id="search-input" class="rounded-xl border border-black h-12 text-bold text-2xl pl-2 text-black dark:text-gray-200 bg-gray-700" type="text">
|
||||
<!-- Search results -->
|
||||
<div id="search-results">
|
||||
<ul id="results-list" class="flex flex-col justify-center max-h-2xl mt-2 overflow-scroll"></ul>
|
||||
<!--Footer-->
|
||||
<!-- <div class="flex justify-end pt-2">
|
||||
<button class="px-4 bg-transparent p-3 rounded-lg text-indigo-500 hover:bg-gray-100 hover:text-indigo-400 mr-2">Action</button>
|
||||
<button class="modal-close px-4 bg-indigo-500 p-3 rounded-lg text-white hover:bg-indigo-400">Close</button>
|
||||
</div> -->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<!---------------------------- Sidebar Menu ---------------------------->
|
||||
{% if config.extra.enable_sidebar %}
|
||||
<div id="sidebar" class="nav-links -translate-x-full flex flex-col pt-6 p-2 text-2xl text-black dark:text-gray-200 bg-gray-200 dark:bg-gray-900 transform top-0 left-0 w-64 bg-white fixed h-full overflow-auto ease-in-out transition-all duration-300 z-30 shadow-2xl">
|
||||
{% for item in config.extra.sidebar.items %}
|
||||
{% if lang == item.lang %}
|
||||
{% for link in item.links %}
|
||||
<a href="{{ link.url }}" class="text-gray-800 dark:text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">{{ link.name }}</a>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if config.extra.enable_multilingue %}
|
||||
<!-- Language change button -->
|
||||
<div class="flex p-2 ml-4 relative">
|
||||
<button id="switch-lang" type="button" class="bg-gray-200 text-gray-800 hover:text-gray-900 dark:bg-gray-800 dark:text-gray-400 dark:hover:text-white p-1 rounded-full focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-800 focus:ring-white">
|
||||
<svg class="w-6 h-6 bg-gray-200 text-gray-800 hover:text-gray-900 dark:bg-gray-800 dark:text-gray-400 dark:hover:text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<div id="switch-lang-panel" class="hidden absolute top-12 -left-1/2 z-10 p-4 rounded-lg divide-y bg-gray-300 dark:bg-gray-800 text-gray-800 dark:text-gray-400 flex flex-col w-28 ">
|
||||
<span class="sr-only">Switch Lang</span>
|
||||
{% for item in config.extra.lang.items %}
|
||||
{% if lang == item.lang %}
|
||||
{% for link in item.links %}
|
||||
<a class="flex justify-center py-2 hover:text-gray-800 dark:hover:text-white" href="{{ link.base_url }}">{{ link.name }}</a>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
<!-- Theme switch button -->
|
||||
<div class="flex p-2">
|
||||
<button id="switch-theme" type="button" class="bg-gray-200 text-gray-800 hover:text-gray-900 dark:bg-gray-800 dark:text-gray-400 dark:hover:text-white p-1 rounded-full focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-800 focus:ring-white">
|
||||
<span class="sr-only">Switch Theme</span>
|
||||
<!-- Heroicon name: outline/light -->
|
||||
<svg id="light" class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"></path>
|
||||
</svg>
|
||||
<!-- Heroicon name: outline/dark -->
|
||||
<svg id="dark" class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z"></path>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<!-- Profile dropdown -->
|
||||
<!-- <div class="ml-3 relative">
|
||||
<div>
|
||||
<button type="button" class="bg-gray-800 flex text-sm rounded-full focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-800 focus:ring-white" id="user-menu-button" aria-expanded="false" aria-haspopup="true">
|
||||
<span class="sr-only">Open user menu</span>
|
||||
<img class="h-8 w-8 rounded-full" src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="">
|
||||
</button>
|
||||
</div> -->
|
||||
|
||||
<!--
|
||||
Dropdown menu, show/hide based on menu state.
|
||||
|
||||
Entering: "transition ease-out duration-100"
|
||||
From: "transform opacity-0 scale-95"
|
||||
To: "transform opacity-100 scale-100"
|
||||
Leaving: "transition ease-in duration-75"
|
||||
From: "transform opacity-100 scale-100"
|
||||
To: "transform opacity-0 scale-95"
|
||||
-->
|
||||
<!-- Active: "bg-gray-100", Not Active: "" -->
|
||||
<!-- <div class="origin-top-right absolute right-0 mt-2 w-48 rounded-md shadow-lg py-1 bg-white ring-1 ring-black ring-opacity-5 focus:outline-none" role="menu" aria-orientation="vertical" aria-labelledby="user-menu-button" tabindex="-1">
|
||||
<a href="#" class="block px-4 py-2 text-sm text-gray-700" role="menuitem" tabindex="-1" id="user-menu-item-0">Your Profile</a>
|
||||
<a href="#" class="block px-4 py-2 text-sm text-gray-700" role="menuitem" tabindex="-1" id="user-menu-item-1">Settings</a>
|
||||
<a href="#" class="block px-4 py-2 text-sm text-gray-700" role="menuitem" tabindex="-1" id="user-menu-item-2">Sign out</a>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!----------------------------- Mobile menu ----------------------------->
|
||||
<div id="mobile-menu" class="sm:hidden fixed z-10 overflow-hidden">
|
||||
<div class="nav-links flex flex-col space-y-4 items-center w-screen dark:bg-gray-800 transition-all ease-out duration-500 h-0">
|
||||
<!-- Current: "bg-gray-900 text-white", Default: "text-gray-300 hover:bg-gray-700 hover:text-white" -->
|
||||
{% for item in config.extra.navbar.items %}
|
||||
{% if lang == item.lang %}
|
||||
{% for link in item.links %}
|
||||
<a href="{{ link.url }}" class="text-gray-800 dark:text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">{{ link.name }}</a>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% if config.extra.enable_sidebar %}
|
||||
{% for item in config.extra.sidebar.items %}
|
||||
{% if lang == item.lang %}
|
||||
{% for link in item.links %}
|
||||
<a href="{{ link.url }}" class="text-gray-800 dark:text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">{{ link.name }}</a>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<!----------------------------------------------------------->
|
||||
<!------------------------- CONTENT ------------------------->
|
||||
<!----------------------------------------------------------->
|
||||
<main class="max-w-7xl mx-auto text-black dark:text-gray-200 w-full mb-auto">
|
||||
{% block content %}
|
||||
{% endblock content %}
|
||||
</main>
|
||||
|
||||
<!----------------------------------------------------------->
|
||||
<!------------------------- PAGINATION ---------------------->
|
||||
<!----------------------------------------------------------->
|
||||
{% block pagination %}
|
||||
{% endblock%}
|
||||
|
||||
<!---------------------------------------------------------->
|
||||
<!------------------------- FOOTER ------------------------->
|
||||
<!---------------------------------------------------------->
|
||||
<footer class="max-w-7xl mx-auto relative pt-1 px-2 border-b-2 border-gray-300 dark:border-gray-200 w-full">
|
||||
<!-- <div class="container mx-auto px-6">
|
||||
<div class="sm:flex sm:mt-8">
|
||||
<div class="mt-8 sm:mt-0 sm:w-full sm:px-8 flex flex-col md:flex-row justify-between">
|
||||
<div class="flex flex-col">
|
||||
<span class="font-bold text-gray-700 uppercase mb-2">Footer header 1</span>
|
||||
<span class="my-2"><a href="#" class="text-blue-700 text-md hover:text-blue-500">link 1</a></span>
|
||||
<span class="my-2"><a href="#" class="text-blue-700 text-md hover:text-blue-500">link 1</a></span>
|
||||
<span class="my-2"><a href="#" class="text-blue-700 text-md hover:text-blue-500">link 1</a></span>
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<span class="font-bold text-gray-700 uppercase mt-4 md:mt-0 mb-2">Footer header 2</span>
|
||||
<span class="my-2"><a href="#" class="text-blue-700 text-md hover:text-blue-500">link 1</a></span>
|
||||
<span class="my-2"><a href="#" class="text-blue-700 text-md hover:text-blue-500">link 1</a></span>
|
||||
<span class="my-2"><a href="#" class="text-blue-700 text-md hover:text-blue-500">link 1</a></span>
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<span class="font-bold text-gray-700 uppercase mt-4 md:mt-0 mb-2">Footer header 3</span>
|
||||
<span class="my-2"><a href="#" class="text-blue-700 text-md hover:text-blue-500">link 1</a></span>
|
||||
<span class="my-2"><a href="#" class="text-blue-700 text-md hover:text-blue-500">link 1</a></span>
|
||||
<span class="my-2"><a href="#" class="text-blue-700 text-md hover:text-blue-500">link 1</a></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="mt-16 border-t-2 border-gray-300 flex flex-col items-center">
|
||||
<div class="sm:w-2/3 text-center py-6">
|
||||
<p class="text-sm text-black dark:text-white font-bold mb-2">
|
||||
© 2023 <a href="https://www.getzola.org/themes/blow/">blow</a> theme made with <a href="https://tailwindcss.com/" target="_blank">tailwindcss</a> for <a href="https://www.getzola.org/" target="_blank">Zola</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!------------------------- SCRIPTS ------------------------->
|
||||
<script defer src="/js/main.js"></script>
|
||||
{% if config.extra.enable_search %}
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/elasticlunr/0.9.6/elasticlunr.min.js"></script>
|
||||
<script src="/search_index.{{lang}}.js"></script>
|
||||
<script defer src="/js/search.js"></script>
|
||||
{% endif %}
|
||||
{% if config.extra.enable_multilingue %}
|
||||
<script defer src="/js/lang.js"></script>
|
||||
{% endif %}
|
||||
{% if config.extra.enable_adsense %}
|
||||
<script async src="{{ config.extra.adsense_link | safe }}"
|
||||
crossorigin="anonymous"></script>
|
||||
{% endif %}
|
||||
{% block extra_js %}
|
||||
{% endblock extra_js %}
|
||||
</body>
|
||||
</html>
|
||||
172
templates/tags/single.html
Normal file
172
templates/tags/single.html
Normal file
|
|
@ -0,0 +1,172 @@
|
|||
{% extends "layout.html" %}
|
||||
|
||||
{% block rss %}
|
||||
{% set rss_path = "tags/" ~ term.name ~ "/rss.xml" %}
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="{{get_url(path=rss_path, trailing_slash=false) }}">
|
||||
{% endblock rss %}
|
||||
|
||||
{% block content %}
|
||||
<div class="flex items-center flex-col mt-10">
|
||||
<h1 class="text-2xl text-bold mb-6">
|
||||
Tag : {{ term.name }}
|
||||
</h1>
|
||||
<div class="flex flex-col gap-y-6 w-full px-4 sm:w-2/3">
|
||||
{% if paginator %}
|
||||
{% set pages = paginator.pages %}
|
||||
{% else %}
|
||||
{% set pages = term.pages %}
|
||||
{% endif %}
|
||||
|
||||
{% for page in pages %}
|
||||
<div class="border border-2 border-gray-200 dark:border-black rounded-xl p-5 shadow-2xl transform transition duration-500 hover:scale-105 bg-gray-200 dark:bg-gray-800">
|
||||
<div class="flex flex-col py-2 justify-center">
|
||||
<h2 class="text-2xl text-bold"><a href='{{ page.permalink }}'>{{ page.title }}</a></h2>
|
||||
<p class="text-bold">{{ page.description }}</p>
|
||||
</div>
|
||||
|
||||
<!-- Read time and word count -->
|
||||
<div class="flex flex-wrap py-2">
|
||||
<div class="flex items-center w-1/3">
|
||||
<div class="flex space-x-3 text-gray-900 dark:text-gray-400">
|
||||
<span class="flex">
|
||||
<!-- Icon clock -->
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
|
||||
</svg>
|
||||
<span class="ml-1">{{ page.reading_time }} min</span>
|
||||
</span>
|
||||
<span class="flex">
|
||||
<!-- Icon pencil -->
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"></path>
|
||||
</svg>
|
||||
<span class="ml-1">{{ page.word_count }} words</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Author and publish date -->
|
||||
<div class="flex w-2/3 space-x-3 text-gray-900 dark:text-gray-400 justify-end">
|
||||
<span class="flex items-center">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"></path>
|
||||
</svg>
|
||||
<span class="ml-1"><time datetime="{{ page.date }}">Published on {{ page.date | date(format='%B %d, %Y') }}</time></span>
|
||||
</span>
|
||||
<span class="flex items-center">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"></path>
|
||||
</svg>
|
||||
{% if page.extra.author.name %}
|
||||
<span class="ml-1">{{ page.extra.author.name }}</span>
|
||||
{% if page.extra.author.avatar %}
|
||||
<img class="rounded-full h-9 w-9 ml-1" src="{{ page.extra.author.avatar }}"{% if page.extra.author.avatar_alt %} alt="{{ page.extra.author.avatar_alt }}"{% endif %}>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<span class="ml-1">{{ config.extra.default_author.name }}</span>
|
||||
<img class="rounded-full h-9 w-9 ml-1" src="{{ config.extra.default_author.avatar }}" alt="{{ config.extra.default_author.avatar_alt }}">
|
||||
{% endif %}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Summary -->
|
||||
<div class="text-bold mt-2">
|
||||
{{ page.summary | safe }}
|
||||
<a class="flex py-2" href='{{ page.permalink }}'>
|
||||
Read More
|
||||
<svg class="w-6 h-6 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14 5l7 7m0 0l-7 7m7-7H3"></path>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Categories and Tags -->
|
||||
<div class="flex flex-wrap py-2">
|
||||
<div class="w-2/3">
|
||||
{% if page.taxonomies.categories %}
|
||||
<p>
|
||||
Categories:
|
||||
{% for category in page.taxonomies.categories %}
|
||||
<a class="text-gray-900 dark:text-gray-400 flex py-1 items-center" href="{{ get_taxonomy_url(kind='categories', name=category) }}">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"></path>
|
||||
</svg>
|
||||
<span class="pl-1">{{category}}</span>
|
||||
</a>
|
||||
{% endfor %}
|
||||
</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="w-1/3">
|
||||
{% if page.taxonomies.tags %}
|
||||
<p>
|
||||
Tags:
|
||||
{% for tag in page.taxonomies.tags %}
|
||||
<a class="text-gray-900 dark:text-gray-400 flex py-1 items-center" href="{{ get_taxonomy_url(kind='tags', name=tag) }}">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 7h.01M7 3h5c.512 0 1.024.195 1.414.586l7 7a2 2 0 010 2.828l-7 7a2 2 0 01-2.828 0l-7-7A1.994 1.994 0 013 12V7a4 4 0 014-4z"></path>
|
||||
</svg>
|
||||
<span class="pl-1">{{tag}}</span>
|
||||
</a>
|
||||
{% endfor %}
|
||||
</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endblock content %}
|
||||
|
||||
{% block pagination %}
|
||||
{% if paginator.previous or paginator.next %}
|
||||
<div class="max-w-7xl px-2 sm:px-6 lg:px-8 mx-auto w-full">
|
||||
<div class="flex items-center justify-between">
|
||||
{% if not paginator.previous %}
|
||||
<!-- Disabled -->
|
||||
<span class="flex items-center border border-gray-400 dark:border-black rounded-lg px-3 py-4 bg-gray-400 text-gray-200">
|
||||
<svg class="w-7 h-7 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16l-4-4m0 0l4-4m-4 4h18"></path>
|
||||
</svg>
|
||||
Previous
|
||||
</span>
|
||||
{% else %}
|
||||
<!-- Active -->
|
||||
<a class="flex items-center border border-gray-400 dark:border-black rounded-lg text-gray-800 dark:text-gray-300 dark:bg-gray-800 hover:bg-gray-300 dark:hover:bg-gray-600 dark:hover:text-white px-3 py-4 rounded-md text-sm font-medium transform transition duration-500 hover:scale-105 bg-gray-200 dark:bg-gray-800" href="{{ paginator.previous }}" {% if not paginator.previous %}disabled{% endif %}>
|
||||
<svg class="w-7 h-7 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16l-4-4m0 0l4-4m-4 4h18"></path>
|
||||
</svg>
|
||||
Previous
|
||||
</a>
|
||||
{% endif %}
|
||||
<ul class="flex gap-x-2">
|
||||
{% for pager in range(start=1, end=paginator.number_pagers+1) %}
|
||||
<li class="">
|
||||
<a class="p-4 border border-gray-400 dark:border-black rounded-lg text-gray-800 dark:text-gray-300 hover:bg-gray-300 dark:hover:bg-gray-600 hover:text-white rounded-md text-sm font-medium transform transition duration-500 hover:scale-105 {% if paginator.current_index == pager %}bg-blue-500{% else %}bg-gray-200 dark:bg-gray-800{% endif %}" href="{{ paginator.base_url }}{{pager}}" aria-label="Page {{pager}}">
|
||||
{{pager}}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% if not paginator.next %}
|
||||
<!-- Disabled -->
|
||||
<span class="flex items-center border border-gray-400 dark:border-black rounded-lg px-3 py-4 bg-gray-400 text-gray-200">
|
||||
Next Page
|
||||
<svg class="w-7 h-7 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"></path>
|
||||
</svg>
|
||||
</span>
|
||||
{% else %}
|
||||
<!-- Active -->
|
||||
<a class="flex items-center border border-gray-400 dark:border-black rounded-lg text-gray-800 dark:text-gray-300 dark:bg-gray-800 hover:bg-gray-300 dark:hover:bg-gray-600 hover:text-white px-3 py-4 rounded-md text-sm font-medium transform transition duration-500 hover:scale-105 bg-gray-200 dark:bg-gray-800" href="{{ paginator.next }}">
|
||||
Next page
|
||||
<svg class="w-7 h-7 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"></path>
|
||||
</svg>
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
Loading…
Reference in a new issue