Showcase

Swagger integration🔗

Diagram🔗

Several diagrams can be created within your markdown page. To see code related with the example, please click on the view source icon on the top of the page.

Flowchart🔗

graph LR
  A[Start] --> B{Error?};
  B -->|Yes| C[Hmm...];
  C --> D[Debug];
  D --> B;
  B ---->|No| E[Yay!];

Sequence diagram🔗

sequenceDiagram
  autonumber
  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!

State diagram🔗

stateDiagram-v2
  state fork_state <<fork>>
    [*] --> fork_state
    fork_state --> State2
    fork_state --> State3

    state join_state <<join>>
    State2 --> join_state
    State3 --> join_state
    join_state --> State4
    State4 --> [*]

Class diagram🔗

classDiagram
  Person <|-- Student
  Person <|-- Professor
  Person : +String name
  Person : +String phoneNumber
  Person : +String emailAddress
  Person: +purchaseParkingPass()
  Address "1" <-- "0..1" Person:lives at
  class Student{
    +int studentNumber
    +int averageMark
    +isEligibleToEnrol()
    +getSeminarsTaken()
  }
  class Professor{
    +int salary
  }
  class Address{
    +String street
    +String city
    +String state
    +int postalCode
    +String country
    -validate()
    +outputAsLabel()  
  }

Using entity-relationship diagrams🔗

erDiagram
  CUSTOMER ||--o{ ORDER : places
  ORDER ||--|{ LINE-ITEM : contains
  LINE-ITEM {
    string name
    int pricePerUnit
  }
  CUSTOMER }|..|{ DELIVERY-ADDRESS : uses

For more details, please see https://mermaid.js.org/ecosystem/integrations-community.html

Code annotation🔗

theme:
  features:
    - content.code.annotate # (1)!

1. I'm a code annotation! I can contain code, formatted text, images, ... basically anything that can be written in Markdown.

Admonition🔗

Example with custom title🔗

!!! note "Phasellus posuere in sem ut cursus"

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod
    nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor
    massa, nec semper lorem quam in massa.

Supported types🔗

Adding Contact footnote🔗

This is how you had content footnotes "--8<-- "snippets/contact-footer.md""

Here is output:

Glossary annotation🔗

This is a test for glossary for WKT (1)

1. Snippet file not found: ../../glossary.md

This will allow to ingest content from glossary as an annotation in your article

Video integration🔗

Here is an example of video integration

Please take a look at the source code of this page to see syntax.

For now please make sure that video is uploaded on Earthdaily Youtube account. For now we are only supporting this platform but more could be added just create a ticket for this, here

Adding badges in documentation🔗

Swagger🔗

<!-- md:flag swagger API Name | https://api.example.com/docs -->

Demo repo🔗

<span class="mdx-badge mdx-badge--right"><span class="mdx-badge__icon">[:material-github:](conventions.md#demo 'Demo repository')</span><span class="mdx-badge__text">[reflectance-datacube-processor](https://github.com/earthdaily/reflectance-datacube-processor)</span></span>

Experimental flag🔗

this is the experimental flag