From 916b760e40ae174302d8a326d7bfcd8b0b80bed4 Mon Sep 17 00:00:00 2001 From: Emmanuel Ferdman Date: Thu, 21 Sep 2023 14:27:03 +0300 Subject: [PATCH] [docs] refine links pointing to standardized examples --- .../working-with-tailwind-css-pt.md | 2 +- .../working-with-tailwind-css-zh.md | 2 +- .../example-projects/example-projects-zh.md | 16 ++++++++-------- .../interoperability/interoperability-pt.md | 6 +++--- .../interoperability/interoperability-zh.md | 6 +++--- docs/data/material/guides/routing/routing-pt.md | 4 ++-- docs/data/material/guides/routing/routing-zh.md | 4 ++-- .../styled-components/styled-components-pt.md | 4 ++-- .../styled-components/styled-components-zh.md | 4 ++-- .../material/guides/typescript/typescript-pt.md | 4 ++-- .../material/guides/typescript/typescript-zh.md | 2 +- .../migration-v4/migrating-from-jss-pt.md | 2 +- .../migration-v4/migrating-from-jss-zh.md | 2 +- .../migration/migration-v4/migration-v4-pt.md | 2 +- .../migration/migration-v4/migration-v4-zh.md | 2 +- docs/data/styles/advanced/advanced-pt.md | 4 ++-- docs/data/styles/advanced/advanced-zh.md | 4 ++-- 17 files changed, 35 insertions(+), 35 deletions(-) diff --git a/docs/data/base/guides/working-with-tailwind-css/working-with-tailwind-css-pt.md b/docs/data/base/guides/working-with-tailwind-css/working-with-tailwind-css-pt.md index 39cdb2cd74e31f..875e61de9ef85d 100644 --- a/docs/data/base/guides/working-with-tailwind-css/working-with-tailwind-css-pt.md +++ b/docs/data/base/guides/working-with-tailwind-css/working-with-tailwind-css-pt.md @@ -489,4 +489,4 @@ These are the things we covered in this guide: ✅ How to create custom components for specific slots in more complex customization scenarios. We used the `component` prop to pass them into the parent component.\ ✅ How to apply conditional styling based on the owner component's state using a callback as value for the `componentsProps` prop. -Get all the code used in this guide in the [Base UI with Tailwind CSS](https://github.com/mui/material-ui/tree/master/examples/base-ui-cra-tailwind-ts) example project. +Get all the code used in this guide in the [Base UI with Tailwind CSS](https://github.com/mui/material-ui/tree/master/examples/base-ui-cra-ts) example project. diff --git a/docs/data/base/guides/working-with-tailwind-css/working-with-tailwind-css-zh.md b/docs/data/base/guides/working-with-tailwind-css/working-with-tailwind-css-zh.md index dc68b799506ba1..875e61de9ef85d 100644 --- a/docs/data/base/guides/working-with-tailwind-css/working-with-tailwind-css-zh.md +++ b/docs/data/base/guides/working-with-tailwind-css/working-with-tailwind-css-zh.md @@ -489,4 +489,4 @@ These are the things we covered in this guide: ✅ How to create custom components for specific slots in more complex customization scenarios. We used the `component` prop to pass them into the parent component.\ ✅ How to apply conditional styling based on the owner component's state using a callback as value for the `componentsProps` prop. -Get all the code used in this guide in the [Base UI with Tailwind CSS](https://github.com/mui/material-ui/tree/master/examples/base-cra-ts) example project. +Get all the code used in this guide in the [Base UI with Tailwind CSS](https://github.com/mui/material-ui/tree/master/examples/base-ui-cra-ts) example project. diff --git a/docs/data/material/getting-started/example-projects/example-projects-zh.md b/docs/data/material/getting-started/example-projects/example-projects-zh.md index c9464b82b4661d..e8c10842dce57d 100644 --- a/docs/data/material/getting-started/example-projects/example-projects-zh.md +++ b/docs/data/material/getting-started/example-projects/example-projects-zh.md @@ -10,15 +10,15 @@ - [Next.js](https://github.com/mui/material-ui/tree/next/examples/nextjs) （[TypeScript 版本](https://github.com/mui/material-ui/tree/next/examples/nextjs-with-typescript)） - [Create React App](https://github.com/mui/material-ui/tree/next/examples/create-react-app) （[TypeScript 版本](https://github.com/mui/material-ui/tree/next/examples/create-react-app-with-typescript)） -- [Remix](https://github.com/mui/material-ui/tree/master/examples/material-remix-ts) -- [Gatsby](https://github.com/mui/material-ui/tree/master/examples/material-gatsby) -- [Preact](https://github.com/mui/material-ui/tree/master/examples/material-preact) -- [CDN](https://github.com/mui/material-ui/tree/master/examples/material-via-cdn) -- [Plain server-side](https://github.com/mui/material-ui/tree/master/examples/material-express-ssr) -- [Tailwind CSS](https://github.com/mui/material-ui/tree/master/examples/material-cra-tailwind-ts) +- [Remix](https://github.com/mui/material-ui/tree/master/examples/material-ui-remix-ts) +- [Gatsby](https://github.com/mui/material-ui/tree/master/examples/material-ui-gatsby) +- [Preact](https://github.com/mui/material-ui/tree/master/examples/material-ui-preact) +- [CDN](https://github.com/mui/material-ui/tree/master/examples/material-ui-via-cdn) +- [Plain server-side](https://github.com/mui/material-ui/tree/master/examples/material-ui-express-ssr) +- [Tailwind CSS](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-tailwind-ts) - [Vite.js](https://github.com/mui/material-ui/tree/master/examples/material-vite) -- [Use styled-components as style engine](https://github.com/mui/material-ui/tree/master/examples/material-cra-styled-components) ([TypeScript version](https://github.com/mui/material-ui/tree/master/examples/material-cra-styled-components-ts)) -- [Next.js + @mui/styles (v4 migration helper)](https://github.com/mui/material-ui/tree/master/examples/material-next-ts-v4-v5-migration) +- [Use styled-components as style engine](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-styled-components-ts) ([TypeScript version](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-styled-components-ts)) +- [Next.js + @mui/styles (v4 migration helper)](https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs-ts-v4-v5-migration) Create React App 是一个很棒的学习 React 的项目。 Have a look at [the alternatives available](https://github.com/facebook/create-react-app/blob/HEAD/README.md#popular-alternatives) to see which project best fits your needs. diff --git a/docs/data/material/guides/interoperability/interoperability-pt.md b/docs/data/material/guides/interoperability/interoperability-pt.md index 8e4c3d07dceb77..243ea952ef1af8 100644 --- a/docs/data/material/guides/interoperability/interoperability-pt.md +++ b/docs/data/material/guides/interoperability/interoperability-pt.md @@ -295,8 +295,8 @@ If, however, you would like to use styled-components, you can configure your app -- [Create React App with styled-components](https://github.com/mui/material-ui/tree/master/examples/material-cra-styled-components) -- [Create React App with styled-components and typescript](https://github.com/mui/material-ui/tree/master/examples/material-cra-styled-components-ts) +- [Create React App with styled-components](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-styled-components-ts) +- [Create React App with styled-components and typescript](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-styled-components-ts) After the style engine is configured properly, you can use the [`styled()`](/system/styled/) utility from `@material-ui/core/styles` and have direct access to the theme. @@ -599,7 +599,7 @@ It works exactly like styled components. You can [use the same guide](/material- ### Setup -If you are used to Tailwind CSS and want to use it together with the MUI components, you can start by cloning the [Tailwind CSS](https://github.com/mui/material-ui/tree/master/examples/material-cra-tailwind-ts) example project. If you use a different framework, or already have set up your project, follow these steps: +If you are used to Tailwind CSS and want to use it together with the MUI components, you can start by cloning the [Tailwind CSS](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-tailwind-ts) example project. If you use a different framework, or already have set up your project, follow these steps: 1. Add Tailwind CSS to your project, following the instructions in https://tailwindcss.com/docs/installation. 2. Remove [Tailwind CSS's preflight](https://tailwindcss.com/docs/preflight) style so it can use the MUI's preflight instead ([CssBaseline](/material-ui/react-css-baseline/)). diff --git a/docs/data/material/guides/interoperability/interoperability-zh.md b/docs/data/material/guides/interoperability/interoperability-zh.md index 0aaa8dafbb421a..d31dc35fcd2c7e 100644 --- a/docs/data/material/guides/interoperability/interoperability-zh.md +++ b/docs/data/material/guides/interoperability/interoperability-zh.md @@ -292,8 +292,8 @@ If, however, you would like to use styled-components, you can configure your app -- [Create React App with styled-components](https://github.com/mui/material-ui/tree/master/examples/material-cra-styled-components) -- [Create React App with styled-components and typescript](https://github.com/mui/material-ui/tree/master/examples/material-cra-styled-components-ts) +- [Create React App with styled-components](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-styled-components-ts) +- [Create React App with styled-components and typescript](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-styled-components-ts) After the style engine is configured properly, you can use the [`styled()`](/system/styled/) utility from `@mui/core/styles` and have direct access to the theme. @@ -593,7 +593,7 @@ It works exactly like styled components. You can [use the same guide](/material- ### Setup -If you are used to Tailwind CSS and want to use it together with the MUI components, you can start by cloning the [Tailwind CSS](https://github.com/mui/material-ui/tree/master/examples/material-cra-tailwind-ts) example project. If you use a different framework, or already have set up your project, follow these steps: +If you are used to Tailwind CSS and want to use it together with the MUI components, you can start by cloning the [Tailwind CSS](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-tailwind-ts) example project. If you use a different framework, or already have set up your project, follow these steps: 1. Add Tailwind CSS to your project, following the instructions in https://tailwindcss.com/docs/installation. 2. Remove [Tailwind CSS's preflight](https://tailwindcss.com/docs/preflight) style so it can use the MUI's preflight instead ([CssBaseline](/material-ui/react-css-baseline/)). diff --git a/docs/data/material/guides/routing/routing-pt.md b/docs/data/material/guides/routing/routing-pt.md index 57c3fd57265fd7..b305c19fe728fa 100644 --- a/docs/data/material/guides/routing/routing-pt.md +++ b/docs/data/material/guides/routing/routing-pt.md @@ -85,9 +85,9 @@ const LinkBehavior = React.forwardRef((props, ref) => ( ### Next.js -Next.js has [a custom Link component](https://nextjs.org/docs/api-reference/next/link). The [example folder](https://github.com/mui/material-ui/tree/HEAD/examples/material-next-ts) provides adapters for usage with MUI. +Next.js has [a custom Link component](https://nextjs.org/docs/api-reference/next/link). The [example folder](https://github.com/mui/material-ui/tree/HEAD/examples/material-ui-nextjs-pages-router-ts) provides adapters for usage with MUI. -- The first version of the adapter is the [`NextLinkComposed`](https://github.com/mui/material-ui/blob/HEAD/examples/material-next-ts/src/Link.tsx) component. Este componente não tem estilo e é o único responsável pelo manuseio da navegação. The prop `href` was renamed `to` to avoid a naming conflict. This is similar to react-router's Link component. +- The first version of the adapter is the [`NextLinkComposed`](https://github.com/mui/material-ui/blob/HEAD/examples/material-ui-nextjs-pages-router-ts/src/Link.tsx) component. Este componente não tem estilo e é o único responsável pelo manuseio da navegação. The prop `href` was renamed `to` to avoid a naming conflict. This is similar to react-router's Link component. ```tsx import Button from '@material-ui/core/Button'; diff --git a/docs/data/material/guides/routing/routing-zh.md b/docs/data/material/guides/routing/routing-zh.md index 99e8a698907baa..9967a240ad6b45 100644 --- a/docs/data/material/guides/routing/routing-zh.md +++ b/docs/data/material/guides/routing/routing-zh.md @@ -83,9 +83,9 @@ In real-life applications, using a native element is rarely eno ### Next.js -Next.js has [a custom Link component](https://nextjs.org/docs/api-reference/next/link). The [example folder](https://github.com/mui/material-ui/tree/HEAD/examples/material-next-ts) provides adapters for usage with MUI. +Next.js has [a custom Link component](https://nextjs.org/docs/api-reference/next/link). The [example folder](https://github.com/mui/material-ui/tree/HEAD/examples/material-ui-nextjs-pages-router-ts) provides adapters for usage with MUI. -- The first version of the adapter is the [`NextLinkComposed`](https://github.com/mui/material-ui/tree/HEAD/examples/material-next-ts/src/Link.tsx) component. This component is unstyled and only responsible for handling the navigation. The prop `href` was renamed `to` to avoid a naming conflict. This is similar to react-router's Link component. +- The first version of the adapter is the [`NextLinkComposed`](https://github.com/mui/material-ui/tree/HEAD/examples/material-ui-nextjs-pages-router-ts/src/Link.tsx) component. This component is unstyled and only responsible for handling the navigation. The prop `href` was renamed `to` to avoid a naming conflict. This is similar to react-router's Link component. ```tsx import Button from '@mui/material/Button'; diff --git a/docs/data/material/guides/styled-components/styled-components-pt.md b/docs/data/material/guides/styled-components/styled-components-pt.md index d279756df3e74a..098af2accd55e0 100644 --- a/docs/data/material/guides/styled-components/styled-components-pt.md +++ b/docs/data/material/guides/styled-components/styled-components-pt.md @@ -98,8 +98,8 @@ If you are using create-react-app, there is a ready-to-use template in the examp -- [create-react-app](https://github.com/mui/material-ui/tree/master/examples/material-cra-styled-components) -- [create-react-app with TypeScript](https://github.com/mui/material-ui/tree/master/examples/material-cra-styled-components-ts) +- [create-react-app](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-styled-components-ts) +- [create-react-app with TypeScript](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-styled-components-ts) - [and many others](https://github.com/mui/material-ui/tree/master/examples) :::warning diff --git a/docs/data/material/guides/styled-components/styled-components-zh.md b/docs/data/material/guides/styled-components/styled-components-zh.md index 6f2fdd46eeba73..785d5613f65e24 100644 --- a/docs/data/material/guides/styled-components/styled-components-zh.md +++ b/docs/data/material/guides/styled-components/styled-components-zh.md @@ -83,8 +83,8 @@ If you are using create-react-app, there is a ready-to-use template in the examp -- [create-react-app](https://github.com/mui/material-ui/tree/master/examples/material-cra-styled-components) -- [使用 TypeScript 来 create-react-app](https://github.com/mui/material-ui/tree/master/examples/material-cra-styled-components-ts) +- [create-react-app](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-styled-components-ts) +- [使用 TypeScript 来 create-react-app](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-styled-components-ts) - [其他模板](https://github.com/mui/material-ui/tree/master/examples) :::warning diff --git a/docs/data/material/guides/typescript/typescript-pt.md b/docs/data/material/guides/typescript/typescript-pt.md index 3e6282fc4c2691..b5621414a39171 100644 --- a/docs/data/material/guides/typescript/typescript-pt.md +++ b/docs/data/material/guides/typescript/typescript-pt.md @@ -6,9 +6,9 @@ -Material-UI requires a minimum version of TypeScript 3.5. Have a look at the [Create React App with TypeScript](https://github.com/mui/material-ui/tree/master/examples/material-cra-ts) example. +Material-UI requires a minimum version of TypeScript 3.5. Have a look at the [Create React App with TypeScript](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-ts) example. -Dê uma olhada no exemplo [Create React App com TypeScript](https://github.com/mui/material-ui/tree/master/examples/material-cra-ts). +Dê uma olhada no exemplo [Create React App com TypeScript](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-ts). ```json { diff --git a/docs/data/material/guides/typescript/typescript-zh.md b/docs/data/material/guides/typescript/typescript-zh.md index 384ccfabad2a2b..7900841e35ba0a 100644 --- a/docs/data/material/guides/typescript/typescript-zh.md +++ b/docs/data/material/guides/typescript/typescript-zh.md @@ -6,7 +6,7 @@ -MUI requires a minimum version of TypeScript 3.5. Material-UI requires a minimum version of TypeScript 3.5. 请查看一下 [Create React App with TypeScript](https://github.com/mui/material-ui/tree/master/examples/material-cra-ts) 的例子。 +MUI requires a minimum version of TypeScript 3.5. Material-UI requires a minimum version of TypeScript 3.5. 请查看一下 [Create React App with TypeScript](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-ts) 的例子。 请查看 [Create React App with TypeScript](https://github.com/mui/material-ui/tree/next/examples/create-react-app-with-typescript) 的例子。 diff --git a/docs/data/material/migration/migration-v4/migrating-from-jss-pt.md b/docs/data/material/migration/migration-v4/migrating-from-jss-pt.md index 8a177d8b92d791..ee651252c59e7f 100644 --- a/docs/data/material/migration/migration-v4/migrating-from-jss-pt.md +++ b/docs/data/material/migration/migration-v4/migrating-from-jss-pt.md @@ -17,7 +17,7 @@ One of the biggest changes in v5 is the replacement of JSS for [Emotion](https:/ Note that you may continue to use JSS for adding overrides for the components (e.g. `makeStyles`, `withStyles`) even after migrating to v5. Then, if at any point you want to move over to the new styling engine, you can refactor your components progressively. :::info -If you are using Next.js and you are not sure how to configure SSR to work with both Emotion & JSS, take a look a this [example project](https://github.com/mui/material-ui/tree/master/examples/material-next-ts-v4-v5-migration). +If you are using Next.js and you are not sure how to configure SSR to work with both Emotion & JSS, take a look a this [example project](https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs-ts-v4-v5-migration). ::: This document reviews all the steps necessary to migrate away from JSS. diff --git a/docs/data/material/migration/migration-v4/migrating-from-jss-zh.md b/docs/data/material/migration/migration-v4/migrating-from-jss-zh.md index 6c05447677ea63..ce3ec13d749769 100644 --- a/docs/data/material/migration/migration-v4/migrating-from-jss-zh.md +++ b/docs/data/material/migration/migration-v4/migrating-from-jss-zh.md @@ -17,7 +17,7 @@ v5中最大的变化之一是将JSS替换为[Emotion](https://emotion.sh/docs/in 请注意，你可以继续使用JSS为组件添加重写（例如`makeStyles`, `withStyles`），即使在迁移到v5之后。 然后，如果在任何时候你想转移到新的样式引擎，你可以逐步重构你的组件。 :::info -如果你正在使用Next.js，并且不确定如何配置SSR以与Emotion和JSS一起工作，可以看一下这个[例子项目](https://github.com/mui/material-ui/tree/master/examples/material-next-ts-v4-v5-migration)。 +如果你正在使用Next.js，并且不确定如何配置SSR以与Emotion和JSS一起工作，可以看一下这个[例子项目](https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs-ts-v4-v5-migration)。 ::: 本文档回顾了从JSS迁移的所有必要步骤。 diff --git a/docs/data/material/migration/migration-v4/migration-v4-pt.md b/docs/data/material/migration/migration-v4/migration-v4-pt.md index 1d17aefffcfbc2..c8150c03204065 100644 --- a/docs/data/material/migration/migration-v4/migration-v4-pt.md +++ b/docs/data/material/migration/migration-v4/migration-v4-pt.md @@ -27,7 +27,7 @@ Need to refer back to an older version of the docs? Check out [the v4 documentat ::: :::info -If you are using Next.js and you are not sure how to configure SSR to work with both Emotion & JSS, take a look a this [example project](https://github.com/mui/material-ui/tree/master/examples/material-next-ts-v4-v5-migration). +If you are using Next.js and you are not sure how to configure SSR to work with both Emotion & JSS, take a look a this [example project](https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs-ts-v4-v5-migration). ::: ## Why you should migrate diff --git a/docs/data/material/migration/migration-v4/migration-v4-zh.md b/docs/data/material/migration/migration-v4/migration-v4-zh.md index adf436836fce57..ac5e2b2c1b8489 100644 --- a/docs/data/material/migration/migration-v4/migration-v4-zh.md +++ b/docs/data/material/migration/migration-v4/migration-v4-zh.md @@ -26,7 +26,7 @@ V5最大的变化之一是将JSS替换为[Emotion](https://emotion.sh/docs/intro 需要参考旧版本的文档吗？ 在这里查看[v4的文档](https://v4.mui.com/) ::: -如果你正在使用Next.js，并且不确定如何配置SSR以与Emotion 和 JSS一起工作，请看这个[例子项目](https://github.com/mui/material-ui/tree/master/examples/material-next-ts-v4-v5-migration) +如果你正在使用Next.js，并且不确定如何配置SSR以与Emotion 和 JSS一起工作，请看这个[例子项目](https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs-ts-v4-v5-migration) ::: ## 为什么你应该迁移 diff --git a/docs/data/styles/advanced/advanced-pt.md b/docs/data/styles/advanced/advanced-pt.md index 3f65af9214edac..fb35a10f3b02ea 100644 --- a/docs/data/styles/advanced/advanced-pt.md +++ b/docs/data/styles/advanced/advanced-pt.md @@ -394,7 +394,7 @@ Existe [um plugin oficial Gatsby](https://github.com/hupe1980/gatsby-plugin-mate -Refer to [this example Gatsby project](https://github.com/mui/material-ui/tree/master/examples/material-gatsby) for an up-to-date usage example. +Refer to [this example Gatsby project](https://github.com/mui/material-ui/tree/master/examples/material-ui-gatsby) for an up-to-date usage example. ### Next.js @@ -402,7 +402,7 @@ Você precisa ter um `pages/_document.js` customizado, então copie [esta lógic -Refer to [this example project](https://github.com/mui/material-ui/tree/master/examples/material-next) for an up-to-date usage example. +Refer to [this example project](https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs-pages-router-ts) for an up-to-date usage example. ## Nomes de classes diff --git a/docs/data/styles/advanced/advanced-zh.md b/docs/data/styles/advanced/advanced-zh.md index 102da4185b648d..90aa27e890a442 100644 --- a/docs/data/styles/advanced/advanced-zh.md +++ b/docs/data/styles/advanced/advanced-zh.md @@ -407,7 +407,7 @@ function render() { -请参考 [这个Gatsby项目的例子](https://github.com/mui/material-ui/tree/master/examples/material-gatsby)，了解最新的使用范例。 +请参考 [这个Gatsby项目的例子](https://github.com/mui/material-ui/tree/master/examples/material-ui-gatsby)，了解最新的使用范例。 ### Next.js @@ -415,7 +415,7 @@ function render() { -请参考[这个例子项目](https://github.com/mui/material-ui/tree/master/examples/material-next)，了解最新的使用范例。 +请参考[这个例子项目](https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs-pages-router-ts)，了解最新的使用范例。 ## 类名（Class names）