Skip to content

Added missing rendered examples #12

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
willismonroe wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Added missing rendered examples #12

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 23 additions & 2 deletions editors/markdown.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -105,6 +105,12 @@ function lorem (ipsum) {
```
````

```
function lorem (ipsum) {
const dolor = 'consectetur adipiscing elit'
}
```

#### Syntax Highlighting

By default, a code block is rendered as plain preformatted text. It's however preferable to use syntax highlighting for programming code, allowing for easier readability. To specify the programming language used in the code block, simply add the language keyword right after the opening triple backticks:
Expand Down Expand Up @@ -196,7 +202,7 @@ This sentence[^1] needs a few footnotes.[^2]

#### Usage

Using between 1 and 6 **hashtag** symbol(s), followed by a space, before the text selection.
Using between 1 and 6 **hashtag** symbol(s), followed by a space, before the text selection. Headers in levels 1 an 2 automatically appear in the ToC on the left-hand side of the page.

#### Shortcuts
- On the desired line, then clicking the ![Header](/assets/ui/ui-markdown-headers.png =x30){.radius-4} dropdown button in the toolbar.
Expand Down Expand Up @@ -255,11 +261,14 @@ Using the syntax `![Image Caption](Image Source)`.
#### Examples

```markdown
![Lorem ipsum](https://dolor.example.com/sit/amet.jpg)
![Lorem ipsum](https://picsum.photos/200)

Consectetur ![adipiscing](/link/to/image.jpg) elit
```

![Lorem ipsum](https://picsum.photos/200)
Consectetur ![adipiscing](https://picsum.photos/200) elit

#### Dimensions

Sometimes images are too large or maybe you want the image to fill up all the available space.
Expand Down Expand Up @@ -390,6 +399,18 @@ sequenceDiagram
```
````

```mermaid
sequenceDiagram
Alice ->> Bob: Hello Bob, how are you?
Bob-->>John: How about you John?
Bob--x Alice: I am good thanks!
Bob-x John: I am good thanks!
Note right of John: Bob thinks a long<br/>long time, so long<br/>that the text does<br/>not fit on a row.

Bob-->Alice: Checking with John...
Alice->John: Yes... John, how are you?
```

## Ordered Lists

### Tab {.tabset}
Expand Down