Skip to content

doc: add markdown lang fence #1612

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
glitched-w0rld wants to merge 1 commit into
base: main
Choose a base branch
from
Open

doc: add markdown lang fence #1612

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
78 changes: 39 additions & 39 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -395,33 +395,33 @@ Using markdown links to link to pages e.g. :

_Relative link_

```
```markdown
[Link to mypage](../mypage.md)
```

_Absolute link_

```
```markdown
[Link to mypage](/src/pages/mypage.md)
```

Add the suffix `#` to a link to jump to a section of the page for example if your page has a heading named `Join the future`, you can link to it:

```
```markdown
[Link to mypage](../mypage.md#join-the-future)
```

You can also use absolute links or relative links to link between markdown pages e.g. with the example folder structure from [Content Structure](#content-structure) you can add a link from `/guides/index.md` to `/api/index.md` with:

_Relative link_

```
```markdown
[Link to API](../api/)
```

_Absolute link_

```
```markdown
[Link to API](/api/)
```

Expand All @@ -431,7 +431,7 @@ _Absolute link_

External links will automatically open in a new tab or window.

```
```markdown
[Link to example.com](https://example.com)
```

Expand All @@ -458,13 +458,13 @@ root

where `image.png` is referenced in `index.md` as an image:

```
```markdown
![alt image](./image.png)
```

and `document.pdf` is referenced in `index.md` as a link:

```
```markdown
[document](/document.pdf)
```

Expand Down Expand Up @@ -1302,7 +1302,7 @@ There are 3 different variants:

![hero default](docs/images/hero-default.png)

```
```markdown
<Hero slots="image, heading, text" background="rgb(64, 34, 138)" hideBreadcrumbNav={false}/>

![Hero image](./illustration.png)
Expand Down Expand Up @@ -1331,7 +1331,7 @@ Use `videoUrl` to videoURL to post the video in half width /full width

![hero halfwidth](docs/images/hero-halfwidth.png)

```
```markdown
<Hero slots="image, icon, heading, text1, text2, buttons" variant="halfwidth" />

![Creative Cloud banner](images/cc-hero.png)
Expand Down Expand Up @@ -1363,7 +1363,7 @@ Use `slots` to identify the markdown content:

![hero fullwidth](docs/images/hero-fullwidth.png)

```
```markdown
<Hero slots="image, heading, text, buttons" variant="fullwidth" background="rgb(51, 51, 51)" />

![IO banner](images/io-banner.png)
Expand Down Expand Up @@ -1397,7 +1397,7 @@ They can point to internal or external documents or pages.

![resources block](docs/images/resources-block.png)

```
```markdown
<Resources slots="heading, links"/>

#### Resources
Expand All @@ -1420,7 +1420,7 @@ Discover Blocks can be illustrated but only one illustration per row is allowed.

![single discover block](docs/images/discover-block-single.png)

```
```markdown
<DiscoverBlock width="100%" slots="heading, link, text"/>

### Get Started
Expand All @@ -1434,7 +1434,7 @@ Get started with the Adobe Analytics APIs.

![multiple discover blocks](docs/images/discover-block-multiple.png)

```
```markdown
<DiscoverBlock slots="heading, link, text"/>

### Guides
Expand Down Expand Up @@ -1466,7 +1466,7 @@ Provides configuration guidance and best practices for the /reports endpoint.

![illustrated discover block](docs/images/discover-block-illustrated.png)

```
```markdown
<DiscoverBlock slots="image, heading, link, text"/>

![Adobe Experience Cloud](experience_cloud.png)
Expand Down Expand Up @@ -1680,7 +1680,7 @@ It's used to call out new features, blog posts, news etc. anything that needs th

![announcement block](docs/images/announcement-block.png)

```
```markdown

<AnnouncementBlock slots="heading, text, button" />

Expand Down Expand Up @@ -1708,7 +1708,7 @@ The Summary Block acts as an anchor at the end of the page. It's a change for Pr

![summary block](docs/images/summary-block.png)

```
```markdown

<SummaryBlock slots="image, heading, text, buttons" background="rgb(246, 16, 27)" />

Expand Down Expand Up @@ -1743,7 +1743,7 @@ A Title Block is used at the beginning of sections, or to frame compositions on

![title block](docs/images/title-block.png)

```
```markdown

<TitleBlock slots="heading, text" theme="light" />

Expand Down Expand Up @@ -1771,7 +1771,7 @@ They are coupled with images or videos.

**With an image, texts and links**

```
```markdown

<TextBlock slots="image, heading, text1, text2, links" />

Expand All @@ -1795,7 +1795,7 @@ And be sure to join the [Exchange Program for Creative Cloud](https://partners.a

![centered text blocks](docs/images/text-block-centered.png)

```
```markdown

<TextBlock slots="image, heading, text, links" width="33%" />

Expand Down Expand Up @@ -1833,7 +1833,7 @@ Instantly share Creative Cloud files, designs, specs, and notifications all in r

![text block with a video](docs/images/text-block-video.png)

```
```markdown

<TextBlock slots="video, icons, heading, text, buttons" theme="dark" />

Expand All @@ -1856,7 +1856,7 @@ world-class creative assets with the Adobe Stock API, or sign up for early infor

![text block with a local video](docs/images/textblockwithvideo.png)

```
```markdown

import video1 from '../videos/localVideo.mp4'

Expand Down Expand Up @@ -1990,7 +1990,7 @@ Tabs block is a custom block component that allows for tabbed content that can b

![tabsBlock](docs/images/tabsBlock.png)

```
```markdown

<TabsBlock orientation="vertical" slots="heading, image, content" theme="light" />

Expand All @@ -2008,7 +2008,7 @@ Tabs block is a custom block component that allows for tabbed content that can b

```

```
```markdown

<TabsBlock orientation="horizontal" slots="heading, image, content" theme="light" />

Expand Down Expand Up @@ -2044,7 +2044,7 @@ Product Cards group information that allow to browse a collection of related con

![product card](docs/images/product-card.png)

```
```markdown

<ProductCard slots="icon, heading, text, buttons" theme="light" width="33%" />

Expand Down Expand Up @@ -2121,7 +2121,7 @@ There are 2 variants: horizontal and vertical Resource Cards. Use multiple Resou

![resource card](docs/images/resource-card.png)

```
```markdown
<ResourceCard slots="link, image, heading, text" width="33%"/>

[Adobe I/O](https://adobe.io)
Expand Down Expand Up @@ -2173,7 +2173,7 @@ Used to display the Product information along with the images/icons and headings

![miniresource card](docs/images/mini-resource.png)

```
```markdown
<MiniResourceCard slots="image,heading,text,link" repeat="6" theme="lightest" inRow="3" textColor="#427dcd"/>

![Forge the path to customer success](./S_AniChangeBackground.png)
Expand Down Expand Up @@ -2247,7 +2247,7 @@ Carousel is used to show the information along with images and buttons.

![Carousel](docs/images/carousel.png)

```
```markdown
<Carousel slots="image,heading, text, buttons" repeat="2" theme="light" />

![Resource 3](images/resource3.png)
Expand Down Expand Up @@ -2302,7 +2302,7 @@ Use `enableNavigation` to display navigation icon. By default it is in false. If

Use `navigationIconColor` to change the icon color. By default it is black.

```
```markdown
import video1 from './video1.mp4'
import video2 from "./video2.mp4"
import video3 from "./video3.mp4"
Expand Down Expand Up @@ -2337,7 +2337,7 @@ ImageTextBlock is used to display two images, along with text, a heading, and bu

![ImageTextBlock](docs/images/imagetext-block.png)

```
```markdown
<ImageTextBlock slots="image,heading,text,buttons" repeat="2" bgColor="#f8f8f8" className="boxmodal" isCenter variantsTypePrimary='accent'/>

![Adobe Service](6_Image_Sales.jpg)
Expand Down Expand Up @@ -2379,7 +2379,7 @@ Teaser component is used to place the text over the background image/color

![TeaserBlock](docs/images/TeaserBlock.png)

```
```markdown
import bgImg from "./Images/black_image.png"
<TeaserBlock slots="heading,text,button" textColor="white" position="right" bgURL={bgImg}/>

Expand Down Expand Up @@ -2505,7 +2505,7 @@ The PDFViewer component integrates PDF display with accompanying text, headings,

![pdfviewer](docs/images/pdf_viewer.png)

```
```markdown

import pdf from "./sample.pdf";

Expand Down Expand Up @@ -2551,7 +2551,7 @@ This component is designed to showcase product information using images/icons, h

![profile_card](docs/images/profile_card.png)

```
```markdown
<ProfileCard slots="image,heading,text,link,buttons" repeat="6" theme="lightest" inRow="3"/>

![Remove Background](./remove-background.svg)
Expand Down Expand Up @@ -2640,7 +2640,7 @@ Miniproductcard component is used to display the product card with little image

![mini_product_card](docs/images/mini-product-card.png)

```
```markdown
<MiniProductCard slots="image, heading , text , buttons" repeat="4" theme="lightest" inRow="4" variantsType="primary" buttonStyle="outline" />

![Forge the path to customer success](./S_AniConvertToGIF.png)
Expand Down Expand Up @@ -2677,7 +2677,7 @@ For example, if you want to include the content of `overview.md` into `index.md`

`index.md` content:

```
```markdown
import Overview from './overview.md'

# Welcome
Expand Down Expand Up @@ -2742,7 +2742,7 @@ Both are sites using the theme and have markdown content defined under `src/page

1. repo1 has reusable markdown content written with Variant Blocks under `/src/pages/debugging/index.md`:

```
```markdown
## How to Debug Your Plugin

Bugs happen! In this tutorial, you will learn how to debug your plugin.
Expand Down Expand Up @@ -2772,7 +2772,7 @@ _Use `repeat` to define how many elements are part of the Variant Block. Use any

3. repo2 embeds repo1 content by using the `import` statement and inserts the content in its own markdown together with a `query` filter to only display what is needed.

```
```markdown
import Debugging from 'repo1/src/pages/debugging/index.md'

# Debugging
Expand All @@ -2784,7 +2784,7 @@ More content

will be rendered as:

```
```markdown
# Debugging

## How to Debug Your Plugin
Expand Down Expand Up @@ -3147,4 +3147,4 @@ This can be turned off through gatsby-config.js
removeLogIssue: true,
},
}
```
```