diff --git a/changelog/overview.mdx b/changelog/overview.mdx index 16a52ed74..612e034d7 100644 --- a/changelog/overview.mdx +++ b/changelog/overview.mdx @@ -5,20 +5,36 @@ mode: "center" --- - ## .md support for LLMs + ## New Configuration Schema `docs.json` + + We've introduced a new `docs.json` schema as a replacement for `mint.json`, to support better multi-level versioning, easier visual comprehension, and more consistent terminology. For more information on what's changed, [check out our blog](https://mintlify.com/blog/refactoring-mint-json-into-docs-json). - All documentation pages are now automatically available as plain Markdown files—just append `.md` to the URL. This makes it easier for LLMs to ingest individual pages from your documentation. - ## docs.json replacing mint.json - Upgrades include better multi-level versioning, easier visual comprehension, and more consistent terminology. + Upgrade from `mint.json` to `docs.json` with the following steps: - [Update your Mintlify CLI](/navigation/config-upgrade#upgrading-from-mint-json-to-docs-json). + 1. Make sure your CLI is the latest version + + ``` + npm i mintlify@latest -g + ``` + + 2. In your docs repository, run + + ``` + mintlify upgrade + ``` + + 3. Delete your old mint.json file and push your changes ## CI Checks Automatically lint your docs to find broken links, discover spelling and grammar issues, or enforce writing styles with your own Vale config. Learn more in our [docs](settings/ci). + ## .md support for LLMs + + All documentation pages are now automatically available as plain Markdown files—just append `.md` to the URL. This makes it easier for LLMs to ingest individual pages from your documentation. + ## More Themes New pre-built themes to modify the look & feel of your docs. Configure via your [docs.json file](/settings/global). @@ -321,8 +337,6 @@ mode: "center" * [Read the blog announcement](https://mintlify.com/blog/widget) - * [Learn how to install the Widget](/advanced/rest-api/overview) - ## Pro Plan We also updated our pricing plans for better customizability and scale. @@ -407,4 +421,4 @@ mode: "center" * Open-source MDX Engine: We've exposed two APIs—getCompiledMdx and MDXComponent—so you can access Mintlify markdown and code syntax highlighting. [Contributions to the project](https://github.com/mintlify/mdx) are welcome. * AI Chat Insights: Segment chat history by date and increase AI Chat quota from the dashboard, and see how often a specific query appears. - \ No newline at end of file + diff --git a/code.mdx b/code.mdx index b137fcce0..498319a65 100644 --- a/code.mdx +++ b/code.mdx @@ -8,12 +8,14 @@ icon: 'code' ### Inline Code -To denote a `word` or `phrase` as code, enclose it in backticks (`). +To denote a `word` or `phrase` as code, enclose it in backticks (\`). ``` To denote a `word` or `phrase` as code, enclose it in backticks (`). ``` + + ### Code Block Use [fenced code blocks](https://www.markdownguide.org/extended-syntax/#fenced-code-blocks) by enclosing code in three backticks and follow the leading ticks with the programming language of your snippet to get syntax highlighting. Optionally, you can also write the name of your code after the programming language. @@ -36,4 +38,4 @@ class HelloWorld { ``` ```` -Visit the [Code Block page](/content/components/code) for more detailed docs. +Visit the [Code Block page](/content/components/code) for more detailed docs. \ No newline at end of file diff --git a/content/components/cards.mdx b/content/components/cards.mdx index f1254e439..00e7c24ed 100644 --- a/content/components/cards.mdx +++ b/content/components/cards.mdx @@ -10,21 +10,21 @@ icon: "rectangle" + ```jsx Card Example + + This is how you use a card with an icon and a link. Clicking on this card + brings you to the Card Group page. + + ``` + + ```jsx Image Card Example + + Here is an example of a card with an image + + ``` + -```jsx Card Example - - This is how you use a card with an icon and a link. Clicking on this card - brings you to the Card Group page. - -``` -```jsx Image Card Example - - Here is an example of a card with an image - -``` - - ### Horizontal Card @@ -70,4 +70,4 @@ Add an `img` property to a card to display an image on the top of the card. The url or local path to an image to display on the top of the card - + \ No newline at end of file diff --git a/docs.json b/docs.json index 502e07d1c..caf2fd161 100644 --- a/docs.json +++ b/docs.json @@ -33,8 +33,7 @@ "navigation/pages", "navigation/divisions", "navigation/versions", - "navigation/localization", - "navigation/config-upgrade" + "navigation/localization" ] }, "migration" diff --git a/navigation/config-upgrade.mdx b/navigation/config-upgrade.mdx deleted file mode 100644 index 47a5865ca..000000000 --- a/navigation/config-upgrade.mdx +++ /dev/null @@ -1,294 +0,0 @@ ---- -title: "mint.json vs docs.json" -description: Understanding the differences between mint.json and docs.json -sidebarTitle: Config Upgrade ---- - -## What is the difference between mint.json and docs.json? - -In the `mint.json`, the navigation was defined by both the `navigation` field AND the `tabs`, `anchors`, and `versions` fields. -All these fields were related to each other and had to be mapped together. - -In the `docs.json`, the navigation is solely defined by the `navigation` field. - -For example, here is a `mint.json` and its equivalent `docs.json` - - - -```json mint.json -{ - "tabs": [{ - "name": "Components", - "url": "content" - }, - { - "name": "Integrations", - "url": "integrations" - }], - "navigation": [ - { - "group": "Components", - "pages": [ - "content/components/accordions", - "content/components/accordion-groups", - "content/components/callouts", - ... - ] - }, - { - "group": "API Components", - "pages": [ - "content/components/params", - "content/components/responses", - ... - ] - }, - { - "group": "Analytics", - "pages": [ - "integrations/analytics/overview", - "integrations/analytics/amplitude", - "integrations/analytics/clearbit", - ... - ] - }, - { - "group": "SDKs", - "pages": ["integrations/sdks/providers", "integrations/sdks/clients"] - } - ] -} -``` - -```json docs.json -{ - "navigation": { - "tabs": [{ - "tab": "Components", - "groups": [ - { - "group": "Components", - "pages": [ - "content/components/accordions", - "content/components/accordion-groups", - "content/components/callouts", - ... - ] - }, - { - "group": "API Components", - "pages": [ - "content/components/params", - "content/components/responses", - ... - ] - } - ] - }, - { - "tab": "Integrations", - "groups": [ - { - "group": "Analytics", - "pages": [ - "integrations/analytics/overview", - "integrations/analytics/amplitude", - "integrations/analytics/clearbit", - ... - ] - }, - { - "group": "SDKs", - "pages": ["integrations/sdks/providers", "integrations/sdks/clients"] - } - ] - }] - } -} -``` - - - -In the above `mint.json` example, the navigation is one combined array of groups and the tabs are a separate array. -The tabs serve to group the groups in the navigation. This isn't very intuitive and it's hard to manage. - -In the `docs.json` there is no separation between tabs, groups, and pages - they are integrated into one large recursive structure. -So it is very obvious how the groups are grouped into tabs. - -## What functionality does docs.json unlock? - -Tabs and anchors are no longer restricted to a single folder of the same name. Previously with mint.json a tab had to correlate with a folder in the file tree. -Now you can have a tab with an assortment of files in different folders. - - - -```json mint.json -{ - "tabs": [ - { - "name": "Tab 1", - "url": "some-folder" - }, - { - "name": "Tab 2", - "url": "some-other-folder" - } - ], - "navigation": [ - { - "group": "Group in Tab 1", - "pages": [ - "some-folder/file-1", // Notice how we're restricted to the folder name - "some-folder/file-2" - ] - }, - { - "group": "Group in Tab 2", - "pages": ["some-other-folder/file-1", "some-other-folder/file-2"] - } - ] -} -``` - -```json docs.json -{ - "navigation": { - "tabs": [ - { - "tab": "Tab 1", - "groups": [ - { - "group": "Group 1", - "pages": [ - "some-folder/file-1", - "another-folder/file-2" - "just-a-file" - ] - } - ] - } - { - "tab": "Tab 2", - "groups": [ - { - "group": "Group 2", - "pages": [ - "some-other-folder/file-1", - "various-different-folders/file-2", - "another-file" - ] - } - ] - } - ] - } -} -``` - - - -All the benefits we've been discussing with tabs is applicable for versions, anchors, languages, and dropdowns. -And you can now arbitrarily mix and nest any combination of these divisions. - -This gives a lot of freedom for you to pick and choose the hierarchy you want - either tabs or anchors can be on the highest level. - -Here is a complex example that includes all the different types of divisions - versions, anchors, languages, and dropdowns. - -Now you can have versions applied to only a specific tab and reference tabs at one layer and then reference them again -further down the hierarchy. - -```json docs.json [expandable] -{ - "languages": [ - { - "language": "en", - "tabs": [ - { - "tab": "Guides", - "pages": ["en/overview", "en/quickstart"] - }, - { - "tab": "SDKs", - "versions": [ - { - "version": "latest", - "anchors": [ - { - "anchor": "Javascript", - "pages": [ - "en/sdk/js/create", - "en/sdk/js/edit", - "en/sdk/js/delete" - ] - }, - { - "anchor": "Python", - "pages": [ - "en/sdk/py/create", - "en/sdk/py/edit", - "en/sdk/py/delete" - ] - } - ] - } - ] - } - ] - }, - { - "language": "es", - "tabs": [ - { - "tab": "Guías", - "pages": ["es/overview", "es/quickstart"] - }, - { - "tab": "SDKs", - "versions": [ - { - "version": "último", - "anchors": [ - { - "anchor": "Javascript", - "pages": [ - "es/sdk/js/create", - "es/sdk/js/edit", - "es/sdk/js/delete" - ] - }, - { - "anchor": "Python", - "pages": [ - "es/sdk/py/create", - "es/sdk/py/edit", - "es/sdk/py/delete" - ] - } - ] - } - ] - } - ] - } - ] -} -``` - -## Upgrading from `mint.json` to `docs.json` - - - - - ```bash - npm i mintlify@latest -g - ``` - - - - - ```bash - mintlify upgrade - ``` - - - diff --git a/navigation/overview.mdx b/navigation/overview.mdx index 65e0da16c..464f51911 100644 --- a/navigation/overview.mdx +++ b/navigation/overview.mdx @@ -22,5 +22,5 @@ easier for your users to navigate through your documentation. If you want to learn more about the difference between `mint.json` and - `docs.json` checkout our [upgrade guide](/navigation/config-upgrade) + `docs.json` checkout our [blog](https://mintlify.com/blog/refactoring-mint-json-into-docs-json) diff --git a/web-editor.mdx b/web-editor.mdx index f25c54d4b..b8875767f 100644 --- a/web-editor.mdx +++ b/web-editor.mdx @@ -22,17 +22,17 @@ changes, it's still helpful to know the basics of git. Git terminology: -- **Repository**: The folder in which your code lives. It can be local (on your computer) or remote (like GitHub). +* **Repository**: The folder in which your code lives. It can be local (on your computer) or remote (like GitHub). -- **Commit**: A snapshot of changes made to files in the repository. +* **Commit**: A snapshot of changes made to files in the repository. -- **Branch**: A separate line of development. It's a working copy of the code that allows you to work on changes without affecting the main version. +* **Branch**: A separate line of development. It's a working copy of the code that allows you to work on changes without affecting the main version. -- **Pull request:** A request to merge changes from a working branch into the main branch. This is used for reviewing content before making changes live. +* **Pull request:** A request to merge changes from a working branch into the main branch. This is used for reviewing content before making changes live. ### Making updates -In order to make updates to your docs, we include a few buttons specifically to +In order to make updates to your docs, we include a few buttons specifically to integrate with your git workflow. @@ -51,6 +51,7 @@ integrate with your git workflow. + @@ -59,6 +60,7 @@ integrate with your git workflow. + @@ -84,6 +86,7 @@ integrate with your git workflow. + @@ -95,6 +98,7 @@ integrate with your git workflow. + @@ -111,6 +115,7 @@ integrate with your git workflow. + @@ -125,6 +130,7 @@ commands you have access to after typing `/` in the **"Visual Editor"** mode: + @@ -132,6 +138,7 @@ As you type, you'll see more options pop up: + @@ -179,6 +186,7 @@ image or use an existing image from the repo. + @@ -186,6 +194,7 @@ Uploading an image can be done through the modal: + @@ -193,6 +202,7 @@ And you can preview an existing image before you add it. + @@ -201,8 +211,10 @@ And you can preview an existing image before you add it. In order to edit images, you just have to hover over the image to see the **"Delete"** and **"Edit"** buttons on the top right of the image. + + @@ -210,6 +222,7 @@ Clicking the **"Edit"** button lets you edit the attributes of the image. + @@ -222,8 +235,9 @@ using the [instructions above](#adding-images). In order to offer the most flexibility, the editor has three modes: - - + + + ### Visual Editor @@ -239,10 +253,10 @@ you'd do in your IDE. This offers less flexibility, in that our components aren' for auto-complete, but it does have two unique advantages. 1. It allows you to edit props of components (see our [limitations below](#current-limitations)) -which is currently not available in **"Visual Editor"** mode yet. + which is currently not available in **"Visual Editor"** mode yet. 2. It allows you to correct syntax errors which might've appeared in your repo that -might not be compatible with **"Visual Editor"** mode until you've fixed them. + might not be compatible with **"Visual Editor"** mode until you've fixed them. ### Diff View