forked from gohugoio/hugo
-
Notifications
You must be signed in to change notification settings - Fork 6
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Add render hooks for codeblocks + Goat and Mermaid diagrams
Updates gohugoio#7765 Closes gohugoio#9538 Fixes gohugoio#9553
- Loading branch information
Showing
71 changed files
with
1,802 additions
and
1,996 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,199 @@ | ||
--- | ||
title: Diagrams | ||
date: 2022-02-20 | ||
categories: [content management] | ||
keywords: [diagrams,drawing] | ||
menu: | ||
docs: | ||
parent: "content-management" | ||
weight: 22 | ||
weight: 22 | ||
toc: true | ||
--- | ||
|
||
|
||
## Goat Ascii Diagram Examples | ||
|
||
### Graphics | ||
|
||
```goat | ||
. | ||
0 3 P * Eye / ^ / | ||
*-------* +y \ +) \ / Reflection | ||
1 /| 2 /| ^ \ \ \ v | ||
*-------* | | v0 \ v3 --------*-------- | ||
| |4 | |7 | *----\-----* | ||
| *-----|-* +-----> +x / v X \ .-.<-------- o | ||
|/ |/ / / o \ | / | Refraction / \ | ||
*-------* v / \ +-' / \ | ||
5 6 +z v1 *------------------* v2 | o-----o | ||
v | ||
``` | ||
|
||
### Complex | ||
|
||
```goat | ||
+-------------------+ ^ .---. | ||
| A Box |__.--.__ __.--> | .-. | | | ||
| | '--' v | * |<--- | | | ||
+-------------------+ '-' | | | ||
Round *---(-. | | ||
.-----------------. .-------. .----------. .-------. | | | | ||
| Mixed Rounded | | | / Diagonals \ | | | | | | | ||
| & Square Corners | '--. .--' / \ |---+---| '-)-' .--------. | ||
'--+------------+-' .--. | '-------+--------' | | | | / Search / | ||
| | | | '---. | '-------' | '-+------' | ||
|<---------->| | | | v Interior | ^ | ||
' <---' '----' .-----------. ---. .--- v | | ||
.------------------. Diag line | .-------. +---. \ / . | | ||
| if (a > b) +---. .--->| | | | | Curved line \ / / \ | | ||
| obj->fcn() | \ / | '-------' |<--' + / \ | | ||
'------------------' '--' '--+--------' .--. .--. | .-. +Done?+-' | ||
.---+-----. | ^ |\ | | /| .--+ | | \ / | ||
| | | Join \|/ | | Curved | \| |/ | | \ | \ / | ||
| | +----> o --o-- '-' Vertical '--' '--' '-- '--' + .---. | ||
<--+---+-----' | /|\ | | 3 | | ||
v not:line 'quotes' .-' '---' | ||
.-. .---+--------. / A || B *bold* | ^ | ||
| | | Not a dot | <---+---<-- A dash--is not a line v | | ||
'-' '---------+--' / Nor/is this. --- | ||
``` | ||
|
||
### Process | ||
|
||
```goat | ||
. | ||
.---------. / \ | ||
| START | / \ .-+-------+-. ___________ | ||
'----+----' .-------. A / \ B | |COMPLEX| | / \ .-. | ||
| | END |<-----+CHOICE +----->| | | +--->+ PREPARATION +--->| X | | ||
v '-------' \ / | |PROCESS| | \___________/ '-' | ||
.---------. \ / '-+---+---+-' | ||
/ INPUT / \ / | ||
'-----+---' ' | ||
| ^ | ||
v | | ||
.-----------. .-----+-----. .-. | ||
| PROCESS +---------------->| PROCESS |<------+ X | | ||
'-----------' '-----------' '-' | ||
``` | ||
|
||
### File tree | ||
|
||
Created from https://arthursonzogni.com/Diagon/#Tree | ||
|
||
```goat { width=300 color="orange" } | ||
───Linux─┬─Android | ||
├─Debian─┬─Ubuntu─┬─Lubuntu | ||
│ │ ├─Kubuntu | ||
│ │ ├─Xubuntu | ||
│ │ └─Xubuntu | ||
│ └─Mint | ||
├─Centos | ||
└─Fedora | ||
``` | ||
|
||
|
||
### Sequence Diagram | ||
|
||
https://arthursonzogni.com/Diagon/#Sequence | ||
|
||
```goat { class="w-40" } | ||
┌─────┐ ┌───┐ | ||
│Alice│ │Bob│ | ||
└──┬──┘ └─┬─┘ | ||
│ │ | ||
│ Hello Bob! │ | ||
│───────────>│ | ||
│ │ | ||
│Hello Alice!│ | ||
│<───────────│ | ||
┌──┴──┐ ┌─┴─┐ | ||
│Alice│ │Bob│ | ||
└─────┘ └───┘ | ||
``` | ||
|
||
|
||
### Flowchart | ||
|
||
https://arthursonzogni.com/Diagon/#Flowchart | ||
|
||
```goat | ||
_________________ | ||
╱ ╲ ┌─────┐ | ||
╱ DO YOU UNDERSTAND ╲____________________________________________________│GOOD!│ | ||
╲ FLOW CHARTS? ╱yes └──┬──┘ | ||
╲_________________╱ │ | ||
│no │ | ||
_________▽_________ ______________________ │ | ||
╱ ╲ ╱ ╲ ┌────┐ │ | ||
╱ OKAY, YOU SEE THE ╲________________╱ ... AND YOU CAN SEE ╲___│GOOD│ │ | ||
╲ LINE LABELED 'YES'? ╱yes ╲ THE ONES LABELED 'NO'? ╱yes└──┬─┘ │ | ||
╲___________________╱ ╲______________________╱ │ │ | ||
│no │no │ │ | ||
________▽_________ _________▽__________ │ │ | ||
╱ ╲ ┌───────────┐ ╱ ╲ │ │ | ||
╱ BUT YOU SEE THE ╲___│WAIT, WHAT?│ ╱ BUT YOU JUST ╲___ │ │ | ||
╲ ONES LABELED 'NO'? ╱yes└───────────┘ ╲ FOLLOWED THEM TWICE? ╱yes│ │ │ | ||
╲__________________╱ ╲____________________╱ │ │ │ | ||
│no │no │ │ │ | ||
┌───▽───┐ │ │ │ │ | ||
│LISTEN.│ └───────┬───────┘ │ │ | ||
└───┬───┘ ┌──────▽─────┐ │ │ | ||
┌─────▽────┐ │(THAT WASN'T│ │ │ | ||
│I HATE YOU│ │A QUESTION) │ │ │ | ||
└──────────┘ └──────┬─────┘ │ │ | ||
┌────▽───┐ │ │ | ||
│SCREW IT│ │ │ | ||
└────┬───┘ │ │ | ||
└─────┬─────┘ │ | ||
│ │ | ||
└─────┬─────┘ | ||
┌───────▽──────┐ | ||
│LET'S GO DRING│ | ||
└───────┬──────┘ | ||
┌─────────▽─────────┐ | ||
│HEY, I SHOULD TRY │ | ||
│INSTALLING FREEBSD!│ | ||
└───────────────────┘ | ||
``` | ||
|
||
|
||
### Table | ||
|
||
https://arthursonzogni.com/Diagon/#Table | ||
|
||
```goat { class="w-80 dark-blue" } | ||
┌────────────────────────────────────────────────┐ | ||
│ │ | ||
├────────────────────────────────────────────────┤ | ||
│SYNTAX = { PRODUCTION } . │ | ||
├────────────────────────────────────────────────┤ | ||
│PRODUCTION = IDENTIFIER "=" EXPRESSION "." . │ | ||
├────────────────────────────────────────────────┤ | ||
│EXPRESSION = TERM { "|" TERM } . │ | ||
├────────────────────────────────────────────────┤ | ||
│TERM = FACTOR { FACTOR } . │ | ||
├────────────────────────────────────────────────┤ | ||
│FACTOR = IDENTIFIER │ | ||
├────────────────────────────────────────────────┤ | ||
│ | LITERAL │ | ||
├────────────────────────────────────────────────┤ | ||
│ | "[" EXPRESSION "]" │ | ||
├────────────────────────────────────────────────┤ | ||
│ | "(" EXPRESSION ")" │ | ||
├────────────────────────────────────────────────┤ | ||
│ | "{" EXPRESSION "}" . │ | ||
├────────────────────────────────────────────────┤ | ||
│IDENTIFIER = letter { letter } . │ | ||
├────────────────────────────────────────────────┤ | ||
│LITERAL = """" character { character } """" .│ | ||
└────────────────────────────────────────────────┘ | ||
``` | ||
|
||
|
||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
{{ $width := .Attributes.width }} | ||
{{ $height := .Attributes.height }} | ||
{{ $class := .Attributes.class | default "" }} | ||
<div class="goat svg-container {{ $class }}"> | ||
{{ with diagrams.Goat .Code }} | ||
<svg | ||
xmlns="http://www.w3.org/2000/svg" | ||
font-family="Menlo,Lucida Console,monospace" | ||
{{ if or $width $height }} | ||
{{ with $width }}width="{{ . }}"{{ end }} | ||
{{ with $height }}height="{{ . }}"{{ end }} | ||
{{ else }} | ||
viewBox="0 0 {{ .Width }} {{ .Height }}" | ||
{{ end }}> | ||
{{ .Body }} | ||
</svg> | ||
{{ end }} | ||
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
{{- .Code | safeHTML }} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.