Lotus Docs Example Site

Démarrage rapide

Wed, 03 May 2023 22:37:22 +0100

Créer un nouveau contenu

Navigate to the root of your Hugo project and use the hugo new command to create a file in the content/docs directory:

hugo new docs/example-page.md

This will create a markdown file named example-page.md with the following default front matter:

+++
title = "Example Page"
description = ""
icon = "article"
date = "2023-05-22T00:27:57+01:00"
lastmod = "2023-05-22T00:27:57+01:00"
draft = false
toc = true
weight = 999
+++

Modify the options to suit your needs.

The code below shows the front matter code used to create this page, along with some markdown in the body:

Quickstart

Wed, 03 May 2023 22:37:22 +0100

Requirements

git
Go ≥ v1.19
Hugo ≥ v0.100.0 (Extended Version)

Install Hugo

Install the Hugo CLI, using the specific instructions for your operating system below:

Schnellstart

Wed, 03 May 2023 22:37:22 +0100

Neue Inhalte erstellen

Navigate to the root of your Hugo project and use the hugo new command to create a file in the content/docs directory:

hugo new docs/example-page.md

This will create a markdown file named example-page.md with the following default front matter:

+++
title = "Example Page"
description = ""
icon = "article"
date = "2023-05-22T00:27:57+01:00"
lastmod = "2023-05-22T00:27:57+01:00"
draft = false
toc = true
weight = 999
+++

Modify the options to suit your needs.

The code below shows the front matter code used to create this page, along with some markdown in the body:

Code

Mon, 22 May 2023 00:44:31 +0100

warning

The front matter description value for this page has been intentionally left empty in order to demonstrate FlexSearch’s suggested results fallback behaviour.

Code Block Examples

Code block language examples

Go

 package main

import "fmt"

func main() {
 fmt.Println("hello world")
}

HTML

 <!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>
</html>

Markdown

 # H1 heading

**Some bold text**

*Italic text example*

Code

Mon, 22 May 2023 00:44:31 +0100

Code Block Examples

Code block language examples

Go

package main

import "fmt"

func main() {
 fmt.Println("hello world")
}

HTML

<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>
</html>

Markdown

# H1 heading

**Some bold text**

*Italic text example*

Mermaid

Fri, 08 Sep 2023 05:12:51 +0100

Flowchart

flowchart LR

A[Hard] -->|Text| B(Round)
B --> C{Decision}
C -->|One| D[Result 1]
C -->|Two| E[Result 2]

Sequence diagram

sequenceDiagram
Alice->>John: Hello John, how are you?
loop Healthcheck
 John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts!
John-->>Alice: Great!
John->>Bob: How about you?
Bob-->>John: Jolly good!

Gantt Chart

gantt
 section Section
 Completed :done, des1, 2014-01-06,2014-01-08
 Active :active, des2, 2014-01-07, 3d
 Parallel 1 : des3, after des1, 1d
 Parallel 2 : des4, after des1, 1d
 Parallel 3 : des5, after des3, 1d
 Parallel 4 : des6, after des4, 1d

Class diagram

classDiagram
Class01 <|-- AveryLongClass : Cool
<<interface>> Class01
Class09 --> C2 : Where am i?
Class09 --* C3
Class09 --|> Class07
Class07 : equals()
Class07 : Object[] elementData
Class01 : size()
Class01 : int chimp
Class01 : int gorilla
class Class10 {
 >>service>>
 int id
 size()
}

State diagram

stateDiagram-v2
[*] --> Still
Still --> [*]
Still --> Moving
Moving --> Still
Moving --> Crash
Crash --> [*]

Pie Chart

pie
"Dogs" : 386
"Cats" : 85.9
"Rats" : 15

Git Graph

 gitGraph
 commit
 commit
 branch develop
 checkout develop
 commit
 commit
 checkout main
 merge develop
 commit
 commit

Bar chart (using gantt chart)

gantt
 title Git Issues - days since last update
 dateFormat X
 axisFormat %s

 section Issue19062
 71 : 0, 71
 section Issue19401
 36 : 0, 36
 section Issue193
 34 : 0, 34
 section Issue7441
 9 : 0, 9
 section Issue1300
 5 : 0, 5

User Journey diagram

 journey
 title My working day
 section Go to work
 Make tea: 5: Me
 Go upstairs: 3: Me
 Do work: 1: Me, Cat
 section Go home
 Go downstairs: 5: Me
 Sit down: 3: Me

C4 diagram

C4Context
title System Context diagram for Internet Banking System

Person(customerA, "Banking Customer A", "A customer of the bank, with personal bank accounts.")
Person(customerB, "Banking Customer B")
Person_Ext(customerC, "Banking Customer C")
System(SystemAA, "Internet Banking System", "Allows customers to view information about their bank accounts, and make payments.")

Person(customerD, "Banking Customer D", "A customer of the bank, <br/> with personal bank accounts.")

Enterprise_Boundary(b1, "BankBoundary") {

 SystemDb_Ext(SystemE, "Mainframe Banking System", "Stores all of the core banking information about customers, accounts, transactions, etc.")

 System_Boundary(b2, "BankBoundary2") {
 System(SystemA, "Banking System A")
 System(SystemB, "Banking System B", "A system of the bank, with personal bank accounts.")
 }

 System_Ext(SystemC, "E-mail system", "The internal Microsoft Exchange e-mail system.")
 SystemDb(SystemD, "Banking System D Database", "A system of the bank, with personal bank accounts.")

 Boundary(b3, "BankBoundary3", "boundary") {
 SystemQueue(SystemF, "Banking System F Queue", "A system of the bank, with personal bank accounts.")
 SystemQueue_Ext(SystemG, "Banking System G Queue", "A system of the bank, with personal bank accounts.")
 }
}

BiRel(customerA, SystemAA, "Uses")
BiRel(SystemAA, SystemE, "Uses")
Rel(SystemAA, SystemC, "Sends e-mails", "SMTP")
Rel(SystemC, customerA, "Sends e-mails to")

Example Doc

Wed, 03 May 2023 22:37:22 +0100

Lotus Docs Example Site

Démarrage rapide

Créer un nouveau contenu

Quickstart

Requirements link

Install Hugo link

Schnellstart

Neue Inhalte erstellen

Code

Code Block Examples link

Go link

HTML link

Markdown link

Code

Code Block Examples

Go

HTML

Markdown

Mermaid

Flowchart link

Sequence diagram link

Gantt Chart link

Class diagram link

State diagram link

Pie Chart link

Git Graph link

Bar chart (using gantt chart) link

User Journey diagram link

C4 diagram link

Example Doc

Requirements

Install Hugo

Code Block Examples

Go

HTML

Markdown

Flowchart

Sequence diagram

Gantt Chart

Class diagram

State diagram

Pie Chart

Git Graph

Bar chart (using gantt chart)

User Journey diagram

C4 diagram