Skip to content

Clarify relative path resolution across all docs configuration references #4649

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

Merged
Ryan-Amirthan merged 6 commits into from
Mar 31, 2026
Merged

Clarify relative path resolution across all docs configuration references #4649

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
fe00deb
Clarify that icon relative paths are relative to the referencing file…
devin-ai-integration[bot] Mar 31, 2026
04d35c0
Simplify wording: use 'configuration file where the icon is referenced'
devin-ai-integration[bot] Mar 31, 2026
677ac10
Clarify relative paths across all docs config references and add exam…
devin-ai-integration[bot] Mar 31, 2026
2baacd5
clarify terminology
devalog Mar 31, 2026
eafc5c3
Fix Vale contractions: 'it is' -> 'it's'
devin-ai-integration[bot] Mar 31, 2026
7387982
Merge remote contraction fixes
devin-ai-integration[bot] Mar 31, 2026
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
2 changes: 1 addition & 1 deletion fern/products/docs/pages/changelog/2025-11-03.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ You can use your own image files as icons throughout your `docs.yml` navigation

Icons support three formats:
- **Font Awesome icons**: Use icon names like `fa-solid fa-seedling` or `fa-regular fa-leaf`. Pro and Brand icons from Font Awesome are supported.
- **Custom image files**: Use relative paths to custom image files (e.g., `./assets/icons/plant-icon.svg`). Paths are relative to the `docs.yml` file.
- **Custom image files**: Use relative paths to custom image files (e.g., `./assets/icons/plant-icon.svg`). Paths are relative to the YAML file where the icon is referenced (e.g., `docs.yml`).
- **Inline SVG**: Provide an SVG string wrapped in quotes.

```yaml Sidebar icons in docs.yml
Expand Down
2 changes: 1 addition & 1 deletion fern/products/docs/pages/changelog/2025-12-20.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ tags: ["components", "customization"]

## Custom SVG icons in card and icon components

The Card and Icon components support relative paths to SVG files. Use a relative path like `./images/icon.svg` to display custom SVG icons from your project.
The Card and Icon components support relative paths to SVG files. Use a relative path like `./images/icon.svg` to display custom SVG icons from your project. Paths are relative to the page where the component is used.

```jsx Markdown
<Card
Expand Down
14 changes: 7 additions & 7 deletions fern/products/docs/pages/customization/site-level-settings.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@ navbar-links:
</ParamField>

<ParamField path="favicon" type="string" required={false} toc={true}>
Relative filepath to the favicon.
Relative filepath to the favicon. The path is relative to the YAML file where it is set (e.g., `docs.yml`).
Copy link
Copy Markdown
Contributor

@github-actions github-actions Bot Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚫 [vale] reported by reviewdog 🐶
[Microsoft.Contractions] Use 'it's' instead of 'it is'.

</ParamField>

<ParamField path="colors" type="objects" required={true} toc={true}>
Expand Down Expand Up @@ -234,11 +234,11 @@ logo:
</ParamField>

<ParamField path="logo.dark" type="string" required={false} toc={true}>
Path to your dark mode logo file, relative to the docs root. SVG format is recommended for optimal quality. Example: `assets/images/logo-dark.svg`
Path to your dark mode logo file, relative to the YAML file where it is set (e.g., `docs.yml`). SVG format is recommended for optimal quality. Example: `assets/images/logo-dark.svg`
Copy link
Copy Markdown
Contributor

@github-actions github-actions Bot Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚫 [vale] reported by reviewdog 🐶
[Microsoft.Contractions] Use 'it's' instead of 'it is'.

</ParamField>

<ParamField path="logo.light" type="string" required={false} toc={true}>
Path to your light mode logo file, relative to the docs root. SVG format is recommended for optimal quality. Example: `assets/images/logo-light.svg`
Path to your light mode logo file, relative to the YAML file where it is set (e.g., `docs.yml`). SVG format is recommended for optimal quality. Example: `assets/images/logo-light.svg`
Copy link
Copy Markdown
Contributor

@github-actions github-actions Bot Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚫 [vale] reported by reviewdog 🐶
[Microsoft.Contractions] Use 'it's' instead of 'it is'.

</ParamField>

<ParamField path="logo.right-text" type="string" required={false} toc={true}>
Expand Down Expand Up @@ -436,11 +436,11 @@ background-image:
```

<ParamField path="background-image.light" type="string" required={false} toc={true}>
Relative filepath to the light-mode background image.
Relative filepath to the light-mode background image. The path is relative to the YAML file where it is set (e.g., `docs.yml`).
Copy link
Copy Markdown
Contributor

@github-actions github-actions Bot Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚫 [vale] reported by reviewdog 🐶
[Microsoft.Contractions] Use 'it's' instead of 'it is'.

</ParamField>

<ParamField path="background-image.dark" type="string" required={false} toc={true}>
Relative filepath to the dark-mode background image.
Relative filepath to the dark-mode background image. The path is relative to the YAML file where it is set (e.g., `docs.yml`).
Copy link
Copy Markdown
Contributor

@github-actions github-actions Bot Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚫 [vale] reported by reviewdog 🐶
[Microsoft.Contractions] Use 'it's' instead of 'it is'.

</ParamField>


Expand Down Expand Up @@ -534,7 +534,7 @@ typography:
</ParamField>

<ParamField path="path" type="string" required={false} toc={true}>
The path to your font file, relative to your docs folder. Use this when you have a single font file. For multiple font files (like separate files for bold, italic etc), use `paths` instead.
The path to your font file, relative to the YAML file where it is set (e.g., `docs.yml`). Use this when you have a single font file. For multiple font files (like separate files for bold, italic etc), use `paths` instead.
Copy link
Copy Markdown
Contributor

@github-actions github-actions Bot Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚫 [vale] reported by reviewdog 🐶
[Microsoft.Contractions] Use 'it's' instead of 'it is'.

</ParamField>

<ParamField path="weight" type="string | number" required={false} toc={true}>
Expand Down Expand Up @@ -947,7 +947,7 @@ landing-page:
</ParamField>

<ParamField path="path" type="string" required={true}>
Relative filepath to the desired landing page Markdown file.
Relative filepath to the desired landing page Markdown file. The path is relative to the YAML file where it is set (e.g., `docs.yml`).
Copy link
Copy Markdown
Contributor

@github-actions github-actions Bot Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚫 [vale] reported by reviewdog 🐶
[Microsoft.Contractions] Use 'it's' instead of 'it is'.

</ParamField>

<ParamField path="slug" type="string" required={false} toc={true}>
Expand Down
2 changes: 1 addition & 1 deletion fern/products/docs/pages/navigation/tabs.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -113,7 +113,7 @@ theme:
</ParamField>

<ParamField path="changelog" type="string">
Path to a [changelog](/learn/docs/configuration/changelogs) folder relative to the `fern` directory
Path to a [changelog](/learn/docs/configuration/changelogs) folder, relative to the YAML file where it is set (e.g., `docs.yml`)
Copy link
Copy Markdown
Contributor

@github-actions github-actions Bot Mar 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚫 [vale] reported by reviewdog 🐶
[Microsoft.Contractions] Use 'it's' instead of 'it is'.

</ParamField>

<ParamField path="viewers" type="string | list">
Expand Down
2 changes: 1 addition & 1 deletion fern/products/docs/pages/seo/metadata.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -121,7 +121,7 @@ metadata:
</ParamField>

<ParamField path="metadata.og:background-image" type="string" required={false} toc={true}>
A custom background image for dynamically generated OG images. Can be a URL or a relative file path. When set, this image is used as the background instead of a solid color.
A custom background image for dynamically generated OG images. Can be a URL or a relative file path. Relative paths are resolved from the YAML file where this property is set (e.g., `docs.yml`). When set, this image is used as the background instead of a solid color.
</ParamField>

### Twitter / X
Expand Down
4 changes: 2 additions & 2 deletions fern/snippets/icons.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
Icons can be in three formats:
- **Font Awesome icons**: Use icon names like `fa-solid fa-rocket`. Pro and Brand Icons from Font Awesome are supported.
- **Custom image files**: Use relative paths to image files (e.g., `./assets/icons/my-icon.svg` or `../assets/icons/my-icon.png`). Paths are relative to the `docs.yml` file.
- **Inline SVG**: Provide an SVG string wrapped in quotes (e.g., `"<svg>...</svg>"`).
- **Custom image files**: Use relative paths to image files (e.g., `./assets/icons/my-icon.svg` or `../assets/icons/my-icon.png`). Paths are relative to the YAML file where the icon is referenced (e.g., `docs.yml`). For example, if you set an icon in `fern/products/my-product.yml`, the path `./assets/icon.svg` resolves to `fern/products/assets/icon.svg`. If you set it in `fern/docs.yml`, the same path resolves to `fern/assets/icon.svg`.
- **Inline SVG**: Provide an SVG string wrapped in quotes (e.g., `"<svg>...</svg>"`).
2 changes: 1 addition & 1 deletion fern/snippets/seo-metadata-site.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@ metadata:
</ParamField>

<ParamField path="metadata.og:background-image" type="string" required={false}>
A custom background image for dynamically generated OG images. Can be a URL or a relative file path.
A custom background image for dynamically generated OG images. Can be a URL or a relative file path. Relative paths are resolved from the YAML file where this property is set (e.g., `docs.yml`).
</ParamField>

<ParamField path="metadata.canonical-host" type="string" required={false}>
Expand Down
Loading