Skip to content

Commit e2b1b4f

Browse files
xkeshavematipicoElianCodes
authored
fixed image path and add markdown syntax in example (#7802)
Co-authored-by: Emanuele Stoppa <[email protected]> Co-authored-by: Elian ☕️ <[email protected]>
1 parent 79376f8 commit e2b1b4f

File tree

1 file changed

+113
-6
lines changed

1 file changed

+113
-6
lines changed

examples/blog/src/content/blog/markdown-style-guide.md

+113-6
Original file line numberDiff line numberDiff line change
@@ -31,18 +31,44 @@ Itatur? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sap
3131

3232
## Images
3333

34-
![This is a placeholder image description](/blog-placeholder-1.jpg)
34+
#### Syntax
35+
36+
```markdown
37+
![Alt text](./full/or/relative/path/of/image)
38+
```
39+
40+
#### Output
41+
42+
![blog placeholder](../../../public/blog-placeholder-about.jpg)
3543

3644
## Blockquotes
3745

3846
The blockquote element represents content that is quoted from another source, optionally with a citation which must be within a `footer` or `cite` element, and optionally with in-line changes such as annotations and abbreviations.
3947

40-
#### Blockquote without attribution
48+
### Blockquote without attribution
49+
50+
#### Syntax
51+
52+
```markdown
53+
> Tiam, ad mint andaepu dandae nostion secatur sequo quae.
54+
> **Note** that you can use _Markdown syntax_ within a blockquote.
55+
```
56+
57+
#### Output
4158

4259
> Tiam, ad mint andaepu dandae nostion secatur sequo quae.
4360
> **Note** that you can use _Markdown syntax_ within a blockquote.
4461
45-
#### Blockquote with attribution
62+
### Blockquote with attribution
63+
64+
#### Syntax
65+
66+
```markdown
67+
> Don't communicate by sharing memory, share memory by communicating.<br>
68+
> — <cite>Rob Pike[^1]</cite>
69+
```
70+
71+
#### Output
4672

4773
> Don't communicate by sharing memory, share memory by communicating.<br>
4874
> — <cite>Rob Pike[^1]</cite>
@@ -51,12 +77,43 @@ The blockquote element represents content that is quoted from another source, op
5177

5278
## Tables
5379

80+
#### Syntax
81+
82+
```markdown
83+
| Italics | Bold | Code |
84+
| --------- | -------- | ------ |
85+
| _italics_ | **bold** | `code` |
86+
87+
```
88+
89+
#### Output
90+
5491
| Italics | Bold | Code |
5592
| --------- | -------- | ------ |
5693
| _italics_ | **bold** | `code` |
5794

5895
## Code Blocks
5996

97+
#### Syntax
98+
99+
we can use 3 backticks ``` in new line and write snippet and close with 3 backticks on new line and to highlight language specific syntac, write one word of language name after first 3 backticks, for eg. html, javascript, css, markdown, typescript, txt, bash
100+
101+
````markdown
102+
```html
103+
<!DOCTYPE html>
104+
<html lang="en">
105+
<head>
106+
<meta charset="utf-8" />
107+
<title>Example HTML5 Document</title>
108+
</head>
109+
<body>
110+
<p>Test</p>
111+
</body>
112+
</html>
113+
```
114+
````
115+
Output
116+
60117
```html
61118
<!DOCTYPE html>
62119
<html lang="en">
@@ -72,19 +129,53 @@ The blockquote element represents content that is quoted from another source, op
72129

73130
## List Types
74131

75-
#### Ordered List
132+
### Ordered List
133+
134+
#### Syntax
135+
136+
```markdown
137+
1. First item
138+
2. Second item
139+
3. Third item
140+
```
141+
142+
#### Output
76143

77144
1. First item
78145
2. Second item
79146
3. Third item
80147

81-
#### Unordered List
148+
### Unordered List
149+
150+
#### Syntax
151+
152+
```markdown
153+
- List item
154+
- Another item
155+
- And another item
156+
```
157+
158+
#### Output
82159

83160
- List item
84161
- Another item
85162
- And another item
86163

87-
#### Nested list
164+
### Nested list
165+
166+
#### Syntax
167+
168+
```markdown
169+
- Fruit
170+
- Apple
171+
- Orange
172+
- Banana
173+
- Dairy
174+
- Milk
175+
- Cheese
176+
```
177+
178+
#### Output
88179

89180
- Fruit
90181
- Apple
@@ -96,6 +187,22 @@ The blockquote element represents content that is quoted from another source, op
96187

97188
## Other Elements — abbr, sub, sup, kbd, mark
98189

190+
#### Syntax
191+
192+
```markdown
193+
<abbr title="Graphics Interchange Format">GIF</abbr> is a bitmap image format.
194+
195+
H<sub>2</sub>O
196+
197+
X<sup>n</sup> + Y<sup>n</sup> = Z<sup>n</sup>
198+
199+
Press <kbd><kbd>CTRL</kbd>+<kbd>ALT</kbd>+<kbd>Delete</kbd></kbd> to end the session.
200+
201+
Most <mark>salamanders</mark> are nocturnal, and hunt for insects, worms, and other small creatures.
202+
```
203+
204+
#### Output
205+
99206
<abbr title="Graphics Interchange Format">GIF</abbr> is a bitmap image format.
100207

101208
H<sub>2</sub>O

0 commit comments

Comments
 (0)