[docs] Add "Overview" page to Material UI docs

docs/data/base/getting-started/overview/overview.md

@@ -5,31 +5,31 @@
 ## Introduction
 
 MUI Base is a library of unstyled React UI components.
-It features the same robust engineering as Material UI, but without implementing Material Design.
+It features the same robust engineering as [Material UI](/material-ui/getting-started/overview/), but without implementing Material Design.
 
 It includes prebuilt components with production-ready functionality, along with low-level hooks for transferring that functionality to other components.
 
-With MUI Base, you can rapidly build on top of our foundational components using any styling solution you choose—no need to override any default style engines or settings.
+With MUI Base, you can rapidly build on top of our foundational components using any styling solution you choose—no need to override any default style engine or theme.
 
-> **Note:** _as of Q2 2022, Base is currently still in alpha._
->
-> We're adding new components regularly, and you're welcome to contribute!
->
-> Look for the [`package: base` label](https://github.com/mui/material-ui/labels/package%3A%20base) on open [issues](https://github.com/mui/material-ui/issues) and [pull requests](https://github.com/mui/material-ui/pulls) in the `@mui/material-ui` repository on GitHub to see what other community members are working on, and feel free to submit your own.
+:::info
+**Note:** _as of Q2 2022, Base is currently still in alpha._
+
+We're adding new components regularly, and you're welcome to contribute!
+
+Look for the [`package: base` label](https://github.com/mui/material-ui/labels/package%3A%20base) on open [issues](https://github.com/mui/material-ui/issues) and [pull requests](https://github.com/mui/material-ui/pulls) in the `@mui/material-ui` GitHub repository to see what other community members are working on, and feel free to submit your own.
+:::
 
 ## Advantages of MUI Base
 
 - **Ship faster:** MUI Base gives you the foundational building blocks you need to assemble a sleek and sophisticated user interface in a fraction of the time that it would take to do it all from scratch.
-
-- **You own the CSS:** unlike Material UI, which uses Emotion as a default style engine, MUI Base has no built-in styling solution.
+- **You own the CSS:** unlike Material UI, which uses emotion as a default style engine, MUI Base has no built-in styling solution.
   This means you have complete control over your app's CSS.
-
 - **Accessibility:** MUI Base components are built with accessibility in mind.
   We do our best to make all components screen reader-friendly, and offer suggestions for optimizing accessibility throughout our documentation.
 
-### MUI Base vs. Material UI
+## MUI Base vs. Material UI
 
-MUI Base features many of the same components as Material UI, but _without the Material Design implementation_.
+MUI Base features many of the same components as [Material UI](/material-ui/getting-started/overview/), but _without the Material Design implementation_.
 
 Base is not packaged with any default theme or built-in style engine.
 This makes it a great choice if you need complete control over how your app's CSS is implemented.

docs/data/material/getting-started/overview/overview.md

@@ -0,0 +1,33 @@
+# Material UI - Overview
+
+<p class="description">Material UI is library of React UI components that implements Google's Material Design.</p>
+
+## Introduction
+
+Material UI is an open-source React component library that implements Google's [Material Design](https://material.io/).
+
+It includes a comprehensive collection of prebuilt components that are ready for use in production right out of the box.
+
+Material UI is beautiful by design, and features a suite of customization options that make it easy to implement your own custom design system on top of our components.
+
+:::info
+Material UI currently supports Material Design v2.
+Adoption of v3 is tentatively planned for Material UI v6.
+You can follow [this GitHub issue](https://github.com/mui/material-ui/issues/29345) for future updates.
+:::
+
+## Advantages of Material UI
+
+- **Ship faster:** thousands of open-source contributors have poured countless hours into these components. Focus on your core business logic—we've got your UI covered.
+- **Beautiful by default:** we're meticulous about our implementation of Material Design, ensuring that every Material UI component meets the highest standards of form and function.
+- **Cross-team collaboration:** Material UI's intuitive developer experience reduces the barrier to entry for back-end devs and less technical designers, empowering teams to collaborate more effectively.
+- **Reliability:** Material UI is almost as old as React itself—its history stretches back to 2014—and we're in this for the long haul. When you build with Material UI, you can count on our community's support for years to come.
+- **Design kits:** streamline your workflow and boost consistency between designers and developers by using our [design kits](https://mui.com/design-kits/) in your favorite design tool.
+
+## Material UI vs. MUI Base
+
+Material UI and [MUI Base](/base/getting-started/overview/) feature many of the same UI components, but MUI Base comes without any default styles or styling solution.
+
+Material UI is _comprehensive_ in that it comes packaged with default styles, and is optimized to work with [Emotion](https://emotion.sh/docs/introduction) (or [styled-components](https://styled-components.com/)).
+
+MUI Base, by contrast, could be considered the "skeletal" or "headless" counterpart to Material UI—in fact, Material UI v6 will use MUI Base components and hooks for its foundational structure.

docs/data/material/pages.ts

@@ -5,6 +5,7 @@ const pages = [
     pathname: '/material-ui/getting-started',
     icon: 'DescriptionIcon',
     children: [
+      { pathname: '/material-ui/getting-started/overview' },
       { pathname: '/material-ui/getting-started/installation' },
       { pathname: '/material-ui/getting-started/usage' },
       { pathname: '/material-ui/getting-started/example-projects' },

docs/pages/material-ui/getting-started/overview.js

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs';
+import {
+  demos,
+  docs,
+  demoComponents,
+} from 'docs/data/material/getting-started/overview/overview.md?@mui/markdown';
+
+export default function Page() {
+  return <MarkdownDocs demos={demos} docs={docs} demoComponents={demoComponents} />;
+}

docs/translations/translations.json

@@ -210,6 +210,7 @@
     "/base/react-textarea-autosize": "Textarea autosize",
     "/base/react-trap-focus": "Trap focus",
     "/material-ui/getting-started": "Getting started",
+    "/material-ui/getting-started/overview": "Overview",
     "/material-ui/getting-started/installation": "Installation",
     "/material-ui/getting-started/usage": "Usage",
     "/material-ui/getting-started/example-projects": "Example projects",