Skip to content

Commit

Permalink
[core] Improve DX when browsing the package on npm and GitHub
Browse files Browse the repository at this point in the history
1. Set logo height to fix layout shift in GitHub

Open https://github.com/mui/material-ui/tree/ab2e0574c8180b0af833c3a926873ccf3f50083c#readme
and see how the layout moves when the logo loads.
  • Loading branch information
oliviertassinari committed Sep 10, 2023
1 parent ab2e057 commit 8087943
Show file tree
Hide file tree
Showing 34 changed files with 41 additions and 557 deletions.
50 changes: 8 additions & 42 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,24 +1,22 @@
<!-- markdownlint-disable-next-line -->
<p align="center">
<a href="https://mui.com/" rel="noopener" target="_blank"><img width="150" src="/docs/public/static/logo.svg" alt="MUI logo"></a>
<a href="https://mui.com/core/" rel="noopener" target="_blank"><img width="150" height="133" src="/docs/public/static/logo.svg" alt="MUI Core logo"></a>
</p>

<h1 align="center">MUI Core</h1>

**MUI Core** contains foundational React UI component libraries for shipping new features faster.
**MUI Core** contains foundational React UI component libraries for shipping new features faster:

- [_Material UI_](https://mui.com/material-ui/getting-started/) is a comprehensive library of components that features our implementation of Google's [Material Design](https://m2.material.io/design/introduction/) system.
- [Material UI](https://mui.com/material-ui/) is a comprehensive library of components that features our implementation of Google's [Material Design](https://m2.material.io/design/introduction/) system.

- [_Joy UI_](https://mui.com/joy-ui/getting-started/) is a beautifully designed library of React UI components.
- [Joy UI](https://mui.com/joy-ui/getting-started/) is a library of beautifully designed React UI components built to spark joy.

- [_Base UI_](https://mui.com/base-ui/getting-started/) is our library of "unstyled" components and low-level hooks. With Base, you gain complete control over your app's CSS and accessibility features.
- [Base UI](https://mui.com/base-ui/) is a library of unstyled React UI components and hooks. With Base UI, you gain complete control over your app's CSS and accessibility features.

- [_MUI System_](https://mui.com/system/getting-started/) is a collection of CSS utilities to help you rapidly lay out custom designs.
- [MUI System](https://mui.com/system/getting-started/) is a collection of CSS utilities to help you rapidly lay out custom designs.

<div align="center">

**[Stable channel v5](https://mui.com/)**

[![license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/mui/material-ui/blob/HEAD/LICENSE)
[![npm latest package](https://img.shields.io/npm/v/@mui/material/latest.svg)](https://www.npmjs.com/package/@mui/material)
[![npm next package](https://img.shields.io/npm/v/@mui/material/next.svg)](https://www.npmjs.com/package/@mui/material)
Expand All @@ -39,18 +37,10 @@

Material UI is available as an [npm package](https://www.npmjs.com/package/@mui/material).

**npm:**

```bash
npm install @mui/material @emotion/react @emotion/styled
```

**yarn:**

```bash
yarn add @mui/material @emotion/react @emotion/styled
```

<details>
<summary>Older versions</summary>

Expand All @@ -67,51 +57,27 @@ Use `@latest` for the latest stable release.

Base UI is available as an [npm package](https://www.npmjs.com/package/@mui/base).

**npm:**

```bash
npm install @mui/base
```

**yarn:**

```bash
yarn add @mui/base
```

**Note**: Base UI is still in beta.
We are adding new components regularly and you're welcome to contribute!

### MUI System

MUI System is available as an [npm package](https://www.npmjs.com/package/@mui/system).

**npm:**

```bash
npm install @mui/system @emotion/react @emotion/styled
```

**yarn:**

```bash
yarn add @mui/system @emotion/react @emotion/styled
```

Or if you want to use styled-components as the styling engine:

**npm:**

```bash
npm install @mui/material @mui/styled-engine-sc styled-components
```

**yarn:**

```bash
yarn add @mui/material @mui/styled-engine-sc styled-components
```

Visit our [styled-components guide](https://mui.com/material-ui/guides/styled-components/) for more information on configuration.

## Sponsors
Expand Down Expand Up @@ -176,9 +142,9 @@ Our documentation features [a collection of example projects using Material UI](

## Documentation

- [Material UI](https://mui.com/material-ui/getting-started/)
- [Material UI](https://mui.com/material-ui)
- [Joy UI](https://mui.com/joy-ui/getting-started/)
- [Base UI](https://mui.com/base-ui/getting-started/)
- [Base UI](https://mui.com/base-ui/)
- [MUI System](https://mui.com/system/getting-started/)

## Premium themes
Expand Down
37 changes: 0 additions & 37 deletions docs/data/base/getting-started/overview/overview-pt.md

This file was deleted.

37 changes: 0 additions & 37 deletions docs/data/base/getting-started/overview/overview-zh.md

This file was deleted.

4 changes: 2 additions & 2 deletions docs/data/base/getting-started/overview/overview.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@ title: Overview

## Introduction

Base UI is a library of unstyled React UI components and low-level hooks.
These components were extracted from [Material UI](/material-ui/getting-started/), and are now available as a standalone package.
Base UI is a library of unstyled React UI components and hooks.
These components were extracted from [Material UI](/material-ui/), and are now available as a standalone package.
They feature the same robust engineering but without implementing Material Design.

Base UI includes prebuilt components with production-ready functionality, along with low-level hooks for transferring that functionality to other components.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,6 @@ githubLabel: 'component: ClickAwayListener'
:::warning
Please refer to the [Click-Away Listener](/base-ui/react-click-away-listener/) component page in the Base UI docs for demos and details on usage.

Click-Away Listener is a part of the standalone [Base UI](/base-ui/getting-started/) component library.
Click-Away Listener is a part of the standalone [Base UI](/base-ui/) component library.
It is currently re-exported from `@mui/material` for your convenience, but it will be removed from this package in a future major version, after `@mui/base` gets a stable release.
:::
2 changes: 1 addition & 1 deletion docs/data/material/components/no-ssr/no-ssr.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,6 @@ components: NoSsr
:::warning
Please refer to the [No-SSR](/base-ui/react-no-ssr/) component page in the Base UI docs for demos and details on usage.

No-SSR is a part of the standalone [Base UI](/base-ui/getting-started/) component library.
No-SSR is a part of the standalone [Base UI](/base-ui/) component library.
It is currently re-exported from `@mui/material` for your convenience, but it will be removed from this package in a future major version, after `@mui/base` gets a stable release.
:::
2 changes: 1 addition & 1 deletion docs/data/material/components/portal/portal.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,6 @@ githubLabel: 'component: Portal'
:::warning
Please refer to the [Portal](/base-ui/react-portal/) component page in the Base UI docs for demos and details on usage.

Portal is a part of the standalone [Base UI](/base-ui/getting-started/) component library.
Portal is a part of the standalone [Base UI](/base-ui/) component library.
It is currently re-exported from `@mui/material` for your convenience, but it will be removed from this package in a future major version, after `@mui/base` gets a stable release.
:::
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,6 @@ githubLabel: 'component: TextareaAutosize'
:::warning
Please refer to the [Textarea Autosize](/base-ui/react-textarea-autosize/) component page in the Base UI docs for demos and details on usage.

Textarea Autosize is a part of the standalone [Base UI](/base-ui/getting-started/) component library.
Textarea Autosize is a part of the standalone [Base UI](/base-ui/) component library.
It is currently re-exported from `@mui/material` for your convenience, but it will be removed from this package in a future major version, after `@mui/base` gets a stable release.
:::
2 changes: 1 addition & 1 deletion docs/data/material/discover-more/backers/backers.md
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ via [Open Collective](https://opencollective.com/mui)

### Why is Material UI a "crowd-funded open-source project"?

Material UI (as well as [Base UI](/base-ui/getting-started/) and [Joy UI](/joy-ui/getting-started/)) is open-source to give users great freedom in how they use the software, and to enable the community to have influence over how the project progresses to make it appropriate for a wide range of use-cases. To ensure that MUI's component libraries can stand the test of time for our users, they need to be well directed and financially sustainable.
Material UI (as well as [Base UI](/base-ui/) and [Joy UI](/joy-ui/getting-started/)) is open-source to give users great freedom in how they use the software, and to enable the community to have influence over how the project progresses to make it appropriate for a wide range of use-cases. To ensure that MUI's component libraries can stand the test of time for our users, they need to be well directed and financially sustainable.

The absolute best way to support MUI's libraries ongoing development efforts is to become a sponsor. Crowd-sourced funding enables us to spend the most time directly working on improving MUI's products, which you and other MUI users then benefit from.

Expand Down
35 changes: 0 additions & 35 deletions docs/data/material/getting-started/overview/overview-pt.md

This file was deleted.

35 changes: 0 additions & 35 deletions docs/data/material/getting-started/overview/overview-zh.md

This file was deleted.

4 changes: 2 additions & 2 deletions docs/data/material/getting-started/overview/overview.md
Original file line number Diff line number Diff line change
Expand Up @@ -33,9 +33,9 @@ You can follow [this GitHub issue](https://github.com/mui/material-ui/issues/293
It's almost as old as React itself—its history stretches back to 2014—and we're in this for the long haul.
You can count on the community's support for years to come (e.g. [Stack Overflow](https://insights.stackoverflow.com/trends?tags=material-ui)).

## Material UI vs. Base UI
## Material UI vs. Base UI

Material UI and [Base UI](/base-ui/getting-started/) feature many of the same UI components, but Base UI comes without any default styles or styling solutions.
Material UI and [Base UI](/base-ui/) feature many of the same UI components, but Base UI comes without any default styles or styling solutions.

Material UI is _comprehensive_ in that it comes packaged with default styles, and is optimized to work with [Emotion](https://emotion.sh/) (or [styled-components](https://styled-components.com/)).

Expand Down
Loading

0 comments on commit 8087943

Please sign in to comment.