faercol/hugo-relie
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Add support for mermaid graphs

Browse source
This commit is contained in:
Melora Hugues 2023-10-01 13:39:28 +02:00
parent df3b911030
commit 07c8a13e2c
4 changed files with 193 additions and 142 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
static/mermaid.css Normal file
View file

@ -0,0 +1,26 @@
.mermaid {
.nodeLabel {
color: #A9A9B3 !important;
}
.edgePaths path {
stroke: #A9A9B3 !important;
}
.marker path {
stroke: #cad3f5;
fill: #A9A9B3;
}
.cluster rect {
fill: #1B1C1D !important;
stroke: #1F202E !important;
}
.node rect {
fill: #131415 !important;
stroke: #1F202E !important;
}
}

4
themes/hello-friend-ng/layouts/_default/_markup/render-codeblock-mermaid.html Normal file
View file

@ -0,0 +1,4 @@
<pre class="mermaid">
{{- .Inner | safeHTML }}
</pre>
{{ .Page.Store.Set "hasMermaid" true }}

16
themes/hello-friend-ng/layouts/_default/baseof.html
View file

@ -1,11 +1,14 @@
<!DOCTYPE html>
<html lang="{{ .Site.Language }}">
<head>
{{ partial "head.html" . }}
</head>
{{ block "body" . }}
<body>
<head>
{{ partial "head.html" . }}
<link rel="stylesheet" href="/mermaid.css">
</head>
{{ block "body" . }}
<body>
{{ end }}
<div class="container">
@ -21,5 +24,6 @@
</div>
{{ partial "javascript.html" . }}
</body>
</body>
</html>

33
themes/hello-friend-ng/layouts/posts/single.html
View file

@ -1,9 +1,11 @@
{{ define "main" }}
<main class="post">
<main class="post">
<div class="post-info">
<p>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-clock">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="feather feather-clock">
<circle cx="12" cy="12" r="10"></circle>
<polyline points="12 6 12 12 16 14"></polyline>
</svg>
@ -55,6 +57,13 @@
<div class="post-content">
{{ .Content }}
{{ if .Page.Store.Get "hasMermaid" }}
<script type="module">
import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.esm.min.mjs';
mermaid.initialize({ startOnLoad: true });
</script>
{{ end }}
</div>
</article>
@ -65,7 +74,9 @@
{{ partial "categories.html" . }}
<p>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-file-text">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="feather feather-file-text">
<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path>
<polyline points="14 2 14 8 20 8"></polyline>
<line x1="16" y1="13" x2="8" y2="13"></line>
@ -76,7 +87,9 @@
</p>
<p>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-calendar">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="feather feather-calendar">
<rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect>
<line x1="16" y1="2" x2="16" y2="6"></line>
<line x1="8" y1="2" x2="8" y2="6"></line>
@ -101,14 +114,18 @@
{{- if .GitInfo }}
<p>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-git-commit">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="feather feather-git-commit">
<circle cx="12" cy="12" r="4"></circle>
<line x1="1.05" y1="12" x2="7" y2="12"></line>
<line x1="17.01" y1="12" x2="22.96" y2="12"></line>
</svg>
<a href="{{ .Site.Params.gitUrl -}}{{ .GitInfo.Hash }}" target="_blank" rel="noopener">{{ .GitInfo.AbbreviatedHash }}</a>
@ {{ if .Site.Params.dateformNum }}{{ dateFormat .Site.Params.dateformNum .GitInfo.AuthorDate.Local }}{{ else }}{{ dateFormat "2006-01-02" .GitInfo.AuthorDate.Local }}{{ end }}
<a href="{{ .Site.Params.gitUrl -}}{{ .GitInfo.Hash }}" target="_blank" rel="noopener">{{ .GitInfo.AbbreviatedHash
}}</a>
@ {{ if .Site.Params.dateformNum }}{{ dateFormat .Site.Params.dateformNum .GitInfo.AuthorDate.Local }}{{ else }}{{
dateFormat "2006-01-02" .GitInfo.AuthorDate.Local }}{{ end }}
</p>
{{- end }}
</div>
@ -135,5 +152,5 @@
<div id="commento"></div>
{{ end }}
</main>
</main>
{{ end }}