mui · alexfauquette · Sep 15, 2022 · Sep 15, 2022
diff --git a/docs/data/joy/guides/apply-dark-mode/apply-dark-mode-pt.md b/docs/data/joy/guides/apply-dark-mode/apply-dark-mode-pt.md
@@ -66,7 +66,7 @@ const ModeToggle = () => {
 
 ### Avoiding screen flickering
 
-To prevent [the UI of flickering](/joy-ui/core-features/perfect-dark-mode/#current-problem-the-flickering), apply `getInitColorSchemeScript()` before the main application script－it varies across frameworks:
+To prevent [the UI of flickering](/joy-ui/core-features/perfect-dark-mode/#the-current-flickering-problem), apply `getInitColorSchemeScript()` before the main application script－it varies across frameworks:
 
 ### Next.js
 

diff --git a/docs/data/joy/guides/apply-dark-mode/apply-dark-mode-zh.md b/docs/data/joy/guides/apply-dark-mode/apply-dark-mode-zh.md
@@ -66,7 +66,7 @@ const ModeToggle = () => {
 
 ### Avoiding screen flickering
 
-To prevent [the UI of flickering](/joy-ui/core-features/perfect-dark-mode/#current-problem-the-flickering), apply `getInitColorSchemeScript()` before the main application script－it varies across frameworks:
+To prevent [the UI of flickering](/joy-ui/core-features/perfect-dark-mode/#the-current-flickering-problem), apply `getInitColorSchemeScript()` before the main application script－it varies across frameworks:
 
 ### Next.js
 

diff --git a/docs/data/joy/guides/applying-dark-mode/applying-dark-mode-pt.md b/docs/data/joy/guides/applying-dark-mode/applying-dark-mode-pt.md
@@ -66,7 +66,7 @@ This is because the `mode` will only be available to the client-side (it is `und
 
 ### Avoiding screen flickering
 
-To prevent [the UI of flickering](/joy-ui/main-features/perfect-dark-mode/#current-problem-the-flickering), apply `getInitColorSchemeScript()` before the main application script－it varies across frameworks:
+To prevent [the UI of flickering](/joy-ui/main-features/perfect-dark-mode/#the-current-flickering-problem), apply `getInitColorSchemeScript()` before the main application script－it varies across frameworks:
 
 ### Next.js
 

diff --git a/docs/data/joy/guides/applying-dark-mode/applying-dark-mode-zh.md b/docs/data/joy/guides/applying-dark-mode/applying-dark-mode-zh.md
@@ -66,7 +66,7 @@ This is because the `mode` will only be available to the client-side (it is `und
 
 ### Avoiding screen flickering
 
-To prevent [the UI of flickering](/joy-ui/main-features/perfect-dark-mode/#current-problem-the-flickering), apply `getInitColorSchemeScript()` before the main application script－it varies across frameworks:
+To prevent [the UI of flickering](/joy-ui/main-features/perfect-dark-mode/#the-current-flickering-problem), apply `getInitColorSchemeScript()` before the main application script－it varies across frameworks:
 
 ### Next.js
 

diff --git a/docs/data/joy/guides/applying-dark-mode/applying-dark-mode.md b/docs/data/joy/guides/applying-dark-mode/applying-dark-mode.md
@@ -67,7 +67,7 @@ If you try to render your UI based on the server, before mounting on the client,
 
 ### Avoiding screen flickering
 
-To prevent [the UI of flickering](/joy-ui/main-features/perfect-dark-mode/#current-problem-the-flickering), apply `getInitColorSchemeScript()` before the main application script－it varies across frameworks:
+To prevent [the UI of flickering](/joy-ui/main-features/perfect-dark-mode/#the-current-flickering-problem), apply `getInitColorSchemeScript()` before the main application script－it varies across frameworks:
 
 ### Next.js
 

diff --git a/docs/data/material/components/css-baseline/css-baseline-pt.md b/docs/data/material/components/css-baseline/css-baseline-pt.md
@@ -103,11 +103,11 @@ This API is introduced in @mui/material (v5.1.0) for switching between `"light"`
 
 ### Typography
 
-- Nenhum tamanho de fonte base é declarado no `<html>`, mas 16px é assumido (o padrão do navegador). You can learn more about the implications of changing the `<html>` default font size in [the theme documentation](/material-ui/customization/typography/#typography-html-font-size) page.
+- Nenhum tamanho de fonte base é declarado no `<html>`, mas 16px é assumido (o padrão do navegador). You can learn more about the implications of changing the `<html>` default font size in [the theme documentation](/material-ui/customization/typography/#html-font-size) page.
 - Define o estilo `theme.typography.body1` no elemento `<body>`.
 - Define o font-weight para `theme.typography.fontWeightBold` em elementos `<b>` e `<strong>`.
 - Uma customização da suavização da fonte (font-smoothing) é ativada para melhor exibição da fonte Roboto.
 
 ## Customização
 
-Head to the [global customization](/material-ui/customization/how-to-customize/#5-global-css-override) section of the documentation to change the output of these components.
+Head to the [global customization](/material-ui/customization/how-to-customize/#4-global-css-override) section of the documentation to change the output of these components.
diff --git a/docs/data/material/components/css-baseline/css-baseline-zh.md b/docs/data/material/components/css-baseline/css-baseline-zh.md
@@ -103,11 +103,11 @@ This API is introduced in @mui/material (v5.1.0) for switching between `"light"`
 
 ### 文字铸排
 
-- 在 `<html>` 里面不会声明基础的 font-size，但是我们假设是 16px (浏览器的默认设置)。 You can learn more about the implications of changing the `<html>` default font size in [the theme documentation](/material-ui/customization/typography/#typography-html-font-size) page.
+- 在 `<html>` 里面不会声明基础的 font-size，但是我们假设是 16px (浏览器的默认设置)。 You can learn more about the implications of changing the `<html>` default font size in [the theme documentation](/material-ui/customization/typography/#html-font-size) page.
 - 在 `theme.typography.body1` 元素上设置 `<body>` 样式。
 - 您可以通过设置 `theme.typography.fontWeightBold` 来设置 `<b>` 和 `<strong>` 元素的 font-weight。
 - 启用自定义字体平滑功能可以更好地显示 Roboto 字体。
 
 ## Customization 个性化
 
-Head to the [global customization](/material-ui/customization/how-to-customize/#5-global-css-override) section of the documentation to change the output of these components.
+Head to the [global customization](/material-ui/customization/how-to-customize/#4-global-css-override) section of the documentation to change the output of these components.
diff --git a/docs/data/material/components/css-baseline/css-baseline.md b/docs/data/material/components/css-baseline/css-baseline.md
@@ -110,11 +110,11 @@ To enable it, you can set `enableColorScheme=true` as follows:
 ### Typography
 
 - No base font-size is declared on the `<html>`, but 16px is assumed (the browser default).
-  You can learn more about the implications of changing the `<html>` default font size in [the theme documentation](/material-ui/customization/typography/#typography-html-font-size) page.
+  You can learn more about the implications of changing the `<html>` default font size in [the theme documentation](/material-ui/customization/typography/#html-font-size) page.
 - Set the `theme.typography.body1` style on the `<body>` element.
 - Set the font-weight to `theme.typography.fontWeightBold` for the `<b>` and `<strong>` elements.
 - Custom font-smoothing is enabled for better display of the Roboto font.
 
 ## Customization
 
-Head to the [global customization](/material-ui/customization/how-to-customize/#5-global-css-override) section of the documentation to change the output of these components.
+Head to the [global customization](/material-ui/customization/how-to-customize/#4-global-css-override) section of the documentation to change the output of these components.
diff --git a/docs/data/material/components/dialogs/dialogs-pt.md b/docs/data/material/components/dialogs/dialogs-pt.md
@@ -78,7 +78,7 @@ Você pode definir uma largura máxima usando um enumerador na propriedade `maxW
 
 ## Tela cheia responsiva
 
-You may make a dialog responsively full screen using [`useMediaQuery`](/material-ui/react-use-media-query/#usemediaquery).
+You may make a dialog responsively full screen using [`useMediaQuery`](/material-ui/react-use-media-query/).
 
 ```jsx
 import useMediaQuery from '@material-ui/core/useMediaQuery';

diff --git a/docs/data/material/components/dialogs/dialogs-zh.md b/docs/data/material/components/dialogs/dialogs-zh.md
@@ -78,7 +78,7 @@ A Dialog is a type of [modal](/material-ui/react-modal/) window that appears in
 
 ## 响应式全屏
 
-You may make a dialog responsively full screen using [`useMediaQuery`](/material-ui/react-use-media-query/#usemediaquery).
+You may make a dialog responsively full screen using [`useMediaQuery`](/material-ui/react-use-media-query/).
 
 ```jsx
 import useMediaQuery from '@mui/material/useMediaQuery';

diff --git a/docs/data/material/components/dialogs/dialogs.md b/docs/data/material/components/dialogs/dialogs.md
@@ -84,7 +84,7 @@ When the `fullWidth` prop is true, the dialog will adapt based on the `maxWidth`
 
 ## Responsive full-screen
 
-You may make a dialog responsively full screen using [`useMediaQuery`](/material-ui/react-use-media-query/#usemediaquery).
+You may make a dialog responsively full screen using [`useMediaQuery`](/material-ui/react-use-media-query/).
 
 ```jsx
 import useMediaQuery from '@mui/material/useMediaQuery';

diff --git a/docs/data/material/components/icons/icons-pt.md b/docs/data/material/components/icons/icons-pt.md
@@ -55,7 +55,7 @@ Import icons using one of these two options:
   import { AccessAlarm, ThreeDRotation } from '@mui/icons-material';
   ```
 
-The safest for bundle size is Option 1, but some developers prefer Option 2. Make sure you follow the [minimizing bundle size guide](/material-ui/guides/minimizing-bundle-size/#option-2) before using the second approach.
+The safest for bundle size is Option 1, but some developers prefer Option 2. Make sure you follow the [minimizing bundle size guide](/material-ui/guides/minimizing-bundle-size/#option-two-use-a-babel-plugin) before using the second approach.
 
 Each Material icon also has a "theme": Filled (default), Outlined, Rounded, Two-tone, and Sharp. To import the icon component with a theme other than the default, append the theme name to the icon name. For example `@mui/icons-material/Delete` icon with:
 

diff --git a/docs/data/material/components/icons/icons-zh.md b/docs/data/material/components/icons/icons-zh.md
@@ -55,7 +55,7 @@ Import icons using one of these two options:
   import { AccessAlarm, ThreeDRotation } from '@mui/icons-material';
   ```
 
-The safest for bundle size is Option 1, but some developers prefer Option 2. Make sure you follow the [minimizing bundle size guide](/material-ui/guides/minimizing-bundle-size/#option-2) before using the second approach.
+The safest for bundle size is Option 1, but some developers prefer Option 2. Make sure you follow the [minimizing bundle size guide](/material-ui/guides/minimizing-bundle-size/#option-two-use-a-babel-plugin) before using the second approach.
 
 Each Material icon also has a "theme": Filled (default), Outlined, Rounded, Two-tone, and Sharp. To import the icon component with a theme other than the default, append the theme name to the icon name. For example `@mui/icons-material/Delete` icon with:
 

diff --git a/docs/data/material/components/icons/icons.md b/docs/data/material/components/icons/icons.md
@@ -58,7 +58,7 @@ Import icons using one of these two options:
   ```
 
 The safest for bundle size is Option 1, but some developers prefer Option 2.
-Make sure you follow the [minimizing bundle size guide](/material-ui/guides/minimizing-bundle-size/#option-2) before using the second approach.
+Make sure you follow the [minimizing bundle size guide](/material-ui/guides/minimizing-bundle-size/#option-two-use-a-babel-plugin) before using the second approach.
 
 Each Material icon also has a "theme": Filled (default), Outlined, Rounded, Two-tone, and Sharp. To import the icon component with a theme other than the default, append the theme name to the icon name. For example `@mui/icons-material/Delete` icon with:
 

diff --git a/docs/data/material/components/use-media-query/use-media-query-pt.md b/docs/data/material/components/use-media-query/use-media-query-pt.md
@@ -19,7 +19,7 @@ Algumas das principais características:
 
 ## Consulta de mídia simples
 
-Você deve fornecer uma consulta de mídia ao primeiro argumento do hook. The media query string can be any valid CSS media query, e.g. [`'(prefers-color-scheme: dark)'`](/material-ui/customization/palette/#user-preference).
+Você deve fornecer uma consulta de mídia ao primeiro argumento do hook. The media query string can be any valid CSS media query, e.g. [`'(prefers-color-scheme: dark)'`](/material-ui/customization/dark-mode/#system-preference).
 
 {{"demo": "SimpleMediaQuery.js", "defaultCodeOpen": true}}
 

diff --git a/docs/data/material/components/use-media-query/use-media-query-zh.md b/docs/data/material/components/use-media-query/use-media-query-zh.md
@@ -19,7 +19,7 @@ githubLabel: 'hook: useMediaQuery'
 
 ## 简单的媒体查询
 
-你应该将媒体查询提供给 hook 作为第一个参数。 The media query string can be any valid CSS media query, e.g. [`'(prefers-color-scheme: dark)'`](/material-ui/customization/palette/#user-preference).
+你应该将媒体查询提供给 hook 作为第一个参数。 The media query string can be any valid CSS media query, e.g. [`'(prefers-color-scheme: dark)'`](/material-ui/customization/dark-mode/#system-preference).
 
 {{"demo": "SimpleMediaQuery.js", "defaultCodeOpen": true}}
 

diff --git a/docs/data/material/components/use-media-query/use-media-query.md b/docs/data/material/components/use-media-query/use-media-query.md
@@ -20,7 +20,7 @@ Some of the key features:
 ## Basic media query
 
 You should provide a media query to the first argument of the hook.
-The media query string can be any valid CSS media query, e.g. [`'(prefers-color-scheme: dark)'`](/material-ui/customization/palette/#user-preference).
+The media query string can be any valid CSS media query, e.g. [`'(prefers-color-scheme: dark)'`](/material-ui/customization/dark-mode/#system-preference).
 
 {{"demo": "SimpleMediaQuery.js", "defaultCodeOpen": true}}
 

diff --git a/docs/data/material/customization/color/color-pt.md b/docs/data/material/customization/color/color-pt.md
@@ -46,7 +46,7 @@ Para testar um esquema de cores do [material.io/design/color](https://material.i
 
 {{"demo": "ColorTool.js", "hideToolbar": true, "bg": true}}
 
-The output shown in the color sample can be pasted directly into a [`createTheme()`](/material-ui/customization/theming/#createtheme-options-theme) function (to be used with [`ThemeProvider`](/material-ui/customization/theming/#theme-provider)):
+The output shown in the color sample can be pasted directly into a [`createTheme()`](/material-ui/customization/theming/#createtheme-options-args-theme) function (to be used with [`ThemeProvider`](/material-ui/customization/theming/#theme-provider)):
 
 ```jsx
 import { createTheme } from '@material-ui/core/styles';

diff --git a/docs/data/material/customization/color/color-zh.md b/docs/data/material/customization/color/color-zh.md
@@ -46,7 +46,7 @@ const theme = createTheme({
 
 {{"demo": "ColorTool.js", "hideToolbar": true, "bg": true}}
 
-The output shown in the color sample can be pasted directly into a [`createTheme()`](/material-ui/customization/theming/#createtheme-options-theme) function (to be used with [`ThemeProvider`](/material-ui/customization/theming/#theme-provider)):
+The output shown in the color sample can be pasted directly into a [`createTheme()`](/material-ui/customization/theming/#createtheme-options-args-theme) function (to be used with [`ThemeProvider`](/material-ui/customization/theming/#theme-provider)):
 
 ```jsx
 import { createTheme } from '@mui/core/styles';

diff --git a/docs/data/material/customization/color/color.md b/docs/data/material/customization/color/color.md
@@ -47,7 +47,7 @@ Alternatively, you can enter hex values in the Primary and Secondary text fields
 
 {{"demo": "ColorTool.js", "hideToolbar": true, "bg": true}}
 
-The output shown in the color sample can be pasted directly into a [`createTheme()`](/material-ui/customization/theming/#createtheme-options-theme) function (to be used with [`ThemeProvider`](/material-ui/customization/theming/#theme-provider)):
+The output shown in the color sample can be pasted directly into a [`createTheme()`](/material-ui/customization/theming/#createtheme-options-args-theme) function (to be used with [`ThemeProvider`](/material-ui/customization/theming/#theme-provider)):
 
 ```jsx
 import { createTheme } from '@mui/material/styles';

diff --git a/docs/data/material/customization/theming/theming-pt.md b/docs/data/material/customization/theming/theming-pt.md
@@ -30,7 +30,7 @@ Você pode conferir a [seção do tema padrão](/material-ui/customization/defau
 
 ### Variáveis customizáveis
 
-When using MUI's theme with [MUI System](/system/getting-started/overview/) or [any other styling solution](/material-ui/guides/interoperability/#themeprovider), it can be convenient to add additional variables to the theme so you can use them everywhere. Por exemplo:
+When using MUI's theme with [MUI System](/system/getting-started/overview/) or [any other styling solution](/material-ui/guides/interoperability/), it can be convenient to add additional variables to the theme so you can use them everywhere. Por exemplo:
 
 ```jsx
 const theme = createTheme({

diff --git a/docs/data/material/customization/theming/theming-zh.md b/docs/data/material/customization/theming/theming-zh.md
@@ -30,7 +30,7 @@ You can check out the [default theme section](/material-ui/customization/default
 
 ### 自定义变量
 
-When using MUI's theme with [MUI System](/system/getting-started/overview/) or [any other styling solution](/material-ui/guides/interoperability/#themeprovider), it can be convenient to add additional variables to the theme so you can use them everywhere. For instance:
+When using MUI's theme with [MUI System](/system/getting-started/overview/) or [any other styling solution](/material-ui/guides/interoperability/), it can be convenient to add additional variables to the theme so you can use them everywhere. For instance:
 
 ```jsx
 const theme = createTheme({

diff --git a/docs/data/material/customization/theming/theming.md b/docs/data/material/customization/theming/theming.md
@@ -33,7 +33,7 @@ You can check out the [default theme section](/material-ui/customization/default
 
 ### Custom variables
 
-When using MUI's theme with [MUI System](/system/getting-started/overview/) or [any other styling solution](/material-ui/guides/interoperability/#themeprovider), it can be convenient to add additional variables to the theme so you can use them everywhere.
+When using MUI's theme with [MUI System](/system/getting-started/overview/) or [any other styling solution](/material-ui/guides/interoperability/), it can be convenient to add additional variables to the theme so you can use them everywhere.
 For instance:
 
 ```jsx

diff --git a/docs/data/material/getting-started/installation/installation-pt.md b/docs/data/material/getting-started/installation/installation-pt.md
@@ -49,7 +49,7 @@ Material UI foi projetado com a fonte [Roboto](https://fonts.google.com/specimen
 
 ## Ícones de fonte
 
-To use the font `Icon` component, you must first add the [Material Icons](https://fonts.google.com/icons?icon.set=Material+Icons) font. Here are [some instructions](/material-ui/icons/#font-icons) on how to do so. For instance, via Google Web Fonts:
+To use the font `Icon` component, you must first add the [Material Icons](https://fonts.google.com/icons?icon.set=Material+Icons) font. Here are [some instructions](/material-ui/icons/#icon-font-icons) on how to do so. For instance, via Google Web Fonts:
 
 ```html
 <link

diff --git a/docs/data/material/getting-started/installation/installation-zh.md b/docs/data/material/getting-started/installation/installation-zh.md
@@ -49,7 +49,7 @@ Material UI was designed with the [Roboto](https://fonts.google.com/specimen/Rob
 
 ## 字体图标
 
-To use the font `Icon` component, you must first add the [Material Icons](https://fonts.google.com/icons?icon.set=Material+Icons) font. Here are [some instructions](/material-ui/icons/#font-icons) on how to do so. For instance, via Google Web Fonts:
+To use the font `Icon` component, you must first add the [Material Icons](https://fonts.google.com/icons?icon.set=Material+Icons) font. Here are [some instructions](/material-ui/icons/#icon-font-icons) on how to do so. For instance, via Google Web Fonts:
 
 ```html
 <link

diff --git a/docs/data/material/getting-started/installation/installation.md b/docs/data/material/getting-started/installation/installation.md
@@ -52,7 +52,7 @@ For instance, via Google Web Fonts:
 ## Font icons
 
 To use the font `Icon` component, you must first add the [Material Icons](https://fonts.google.com/icons?icon.set=Material+Icons) font.
-Here are [some instructions](/material-ui/icons/#font-icons)
+Here are [some instructions](/material-ui/icons/#icon-font-icons)
 on how to do so.
 For instance, via Google Web Fonts:
 

diff --git a/docs/data/material/guides/interoperability/interoperability-pt.md b/docs/data/material/guides/interoperability/interoperability-pt.md
@@ -124,7 +124,7 @@ export default function PlainCssSliderDeep1() {
 }
 ```
 
-The above demo relies on the [default `className` values](/system/styles/advanced/#with-material-ui-core), but you can provide your own class name with the `componentsProps` API.
+The above demo relies on the [default `className` values](/system/styles/advanced/), but you can provide your own class name with the `componentsProps` API.
 
 **PlainCssSliderDeep2.css**
 
@@ -165,7 +165,7 @@ export default function PlainCssSliderDeep2() {
 
 ## CSS global
 
-Fornecer explicitamente os nomes das classes ao componente é um esforço excessivo? [You can target the class names generated by MUI](/system/styles/advanced/#with-material-ui-core).
+Fornecer explicitamente os nomes das classes ao componente é um esforço excessivo? [You can target the class names generated by MUI](/system/styles/advanced/).
 
 [![Botão editar](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/global-classnames-dho8k)
 
@@ -331,7 +331,7 @@ Os exemplos a seguir substituem o estilo de `thumb` do controle slider, além do
 
 {{"demo": "StyledComponentsDeep.js", "defaultCodeOpen": true}}
 
-The above demo relies on the [default `className` values](/system/styles/advanced/#with-material-ui-core), but you can provide your own class name with the `componentsProps` API.
+The above demo relies on the [default `className` values](/system/styles/advanced/), but you can provide your own class name with the `componentsProps` API.
 
 ```jsx
 import * as React from 'react';
@@ -534,7 +534,7 @@ export default function CssModulesSliderDeep1() {
 }
 ```
 
-The above demo relies on the [default `className` values](/system/styles/advanced/#with-material-ui-core), but you can provide your own class name with the `componentsProps` API.
+The above demo relies on the [default `className` values](/system/styles/advanced/), but you can provide your own class name with the `componentsProps` API.
 
 **CssModulesSliderDeep2.module.css**