gitea/gitea-docs
1
0
Fork 0
mirror of https://gitea.com/gitea/docs.git synced 2026-07-22 02:37:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add mermaid JS renderer (#12334)

Browse Source 
* Add mermaid JS renderer

For feature parity with GitLab. Tested in files, issues, wiki, editor.
arc-green only does an inversion because the renderer seems to like to
render white backgrounds on boxes.

Ref: https://github.com/go-gitea/gitea/issues/3340
Fixes: https://github.com/go-gitea/gitea/issues/12307

* add feature entry, switch to neutral theme, remove border

* add bindFunctions support

* remove unnecessary border-radius

Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
This commit is contained in:
silverwind
2020-07-27 08:24:09 +02:00
committed by GitHub
parent 0bed35b347
commit 8210f19bee
2 changed files with 1 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
doc/advanced/customizing-gitea.en-us.md
View File

@@ -108,45 +108,6 @@ Apart from `extra_links.tmpl` and `extra_tabs.tmpl`, there are other useful temp
- `body_outer_post.tmpl`, before the bottom `<footer>` element. - `body_outer_post.tmpl`, before the bottom `<footer>` element.
- `footer.tmpl`, right before the end of the `<body>` tag, a good place for additional Javascript. - `footer.tmpl`, right before the end of the `<body>` tag, a good place for additional Javascript.
#### Example: Mermaid.js
If you would like to add [mermaid.js](https://mermaid-js.github.io/mermaid) support to Gitea's markdown you simply add:
```html
{{if .RequireHighlightJS}}
<script src="https://unpkg.com/mermaid@8.4.5/dist/mermaid.min.js"></script>
<!-- or wherever you have placed it -->
<script>mermaid.init(".language-mermaid")</script>
{{end}}
```
to `custom/footer.tmpl`. You then can add blocks
like below to your markdown:
```mermaid
stateDiagram
[*] --> Active
state Active {
[*] --> NumLockOff
NumLockOff --> NumLockOn : EvNumLockPressed
NumLockOn --> NumLockOff : EvNumLockPressed
--
[*] --> CapsLockOff
CapsLockOff --> CapsLockOn : EvCapsLockPressed
CapsLockOn --> CapsLockOff : EvCapsLockPressed
--
[*] --> ScrollLockOff
ScrollLockOff --> ScrollLockOn : EvCapsLockPressed
ScrollLockOn --> ScrollLockOff : EvCapsLockPressed
}
```
If you want to use Mermaid.js outside of markdown, e.g. in other templates or HTML files,
you would need to remove `{{if .RequireHighlightJS}}` and `{{end}}`.
Mermaid will detect and use tags with `class="language-mermaid"`.
#### Example: PlantUML #### Example: PlantUML
You can add [PlantUML](https://plantuml.com/) support to Gitea's markdown by using a PlantUML server. You can add [PlantUML](https://plantuml.com/) support to Gitea's markdown by using a PlantUML server.

1
page/index.en-us.md
View File

@@ -128,6 +128,7 @@ Windows, on architectures like amd64, i386, ARM, PowerPC, and others.
- Environment variables - Environment variables
- Command line options - Command line options
- Multi-language support ([21 languages](https://github.com/go-gitea/gitea/tree/master/options/locale)) - Multi-language support ([21 languages](https://github.com/go-gitea/gitea/tree/master/options/locale))
- [Mermaid](https://mermaidjs.github.io/) Diagram support
- Mail service - Mail service
- Notifications - Notifications
- Registration confirmation - Registration confirmation